From 013ed5a3088c81c5f45e37339fb183eb8a840370 Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 04:26:48 +0900 Subject: [PATCH 1/7] Add basic storybook addons --- client/package.json | 3 ++ client/src/.storybook/addons.js | 3 ++ client/yarn.lock | 53 +++++++++++++++++++++++++++++++++ 3 files changed, 59 insertions(+) diff --git a/client/package.json b/client/package.json index 4a3527a..5349a28 100644 --- a/client/package.json +++ b/client/package.json @@ -45,6 +45,9 @@ }, "devDependencies": { "@babel/core": "7.2.2", + "@storybook/addon-actions": "4.1.11", + "@storybook/addon-links": "4.1.11", + "@storybook/addon-notes": "4.1.11", "@storybook/addon-storysource": "4.1.11", "@storybook/addons": "4.1.11", "@storybook/react": "4.1.11", diff --git a/client/src/.storybook/addons.js b/client/src/.storybook/addons.js index b94b37f..18dbddc 100644 --- a/client/src/.storybook/addons.js +++ b/client/src/.storybook/addons.js @@ -1 +1,4 @@ import '@storybook/addon-storysource/register' +import '@storybook/addon-actions/register' +import '@storybook/addon-links/register' +import '@storybook/addon-notes/register' diff --git a/client/yarn.lock b/client/yarn.lock index 5db256f..6f7833c 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -1038,6 +1038,49 @@ dependencies: any-observable "^0.3.0" +"@storybook/addon-actions@4.1.11": + version "4.1.11" + resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-4.1.11.tgz#8946ea78f050ae2d06a2f2231ec56d1831942e15" + integrity sha512-iVsxEPmOCuPMAaJhHbpxQhzEPzKnZad4GELNfKrwmmvv3mY+3UN/z208HguW4NHjhMJZVYSS3H/qic8CQS+pHw== + dependencies: + "@emotion/core" "^0.13.1" + "@emotion/provider" "^0.11.2" + "@emotion/styled" "^0.10.6" + "@storybook/addons" "4.1.11" + "@storybook/components" "4.1.11" + "@storybook/core-events" "4.1.11" + core-js "^2.5.7" + deep-equal "^1.0.1" + global "^4.3.2" + lodash "^4.17.11" + make-error "^1.3.5" + prop-types "^15.6.2" + react-inspector "^2.3.0" + uuid "^3.3.2" + +"@storybook/addon-links@4.1.11": + version "4.1.11" + resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-4.1.11.tgz#50e782eba46de3aac91f05a26ca92e2a5d13aa19" + integrity sha512-aMmOjx3bp4x/TcAthlTc0ULGHMrq9eff1/2Ij9IZzqOi56fXygXpK/yiw/c9AHFFfP1r4v+RObz5pS46rvoCtg== + dependencies: + "@storybook/addons" "4.1.11" + "@storybook/components" "4.1.11" + "@storybook/core-events" "4.1.11" + core-js "^2.5.7" + global "^4.3.2" + prop-types "^15.6.2" + +"@storybook/addon-notes@4.1.11": + version "4.1.11" + resolved "https://registry.yarnpkg.com/@storybook/addon-notes/-/addon-notes-4.1.11.tgz#bda018553e007080e73fce2d33495139a57222e5" + integrity sha512-Fdc3YIYDVh7+WjcoWEvbyO5qnya4RLGzP2lxvaIllegMHIu8wU0ber7yb7+vRMa4XGbulUm4nU64D+H1liGlQw== + dependencies: + "@emotion/styled" "^0.10.6" + "@storybook/addons" "4.1.11" + core-js "^2.5.7" + marked "^0.5.2" + prop-types "^15.6.2" + "@storybook/addon-storysource@4.1.11": version "4.1.11" resolved "https://registry.yarnpkg.com/@storybook/addon-storysource/-/addon-storysource-4.1.11.tgz#c758a3b4027775fad4602dda1e1ba77cbcc994ce" @@ -5639,6 +5682,11 @@ make-dir@^1.0.0: dependencies: pify "^3.0.0" +make-error@^1.3.5: + version "1.3.5" + resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.5.tgz#efe4e81f6db28cadd605c70f29c831b58ef776c8" + integrity sha512-c3sIjNUow0+8swNwVpqoH4YCShKNFkMaw6oH1mNS2haDZQqkeZFlHS3dhoeEbKKmJB4vXpJucU6oH75aDYeE9g== + map-age-cleaner@^0.1.1: version "0.1.3" resolved "https://registry.yarnpkg.com/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz#7d583a7306434c055fe474b0f45078e6e1b4b92a" @@ -5658,6 +5706,11 @@ map-visit@^1.0.0: dependencies: object-visit "^1.0.0" +marked@^0.5.2: + version "0.5.2" + resolved "https://registry.yarnpkg.com/marked/-/marked-0.5.2.tgz#3efdb27b1fd0ecec4f5aba362bddcd18120e5ba9" + integrity sha512-fdZvBa7/vSQIZCi4uuwo2N3q+7jJURpMVCcbaX0S1Mg65WZ5ilXvC67MviJAsdjqqgD+CEq4RKo5AYGgINkVAA== + matcher@^1.0.0: version "1.1.1" resolved "https://registry.yarnpkg.com/matcher/-/matcher-1.1.1.tgz#51d8301e138f840982b338b116bb0c09af62c1c2" From bb38bafc9afe4692e4679f9803d3be9e79a32f15 Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 04:28:47 +0900 Subject: [PATCH 2/7] Remove misterious hello component --- client/src/app.tsx | 4 ++-- client/src/components/Hello.tsx | 7 ------- 2 files changed, 2 insertions(+), 9 deletions(-) delete mode 100644 client/src/components/Hello.tsx diff --git a/client/src/app.tsx b/client/src/app.tsx index f4f44d3..65251fc 100644 --- a/client/src/app.tsx +++ b/client/src/app.tsx @@ -7,7 +7,7 @@ import reducers from './reducers' import thunk from 'redux-thunk' import axios from 'axios' -import Hello from './components/Hello' +import TopPage from './components/pages/TopPage' import Auth from './components/utils/auth' import { ROOT_URL } from './constants' @@ -18,7 +18,7 @@ ReactDOM.render( - +

404 Not Found

} /> diff --git a/client/src/components/Hello.tsx b/client/src/components/Hello.tsx deleted file mode 100644 index d276bc3..0000000 --- a/client/src/components/Hello.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import * as React from 'react' - -import TopPage from './pages/TopPage' - -const Hello = () => - -export default Hello From 8b67ecd58d673981688b24fed5f8b9b89ba0fbb2 Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 06:49:04 +0900 Subject: [PATCH 3/7] Fix webpack config loader include --- client/src/.storybook/webpack.config.js | 2 +- client/src/components/pages/TopPage/index.tsx | 6 +----- 2 files changed, 2 insertions(+), 6 deletions(-) diff --git a/client/src/.storybook/webpack.config.js b/client/src/.storybook/webpack.config.js index 5bba5c4..b4cb17c 100644 --- a/client/src/.storybook/webpack.config.js +++ b/client/src/.storybook/webpack.config.js @@ -3,7 +3,7 @@ const path = require("path") module.exports = (baseConfig, env, defaultConfig) => { defaultConfig.module.rules.push({ test: /\.(ts|tsx)$/, - include: path.resolve(__dirname, '../components'), + include: path.resolve(__dirname, '../'), loader: require.resolve("ts-loader") }); diff --git a/client/src/components/pages/TopPage/index.tsx b/client/src/components/pages/TopPage/index.tsx index 63a0ba8..c5a8386 100644 --- a/client/src/components/pages/TopPage/index.tsx +++ b/client/src/components/pages/TopPage/index.tsx @@ -1,10 +1,6 @@ import * as React from 'react' import TopPageTemplate from '../../templates/TopPageTemplate' -class TopPage extends React.Component { - render(): JSX.Element { - return - } -} +const TopPage = () => export default TopPage From 0ed7bbccd0d91add5fbcf7ab1758b410cb6c9f31 Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 06:54:59 +0900 Subject: [PATCH 4/7] Delete comment and semi-colon --- client/src/.storybook/webpack.config.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/src/.storybook/webpack.config.js b/client/src/.storybook/webpack.config.js index b4cb17c..38dc4e4 100644 --- a/client/src/.storybook/webpack.config.js +++ b/client/src/.storybook/webpack.config.js @@ -5,9 +5,8 @@ module.exports = (baseConfig, env, defaultConfig) => { test: /\.(ts|tsx)$/, include: path.resolve(__dirname, '../'), loader: require.resolve("ts-loader") - }); + }) - // addon-storysource使うときだけ defaultConfig.module.rules.push({ test: /\.stories\.jsx?$/, loaders: [ @@ -17,7 +16,8 @@ module.exports = (baseConfig, env, defaultConfig) => { } ], enforce: "pre" - }); + }) + defaultConfig.resolve.extensions.push(".ts", ".tsx") return defaultConfig From b069ea01d0e707076516074fd61caba0f87c844f Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 07:11:02 +0900 Subject: [PATCH 5/7] Enable storysource --- client/src/.storybook/webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/.storybook/webpack.config.js b/client/src/.storybook/webpack.config.js index 38dc4e4..976995f 100644 --- a/client/src/.storybook/webpack.config.js +++ b/client/src/.storybook/webpack.config.js @@ -8,7 +8,7 @@ module.exports = (baseConfig, env, defaultConfig) => { }) defaultConfig.module.rules.push({ - test: /\.stories\.jsx?$/, + test: /\.stories\.tsx$/, loaders: [ { loader: require.resolve("@storybook/addon-storysource/loader"), From d8cc07a8815182a3f69b5bb97c46dcb038b0e490 Mon Sep 17 00:00:00 2001 From: TaishiM Date: Wed, 13 Feb 2019 19:56:40 +0900 Subject: [PATCH 6/7] Enable notes --- client/src/.storybook/config.js | 1 - client/src/.storybook/webpack.config.js | 6 +++--- .../src/components/atoms/Button/index.stories.tsx | 14 +++++++++----- .../components/organisms/Form/index.stories.tsx | 1 - 4 files changed, 12 insertions(+), 10 deletions(-) diff --git a/client/src/.storybook/config.js b/client/src/.storybook/config.js index 1a6115a..23cfd74 100644 --- a/client/src/.storybook/config.js +++ b/client/src/.storybook/config.js @@ -2,7 +2,6 @@ import { configure } from '@storybook/react' // storyファイルを一括取得 const req = require.context("../components", true, /.stories.(ts|tsx)$/) - function loadStories() { req.keys().forEach((filename) => req(filename)) } diff --git a/client/src/.storybook/webpack.config.js b/client/src/.storybook/webpack.config.js index 976995f..0e8f75f 100644 --- a/client/src/.storybook/webpack.config.js +++ b/client/src/.storybook/webpack.config.js @@ -4,7 +4,7 @@ module.exports = (baseConfig, env, defaultConfig) => { defaultConfig.module.rules.push({ test: /\.(ts|tsx)$/, include: path.resolve(__dirname, '../'), - loader: require.resolve("ts-loader") + loader: require.resolve("ts-loader"), }) defaultConfig.module.rules.push({ @@ -12,10 +12,10 @@ module.exports = (baseConfig, env, defaultConfig) => { loaders: [ { loader: require.resolve("@storybook/addon-storysource/loader"), - options: { parser: "typescript" } + options: { parser: "typescript" }, } ], - enforce: "pre" + enforce: "pre", }) defaultConfig.resolve.extensions.push(".ts", ".tsx") diff --git a/client/src/components/atoms/Button/index.stories.tsx b/client/src/components/atoms/Button/index.stories.tsx index 147ffdf..f55e3c7 100644 --- a/client/src/components/atoms/Button/index.stories.tsx +++ b/client/src/components/atoms/Button/index.stories.tsx @@ -3,11 +3,15 @@ import { storiesOf } from '@storybook/react' import Button from './index' storiesOf('Button', module) - .add('normal', () => ( - - )) + .add( + 'normal', + () => ( + + ), + { notes: 'This is a first note for Fortuna(test).' } + ) .add('primary', () => (