From d6b13e09bf5e2636f2b1029847aec784a96372da Mon Sep 17 00:00:00 2001 From: Eli Kinsey Date: Wed, 23 Mar 2022 02:06:54 -0700 Subject: [PATCH] Storybook fixes (#3205) * resolve storybook build errors * fix stories * update yarn.lock --- .storybook/main.js | 8 +++ package.json | 4 +- src/components/FeatureSnapshot/index.tsx | 2 +- src/components/Hero/index.stories.js | 14 ++++- yarn.lock | 74 ++++++++++++++++++++++++ 5 files changed, 98 insertions(+), 4 deletions(-) diff --git a/.storybook/main.js b/.storybook/main.js index b6a7131b6..a3cf87597 100644 --- a/.storybook/main.js +++ b/.storybook/main.js @@ -22,6 +22,14 @@ module.exports = { }, typescript: { reactDocgen: false }, webpackFinal: async (config) => { + config.module.rules[0].use[0].options.plugins = [ + // use @babel/plugin-proposal-class-properties for class arrow functions + require.resolve('@babel/plugin-proposal-class-properties'), + // use babel-plugin-remove-graphql-queries to remove static queries from components when rendering in storybook + require.resolve('babel-plugin-remove-graphql-queries'), + ] + // Prefer Gatsby ES6 entrypoint (module) over commonjs (main) entrypoint + config.resolve.mainFields = ['browser', 'module', 'main'] config.resolve.modules = [path.resolve(__dirname, '..', 'src'), path.resolve(__dirname, '..', 'node_modules')] return config }, diff --git a/package.json b/package.json index 642cee246..cf39baf5a 100644 --- a/package.json +++ b/package.json @@ -80,6 +80,7 @@ "git-url-parse": "^11.6.0", "github-slugger": "^1.4.0", "gravatar": "^1.8.2", + "is-plain-object": "^5.0.0", "katex": "^0.12.0", "kea": "^2.2.2", "kea-loaders": "^0.3.0", @@ -158,7 +159,8 @@ "storybook-addon-gatsby": "0.0.2", "storybook-dark-mode": "^1.0.8", "style-loader": "^3.3.0", - "tailwindcss": "^2.2.4" + "tailwindcss": "^2.2.4", + "webpack": "5" }, "husky": { "hooks": { diff --git a/src/components/FeatureSnapshot/index.tsx b/src/components/FeatureSnapshot/index.tsx index 3b1a18717..285fad02b 100644 --- a/src/components/FeatureSnapshot/index.tsx +++ b/src/components/FeatureSnapshot/index.tsx @@ -2,7 +2,7 @@ import React from 'react' export function FeatureSnapshot({ image, - features, + features = [], reverse, }: { image: string diff --git a/src/components/Hero/index.stories.js b/src/components/Hero/index.stories.js index 265d9f749..a8c37cf24 100644 --- a/src/components/Hero/index.stories.js +++ b/src/components/Hero/index.stories.js @@ -1,9 +1,15 @@ import { CallToAction } from 'components/CallToAction' +import { getContext } from 'kea' import React from 'react' +import { Provider } from 'react-redux' import { Hero as HeroComponent } from '.' export default { - component: HeroComponent, + component: ( + + + + ), title: 'Components/Hero', argTypes: { ctas: { @@ -17,7 +23,11 @@ export default { }, } -export const Hero = (args) => +export const Hero = (args) => ( + + + +) Hero.args = { title: 'Self-hosted alternative to Google Analytics', subtitle: diff --git a/yarn.lock b/yarn.lock index 468cfde63..7d4646d44 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4725,6 +4725,14 @@ "@types/eslint" "*" "@types/estree" "*" +"@types/eslint-scope@^3.7.3": + version "3.7.3" + resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.3.tgz#125b88504b61e3c8bc6f870882003253005c3224" + integrity sha512-PB3ldyrcnAicT35TWPs5IcwKD8S333HMaa2VVv4+wdvebJkjWuW/xESoB8IwRcog8HYVYamb1g/R31Qv5Bx03g== + dependencies: + "@types/eslint" "*" + "@types/estree" "*" + "@types/eslint-visitor-keys@^1.0.0": version "1.0.0" resolved "https://registry.npmjs.org/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz" @@ -4743,6 +4751,11 @@ resolved "https://registry.npmjs.org/@types/estree/-/estree-0.0.50.tgz" integrity sha512-C6N5s2ZFtuZRj54k2/zyRhNDjJwwcViAM3Nbm8zjBpbqAdZ00mr0CFxvSKeO8Y/e03WVFLpQMdHYVfUd6SB+Hw== +"@types/estree@^0.0.51": + version "0.0.51" + resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40" + integrity sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ== + "@types/events@*": version "3.0.0" resolved "https://registry.npmjs.org/@types/events/-/events-3.0.0.tgz" @@ -11007,6 +11020,14 @@ enhanced-resolve@^5.8.3: graceful-fs "^4.2.4" tapable "^2.2.0" +enhanced-resolve@^5.9.2: + version "5.9.2" + resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.9.2.tgz#0224dcd6a43389ebfb2d55efee517e5466772dd9" + integrity sha512-GIm3fQfwLJ8YZx2smuHpBKkXC1yOk+OBEmKckVyL0i/ea8mqDEykK3ld5dgH1QYPNyT/lIllxV2LULnxCHaHkA== + dependencies: + graceful-fs "^4.2.4" + tapable "^2.2.0" + enquire.js@^2.1.1, enquire.js@^2.1.6: version "2.1.6" resolved "https://registry.npmjs.org/enquire.js/-/enquire.js-2.1.6.tgz" @@ -14071,6 +14092,11 @@ graceful-fs@^4.1.10, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1. resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz" integrity sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ== +graceful-fs@^4.2.9: + version "4.2.9" + resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96" + integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ== + graphlib@^2.1.8: version "2.1.8" resolved "https://registry.yarnpkg.com/graphlib/-/graphlib-2.1.8.tgz#5761d414737870084c92ec7b5dbcb0592c9d35da" @@ -15954,6 +15980,11 @@ is-plain-object@^2.0.3, is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" +is-plain-object@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-5.0.0.tgz#4427f50ab3429e9025ea7d52e9043a9ef4159344" + integrity sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q== + is-png@^2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/is-png/-/is-png-2.0.0.tgz" @@ -27607,6 +27638,14 @@ watchpack@^2.2.0: glob-to-regexp "^0.4.1" graceful-fs "^4.1.2" +watchpack@^2.3.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-2.3.1.tgz#4200d9447b401156eeca7767ee610f8809bc9d25" + integrity sha512-x0t0JuydIo8qCNctdDrn1OzH/qDzk2+rdCOC3YzumZ42fiMqmQ7T3xQurykYMhYfHaPHTp4ZxAx2NfUo1K6QaA== + dependencies: + glob-to-regexp "^0.4.1" + graceful-fs "^4.1.2" + wbuf@^1.1.0, wbuf@^1.7.3: version "1.7.3" resolved "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz" @@ -27765,6 +27804,11 @@ webpack-sources@^3.2.0: resolved "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.1.tgz" integrity sha512-t6BMVLQ0AkjBOoRTZgqrWm7xbXMBzD+XDq2EZ96+vMfn3qKgsvdXZhbPZ4ElUOpdv4u+iiGe+w3+J75iy/bYGA== +webpack-sources@^3.2.3: + version "3.2.3" + resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde" + integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w== + webpack-stats-plugin@^0.3.2: version "0.3.2" resolved "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.3.2.tgz" @@ -27811,6 +27855,36 @@ webpack@4, webpack@^4.44.1: watchpack "^1.7.4" webpack-sources "^1.4.1" +webpack@5: + version "5.70.0" + resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.70.0.tgz#3461e6287a72b5e6e2f4872700bc8de0d7500e6d" + integrity sha512-ZMWWy8CeuTTjCxbeaQI21xSswseF2oNOwc70QSKNePvmxE7XW36i7vpBMYZFAUHPwQiEbNGCEYIOOlyRbdGmxw== + dependencies: + "@types/eslint-scope" "^3.7.3" + "@types/estree" "^0.0.51" + "@webassemblyjs/ast" "1.11.1" + "@webassemblyjs/wasm-edit" "1.11.1" + "@webassemblyjs/wasm-parser" "1.11.1" + acorn "^8.4.1" + acorn-import-assertions "^1.7.6" + browserslist "^4.14.5" + chrome-trace-event "^1.0.2" + enhanced-resolve "^5.9.2" + es-module-lexer "^0.9.0" + eslint-scope "5.1.1" + events "^3.2.0" + glob-to-regexp "^0.4.1" + graceful-fs "^4.2.9" + json-parse-better-errors "^1.0.2" + loader-runner "^4.2.0" + mime-types "^2.1.27" + neo-async "^2.6.2" + schema-utils "^3.1.0" + tapable "^2.1.1" + terser-webpack-plugin "^5.1.3" + watchpack "^2.3.1" + webpack-sources "^3.2.3" + webpack@^5.9.0: version "5.57.1" resolved "https://registry.npmjs.org/webpack/-/webpack-5.57.1.tgz"