Configure storybook

.storybook/addons.js

@@ -0,0 +1,3 @@
+import '@storybook/addon-actions/register';
+import '@storybook/addon-links/register';
+import '@storybook/addon-viewport/register';

.storybook/config.tsx

@@ -0,0 +1,13 @@
+import { configure, addDecorator } from '@storybook/react';
+
+import storyDecorator from './storyDecorator';
+
+const req = require.context('../packages/app', true, /\.story\.[tj]sx?$/);
+
+function loadStories() {
+  req.keys().forEach(filename => req(filename));
+}
+
+addDecorator(storyDecorator);
+
+configure(loadStories, module);

.storybook/storyDecorator.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ContextProvider } from 'app/shell';
+import { browserHistory } from 'app/services/history';
+import storeFactory from 'app/storeFactory';
+
+const store = storeFactory();
+
+export default story => (
+  <ContextProvider store={store} history={browserHistory}>
+    {story()}
+  </ContextProvider>
+);

.storybook/webpack.config.js

@@ -0,0 +1,14 @@
+const rootConfig = require('../webpack.config');
+
+module.exports = async ({ config }) => ({
+  ...config,
+  resolve: rootConfig.resolve,
+  module: {
+    ...config.module,
+    // our rules should satisfy all storybook needs,
+    // so replace all storybook defaults with our rules
+    rules: rootConfig.module.rules,
+  },
+
+  resolveLoader: rootConfig.resolveLoader,
+});