Merge pull request #685 from lightninglabs/update-deps

chore: update NPM dependencies

Author: jamaljsr

app/.storybook/main.js

@@ -4,6 +4,7 @@ module.exports = {
     '../src/__stories__/LoopPage.stories.tsx',
     '../src/**/*.stories.@(ts|tsx|js|jsx|mdx)',
   ],
+
   addons: [
     '@storybook/preset-create-react-app',
     '@storybook/addon-actions',
@@ -15,12 +16,19 @@ module.exports = {
       },
     },
   ],
-  core: {
-    builder: 'webpack5'
-  },
+
   features: {
     // Emotion11 quasi compatibility issue with storybook. Disabling feature flag to support emotion11.
     // https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#emotion11-quasi-compatibility
     emotionAlias: false,
   },
+
+  framework: {
+    name: '@storybook/react-webpack5',
+    options: {}
+  },
+
+  docs: {
+    autodocs: true
+  }
 };

app/.storybook/preview.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { addDecorator } from '@storybook/react';
+import { Preview } from '@storybook/react';
 import '../src/App.scss';
 import '../src/i18n';
 import StoryWrapper from '../src/__stories__/StoryWrapper';
@@ -10,8 +10,18 @@ import StoryWrapper from '../src/__stories__/StoryWrapper';
  *  - include the theme & store providers
  *  - use Storybook parameters to customize the width of the wrapper
  */
-addDecorator((StoryFn, ctx) => (
-  <StoryWrapper centered={ctx.parameters.centered} contained={ctx.parameters.contained}>
-    <StoryFn {...ctx} />
-  </StoryWrapper>
-));
+
+const preview: Preview = {
+  decorators: [
+    (StoryFn, ctx) => (
+      <StoryWrapper
+        centered={ctx.parameters.centered}
+        contained={ctx.parameters.contained}
+      >
+        <StoryFn {...ctx} />
+      </StoryWrapper>
+    ),
+  ],
+};
+
+export default preview;

app/package.json

@@ -9,14 +9,14 @@
     "develop": "REACT_APP_USE_SAMPLE_DATA=true yarn start",
     "build": "react-scripts build",
     "postbuild": "echo '# Keep directory in git.' > build/.gitkeep",
-    "test": "react-scripts test --env=jest-environment-jsdom",
+    "test": "react-scripts test --env=jest-environment-jsdom --transformIgnorePatterns \"node_modules/(?!d3)/\"",
     "test:ci": "cross-env CI=true yarn test --coverage",
     "eject": "react-scripts eject",
     "lint": "eslint --ext .ts,.tsx --ignore-path .eslintignore .",
     "tsc": "tsc --noEmit",
     "protos": "node ./scripts/build-protos.js",
-    "storybook": "start-storybook -p 9009 -s public",
-    "build-storybook": "build-storybook -s public"
+    "storybook": "storybook dev -p 9009 -s public",
+    "build-storybook": "storybook build -s public"
   },
   "dependencies": {
     "@emotion/react": "11.4.0",
@@ -27,7 +27,7 @@
     "bootstrap": "4.6.1",
     "buffer": "6.0.3",
     "copy-to-clipboard": "3.3.1",
-    "d3": "6.3.1",
+    "d3": "7.8.5",
     "date-fns": "2.14.0",
     "debug": "4.3.1",
     "file-saver": "2.0.2",
@@ -47,29 +47,27 @@
     "react": "17.0.2",
     "react-collapse": "^5.1.1",
     "react-dom": "17.0.2",
-    "react-i18next": "11.7.0",
+    "react-i18next": "13.5.0",
     "react-router-dom": "^6.3.0",
-    "react-scripts": "^5.0.1",
     "react-toastify": "6.0.6",
     "react-virtualized": "9.21.2",
     "reactour": "1.18.0",
     "semver": "^7.5.2",
     "styled-components": "5.1.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "6.5.9",
-    "@storybook/addon-docs": "6.5.9",
-    "@storybook/addon-links": "6.5.9",
-    "@storybook/addons": "6.5.9",
-    "@storybook/builder-webpack5": "6.5.9",
-    "@storybook/manager-webpack5": "6.5.9",
-    "@storybook/preset-create-react-app": "4.1.2",
-    "@storybook/react": "6.5.9",
+    "@storybook/addon-actions": "7.5.3",
+    "@storybook/addon-docs": "7.5.3",
+    "@storybook/addon-links": "7.5.3",
+    "@storybook/addons": "7.5.3",
+    "@storybook/preset-create-react-app": "7.5.3",
+    "@storybook/react": "7.5.3",
+    "@storybook/react-webpack5": "7.5.3",
     "@testing-library/jest-dom": "5.11.5",
     "@testing-library/react": "11.1.1",
     "@testing-library/user-event": "12.2.0",
     "@types/big.js": "6.1.1",
-    "@types/d3": "6.2.0",
+    "@types/d3": "7.4.3",
     "@types/debug": "4.1.5",
     "@types/file-saver": "2.0.1",
     "@types/google-protobuf": "3.7.2",
@@ -93,10 +91,17 @@
     "jest-canvas-mock": "2.3.0",
     "jest-environment-jsdom": "27.5.1",
     "prettier": "2.1.2",
+    "react-scripts": "^5.0.1",
     "sass": "1.43.4",
+    "storybook": "7.5.3",
     "ts-protoc-gen": "0.12.0",
     "typescript": "4.1.6",
-    "webpack": "5"
+    "webpack": "5.89.0"
+  },
+  "resolutions": {
+    "strip-ansi": "6.0.1",
+    "jackspeak": "2.1.1",
+    "wrap-ansi": "7.0.0"
   },
   "eslintConfig": {
     "extends": "react-app",