Merge branch 'deploy-site'

package.json

@@ -1,61 +1,64 @@
 {
-	"name": "ssconnect",
-	"version": "0.1.0",
-	"private": true,
-	"scripts": {
-		"start": "react-scripts start",
-		"build": "react-scripts build",
-		"test": "react-scripts test --env=jsdom",
-		"eject": "react-scripts eject",
-		"s2s": "s2s",
-		"storybook": "start-storybook -p 9009 -s public",
-		"build-storybook": "build-storybook -s public",
-		"precommit": "lint-staged"
-	},
-	"dependencies": {
-		"camelcase-keys": "^4.1.0",
-		"lodash": "^4.17.4",
-		"material-ui": "^0.19.4",
-		"moment": "^2.19.1",
-		"normalizr": "^3.2.4",
-		"react": "^16.0.0",
-		"react-dom": "^16.0.0",
-		"react-fontawesome": "^1.6.1",
-		"react-redux": "^5.0.6",
-		"react-scripts": "1.0.14",
-		"redux": "^3.7.2",
-		"redux-persist": "^4.10.1",
-		"redux-thunk": "^2.2.0",
-		"styled-components": "^2.2.1",
-		"superagent": "^3.8.0"
-	},
-	"devDependencies": {
-		"@storybook/addon-actions": "^3.2.12",
-		"@storybook/addon-links": "^3.2.12",
-		"@storybook/react": "^3.2.12",
-		"babel-eslint": "^7.2.3",
-		"enzyme": "^3.0.0",
-		"enzyme-adapter-react-16": "^1.0.0",
-		"enzyme-to-json": "^3.0.1",
-		"eslint": "^4.1.1",
-		"eslint-config-react-app": "^2.0.1",
-		"eslint-plugin-flowtype": "^2.34.1",
-		"eslint-plugin-import": "^2.6.0",
-		"eslint-plugin-jsx-a11y": "^5.1.1",
-		"eslint-plugin-react": "^7.1.0",
-		"flow-bin": "^0.56.0",
-		"husky": "^0.14.3",
-		"lint-staged": "^4.3.0",
-		"prettier": "^1.7.4",
-		"react-test-renderer": "^16.0.0",
-		"s2s": "^0.7.0",
-		"s2s-plugins-redux": "^0.1.0",
-		"storybook-addon-material-ui": "^0.8.2"
-	},
-	"lint-staged": {
-		"*.js": [
-			"prettier --config ./.prettierrc --write",
-			"git add"
-		]
-	}
+  "name": "ssconnect",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject",
+    "s2s": "s2s",
+    "storybook": "start-storybook -p 9009 -s public",
+    "build-storybook": "build-storybook -s public",
+    "deploy": "gh-pages -d build",
+    "precommit": "lint-staged"
+  },
+  "homepage": "https://ssconnect.github.io/ssconnect",
+  "dependencies": {
+    "camelcase-keys-recursive": "^0.8.2",
+    "lodash": "^4.17.4",
+    "material-ui": "^0.19.4",
+    "moment": "^2.19.1",
+    "normalizr": "^3.2.4",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "react-fontawesome": "^1.6.1",
+    "react-redux": "^5.0.6",
+    "react-scripts": "1.0.14",
+    "redux": "^3.7.2",
+    "redux-persist": "^4.10.1",
+    "redux-thunk": "^2.2.0",
+    "styled-components": "^2.2.1",
+    "superagent": "^3.8.0"
+  },
+  "devDependencies": {
+    "@storybook/addon-actions": "^3.2.12",
+    "@storybook/addon-links": "^3.2.12",
+    "@storybook/react": "^3.2.12",
+    "babel-eslint": "^7.2.3",
+    "enzyme": "^3.0.0",
+    "enzyme-adapter-react-16": "^1.0.0",
+    "enzyme-to-json": "^3.0.1",
+    "eslint": "^4.1.1",
+    "eslint-config-react-app": "^2.0.1",
+    "eslint-plugin-flowtype": "^2.34.1",
+    "eslint-plugin-import": "^2.6.0",
+    "eslint-plugin-jsx-a11y": "^5.1.1",
+    "eslint-plugin-react": "^7.1.0",
+    "flow-bin": "^0.56.0",
+    "gh-pages": "^1.0.0",
+    "husky": "^0.14.3",
+    "lint-staged": "^4.3.0",
+    "prettier": "^1.7.4",
+    "react-test-renderer": "^16.0.0",
+    "s2s": "^0.7.0",
+    "s2s-plugins-redux": "^0.1.0",
+    "storybook-addon-material-ui": "^0.8.2"
+  },
+  "lint-staged": {
+    "*.js": [
+      "prettier --config ./.prettierrc --write",
+      "git add"
+    ]
+  }
 }

src/api/client.js

@@ -1,6 +1,6 @@
 // @flow
 
-import camelcaseKeys from 'camelcase-keys'
+import camelcaseKeysRecursive from 'camelcase-keys-recursive'
 import { normalizeStories } from './normalize'
 import request from 'superagent'
 import _ from 'lodash'
@@ -27,7 +27,7 @@ const host =
     ? // ? 'http://localhost:3001'
       'https://ssconnect.elzup.com'
     : 'https://ssconnect.elzup.com'
-const TIMEOUT = 1000
+const TIMEOUT = 5000
 
 const baseHeaders = {
   'Content-Type': 'application/json',
@@ -78,10 +78,16 @@ export async function getStories(
 
   // { stories: res.data, pageInfo: FeedClient.getPageInfo(res) }
   const normalizedData = normalizeStories(res.body)
-  const camelizedData = camelcaseKeys(normalizedData, { deep: true })
+  const camelizedData = camelcaseKeysRecursive(normalizedData, { deep: true })
   const pageInfo = getPageInfo(res)
 
-  return { ..._.mapValues(camelizedData.entities, _.values), pageInfo }
+  return {
+    stories: [],
+    articles: [],
+    blogs: [],
+    ..._.mapValues(camelizedData.entities, _.values),
+    pageInfo,
+  }
 }
 
 function getPageInfo(res: any): PageInfo {
@@ -101,5 +107,5 @@ export async function getTags(timeout: number = TIMEOUT): Promise<Tag[]> {
     })
   })
 
-  return _.values(camelcaseKeys(res.body, { deep: true }))
+  return _.values(camelcaseKeysRecursive(res.body, { deep: true }))
 }

src/components/BottomBar/index.js

@@ -2,6 +2,7 @@
 import * as React from 'react'
 import FontAwesome from 'react-fontawesome'
 import styled from 'styled-components'
+import _ from 'lodash'
 
 import {
   BottomNavigation,
@@ -23,30 +24,42 @@ const Wrapper = styled.div`
   width: 100%;
 `
 
+function getTitle(screen: Screen): string {
+  if (screen.type === 'new') {
+    return '新着'
+  } else if (screen.type === 'search') {
+    return '検索'
+  } else if (screen.type === 'profile') {
+    return _.compact([screen.q, screen.tag]).join(' | ')
+  }
+  return ''
+}
+
 function typeConsts(screen: Screen): { iconName: string, label: string } {
+  const label = getTitle(screen)
   switch (screen.type) {
     case 'new': {
       return {
         iconName: 'home',
-        label: '新着',
+        label,
       }
     }
     case 'search': {
       return {
         iconName: 'search',
-        label: '検索',
+        label,
       }
     }
     case 'profile': {
       return {
         iconName: 'tag',
-        label: screen.q,
+        label,
       }
     }
     default: {
       return {
         iconName: '',
-        label: '',
+        label,
       }
     }
   }

src/containers/ScreensContainer/actionTypes.js

@@ -7,11 +7,14 @@ export const PAGE_CHANGE: 'ScreensContainer/PAGE_CHANGE' =
   'ScreensContainer/PAGE_CHANGE'
 export const MAKE_SCREEN_PROFILE: 'ScreensContainer/MAKE_SCREEN_PROFILE' =
   'ScreensContainer/MAKE_SCREEN_PROFILE'
+export const DELETE_SCREEN_PROFILE: 'ScreensContainer/DELETE_SCREEN_PROFILE' =
+  'ScreensContainer/DELETE_SCREEN_PROFILE'
 
 export const Actions = {
   LOADED_SCREEN_STORIES,
   PAGE_CHANGE,
   MAKE_SCREEN_PROFILE,
+  DELETE_SCREEN_PROFILE,
 }
 
 export type LoadedScreenStories = {
@@ -33,4 +36,13 @@ export type MakeScreenProfile = {
   tag: string,
 }
 
-export type Action = LoadedScreenStories | PageChange | MakeScreenProfile
+export type DeleteScreenProfile = {
+  type: typeof DELETE_SCREEN_PROFILE,
+  screenId: number,
+}
+
+export type Action =
+  | LoadedScreenStories
+  | PageChange
+  | MakeScreenProfile
+  | DeleteScreenProfile

src/containers/ScreensContainer/actions.js

@@ -5,11 +5,13 @@ import {
   LOADED_SCREEN_STORIES,
   PAGE_CHANGE,
   MAKE_SCREEN_PROFILE,
+  DELETE_SCREEN_PROFILE,
 } from './actionTypes'
 import type {
   LoadedScreenStories,
   PageChange,
   MakeScreenProfile,
+  DeleteScreenProfile,
 } from './actionTypes'
 
 export function loadedScreenStories(
@@ -38,3 +40,9 @@ export function makeScreenProfile(q: string, tag: string): MakeScreenProfile {
     tag,
   }
 }
+export function deleteScreenProfile(screenId: number): DeleteScreenProfile {
+  return {
+    type: DELETE_SCREEN_PROFILE,
+    screenId,
+  }
+}

src/containers/ScreensContainer/index.js

@@ -2,8 +2,11 @@
 import * as React from 'react'
 import { connect, type Connector } from 'react-redux'
 import _ from 'lodash'
+import FlatButton from 'material-ui/FlatButton'
+import FontAwesome from 'react-fontawesome'
 
 import SearchForm from '../SearchFormContainer'
+import { deleteSubmit } from './logic'
 
 import type { State, Screen, System } from '../../types'
 import LoadingIndicator from '../../components/LoadingIndicator'
@@ -15,6 +18,7 @@ import styled from 'styled-components'
 type Props = {
   screens: Screen[],
   system: System,
+  deleteSubmit: Function,
 }
 
 const Fixer = styled.div`
@@ -26,6 +30,17 @@ const FixerMargin = styled.div`
   padding: 64px 0 54px;
 `
 
+function getTitle(screen: Screen): string {
+  if (screen.type === 'new') {
+    return '新着'
+  } else if (screen.type === 'search') {
+    return '検索'
+  } else if (screen.type === 'profile') {
+    return _.compact([screen.q, screen.tag]).join(' | ')
+  }
+  return ''
+}
+
 class Container extends React.Component<Props> {
   render() {
     const { props } = this
@@ -39,7 +54,6 @@ class Container extends React.Component<Props> {
   }
 
   renderScreen(screen: Screen, display: boolean) {
-    const title = screen.type === 'new' ? 'Home' : screen.q
     return (
       <div
         key={screen.id}
@@ -48,7 +62,18 @@ class Container extends React.Component<Props> {
         }}
       >
         <Fixer>
-          <AppBar showMenuIconButton={false} title={title} />
+          <AppBar
+            showMenuIconButton={false}
+            title={getTitle(screen)}
+            iconElementRight={
+              <FlatButton
+                icon={<FontAwesome name="minus" />}
+                onClick={() => {
+                  this.props.deleteSubmit(screen.id)
+                }}
+              />
+            }
+          />
         </Fixer>
         <FixerMargin>{this.renderScreenMain(screen)}</FixerMargin>
       </div>
@@ -75,6 +100,6 @@ const ms = (state: State) => ({
   system: state.System,
 })
 
-const conn: Connector<{}, Props> = connect(ms, {})
+const conn: Connector<{}, Props> = connect(ms, { deleteSubmit })
 
 export default conn(Container)

src/containers/ScreensContainer/logic.js

@@ -8,9 +8,25 @@ import { receiveStories } from '../StoriesContainer/actions'
 import { receiveBlogs } from '../BlogsContainer/actions'
 import { switchTab } from '../System/actions'
 import { receiveArticles } from '../ArticlesContainer/actions'
+import { loadTags } from '../TagById/logic'
 import * as actions from './actions'
 import * as selectors from './selectors'
 
+function sleep(ms: number) {
+  return new Promise(r => setTimeout(r, ms))
+}
+
+export function thunkWorld(): ThunkAction {
+  return async (dispatch, getState) => {
+    while (!getState().System.rehydrated) {
+      console.log('a')
+      await sleep(1000)
+    }
+    dispatch(loadScreenStoryAll())
+    dispatch(loadTags())
+  }
+}
+
 export function loadScreenStoryAll(): ThunkAction {
   return (dispatch, getState) => {
     _.each(getState().ScreensContainer, screen => {
@@ -60,3 +76,10 @@ export function searchSubmit(q: string, tag: string): ThunkAction {
     dispatch(loadScreenStory(screen))
   }
 }
+
+export function deleteSubmit(screenId: number): ThunkAction {
+  return async (dispatch, getState) => {
+    await dispatch(switchTab(screenId - 1))
+    await dispatch(actions.deleteScreenProfile(screenId))
+  }
+}

src/containers/ScreensContainer/reducer.js

@@ -33,6 +33,9 @@ export const initialState: State = {
 
 export default function(state: State = initialState, action: Action): State {
   switch (action.type) {
+    case Actions.DELETE_SCREEN_PROFILE:
+      return _.omit(state, [`${action.screenId}`])
+
     case Actions.MAKE_SCREEN_PROFILE:
       const id = Object.keys(state).length
       return {