Lint the storybook directory

.eslintignore

@@ -7,5 +7,9 @@ build
 .vercel
 storybook-static
 
+# Include the Storybook config files:
+# https://github.com/storybookjs/storybook/issues/295#issuecomment-340122758
+!.storybook
+
 # We ignore next.config.*js in the NPM lint script because
 # linting the config breaks Vercel builds.

.storybook/main.js

@@ -1,51 +1,56 @@
-const path = require('path');
-const dotenv = require('dotenv');
-const webpack = require('webpack');
-
+/* eslint import/no-extraneous-dependencies: 0 */
+const path = require('path')
+const dotenv = require('dotenv')
+const webpack = require('webpack')
 
 dotenv.config({
-	path: path.resolve(__dirname, '../.env.preview.info'),
-});
+  path: path.resolve(__dirname, '../.env.preview.info'),
+})
 
 // From:
 // https://github.com/storybookjs/storybook/issues/12270#issuecomment-1039631674
-const injectVars = Object.keys(process.env).reduce((c,key) => {
-  if(/^NEXT_PUBLIC_/.test(key)) {
-    c[`process.env.${key}`] = JSON.stringify(process.env[key]);
+const injectVars = Object.keys(process.env).reduce((c, key) => {
+  if (/^NEXT_PUBLIC_/.test(key)) {
+    // eslint-disable-next-line no-param-reassign
+    c[`process.env.${key}`] = JSON.stringify(process.env[key])
   }
-  return c;
+  return c
 }, {})
 
 function injectEnv(definitions) {
-  const env = 'process.env';
+  const env = 'process.env'
   if (!definitions[env]) {
     return {
       ...definitions,
       [env]: JSON.stringify(
         Object.fromEntries(
           Object.entries(definitions)
             .filter(([key]) => key.startsWith(env))
-            .map(([key, value]) => [key.substring(env.length + 1), JSON.parse(value)]),
-        ),
+            .map(([key, value]) => [
+              key.substring(env.length + 1),
+              JSON.parse(value),
+            ])
+        )
       ),
-    };
+    }
   }
-  return definitions;
+  return definitions
 }
 
 module.exports = {
   stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
   addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
   webpackFinal: (config) => {
-  	// Always use the browser version of the Sentry library.
-  	config.resolve.alias['@sentry/node'] = '@sentry/browser'
+    // Always use the browser version of the Sentry library.
+    // eslint-disable-next-line no-param-reassign
+    config.resolve.alias['@sentry/node'] = '@sentry/browser'
 
+    // eslint-disable-next-line no-param-reassign
     config.plugins = config.plugins.reduce((c, plugin) => {
-
-    	// Manually inject some environment variables. Otherwise,
-    	// only `STORYBOOK_*` prefix env vars are supported.
-    	// https://github.com/storybookjs/storybook/issues/12270#issuecomment-1039631674
-      if(plugin instanceof webpack.DefinePlugin) {
+      // Manually inject some environment variables. Otherwise,
+      // only `STORYBOOK_*` prefix env vars are supported.
+      // https://github.com/storybookjs/storybook/issues/12270#issuecomment-1039631674
+      if (plugin instanceof webpack.DefinePlugin) {
         return [
           ...c,
           new webpack.DefinePlugin(
@@ -57,12 +62,9 @@ module.exports = {
         ]
       }
 
-      return [
-        ...c,
-        plugin,
-      ]
-    }, []);
+      return [...c, plugin]
+    }, [])
 
-    return config;
+    return config
   },
 }

.storybook/preview.js

@@ -1,3 +1,4 @@
+import React from 'react'
 import { ThemeProvider } from '@material-ui/core/styles'
 import theme from 'src/utils/theme'
 import CssBaseline from '@material-ui/core/CssBaseline'