Merge pull request #4987 from leather-wallet/release/fix-stamps

Release/fix stamps

Author: fbwoolf

.dependency-cruiser.js

@@ -1,5 +1,5 @@
 /** @type {import('dependency-cruiser').IConfiguration} */
-module.exports = {
+export default {
   extends: 'dependency-cruiser/configs/recommended',
 
   forbidden: [
@@ -29,6 +29,8 @@ module.exports = {
       severity: 'error',
       from: {},
       to: {
+        // Types only package falsely triggers this rule
+        pathNot: ['@octokit'],
         // Depcruiser fails on some legitimate type imports, so allowing them there
         dependencyTypesNot: ['type-only'],
         couldNotResolve: true,
@@ -37,7 +39,10 @@ module.exports = {
     {
       name: 'no-orphans',
       severity: 'error',
-      from: { orphan: true, pathNot: ['^src/shared/models/global-types.ts'] },
+      from: {
+        orphan: true,
+        pathNot: ['^src/shared/models/global-types.ts', '^src/app/ui/icons/docs/icons-list.ts'],
+      },
       to: {},
     },
     {
@@ -66,7 +71,7 @@ module.exports = {
     {
       name: 'component-cannot-import-pages-or-features',
       severity: 'error',
-      from: { path: 'src/app/components*' },
+      from: { path: ['src/app/components*', 'src/app/ui'] },
       to: { path: ['^src/app/pages*', '^src/app/features/*'] },
     },
     {

.eslintrc.js renamed to .eslintrc.cjs

@@ -126,5 +126,9 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['*.mdx'],
+      extends: 'plugin:mdx/recommended',
+    },
   ],
 };

.github/actions/check-version-lock/check-version-lock.js

@@ -1,5 +1,6 @@
-const core = require('@actions/core');
-const appPackage = require('../../../package.json');
+import core from '@actions/core';
+
+import appPackage from '../../../package.json' assert { type: 'json' };
 
 const illegalVersionSymbol = ['~', '^', '>', '<'];
 
@@ -15,8 +16,8 @@ function containsIllegalChar(input) {
     const allPackages = [...Object.entries(dependencies), ...Object.entries(devDependencies)];
 
     const illegalPackages = allPackages
-      .filter(([package, version]) => containsIllegalChar(version))
-      .map(([package, version]) => ({ package, version }));
+      .filter(([pkg, version]) => containsIllegalChar(version))
+      .map(([pkg, version]) => ({ package: pkg, version }));
 
     if (illegalPackages.length > 0) {
       core.setFailed(`

.prettierrc.js

@@ -1,5 +1,3 @@
-const defaultConfig = require('@leather-wallet/prettier-config');
+import config from '@leather-wallet/prettier-config';
 
-module.exports = {
-  ...defaultConfig,
-};
+export default config;

.storybook/main.ts

@@ -7,6 +7,14 @@ const config: StorybookConfig = {
     '@storybook/addon-essentials',
     '@storybook/addon-onboarding',
     '@storybook/addon-interactions',
+    {
+      name: '@storybook/addon-docs',
+      options: {
+        csfPluginOptions: null,
+        mdxPluginOptions: {},
+        transcludeMarkdown: true,
+      },
+    },
     {
       name: '@storybook/addon-styling-webpack',
       options: {

.vscode/settings.json

@@ -2,5 +2,8 @@
   "prettier.documentSelectors": ["src/**/*.{ts,tsx}", "*.{js,json}"],
   "vitest.include": ["src/**/*.spec.ts"],
   "githubPullRequests.ignoredPullRequestBranches": ["dev"],
-  "typescript.preferences.preferTypeOnlyAutoImports": true
+  "typescript.preferences.preferTypeOnlyAutoImports": true,
+  "files.associations": {
+    "*.mdx": "markdown"
+  }
 }

package.json

@@ -6,15 +6,16 @@
   "author": {
     "name": "Leather Wallet LLC"
   },
+  "type": "module",
   "scripts": {
     "dev": "concurrently --raw \"node webpack/dev-server.js\" \"redux-devtools --hostname=localhost --port=8000\"",
-    "dev:test-app": "webpack serve --config test-app/webpack/webpack.config.dev.js",
+    "dev:test-app": "webpack serve --config test-app/webpack/webpack.config.dev.cjs",
     "build": "webpack --config webpack/webpack.config.prod.js",
     "build:analyze": "cross-env ANALYZE=true webpack --config webpack/webpack.config.prod.js",
     "build:dev": "cross-env WALLET_ENVIRONMENT=development webpack --config webpack/webpack.config.dev.js",
     "build:ext:test": "cross-env WALLET_ENVIRONMENT=testing webpack --config webpack/webpack.config.prod.js",
     "build:ext:test:watch": "cross-env WALLET_ENVIRONMENT=testing webpack --config webpack/webpack.config.prod.js --watch",
-    "build:test-app": "cross-env WALLET_ENVIRONMENT=production webpack --config ./test-app/webpack/webpack.config.prod.js",
+    "build:test-app": "cross-env WALLET_ENVIRONMENT=production webpack --config ./test-app/webpack/webpack.config.prod.cjs",
     "build:test": "concurrently 'yarn build:ext:test' 'yarn build:test-app'",
     "build:test-api": "concurrently 'yarn build:ext:test' 'yarn build:test-app'",
     "build:test:watch": "cross-env WALLET_ENVIRONMENT=testing webpack --config webpack/webpack.config.prod.js",
@@ -26,7 +27,7 @@
     "lint:fix": "eslint \"src/**/*.{ts,tsx}\" --fix",
     "lint:prettier": "prettier --check \"{src,tests}/**/*.{ts,tsx}\" \"*.{js,json}\"",
     "lint:prettier:fix": "prettier --write \"{src,tests}/**/*.{ts,tsx}\" *.js",
-    "lint:unused-exports": "ts-unused-exports tsconfig.json --ignoreFiles=leather-styles --ignoreFiles=tests --excludePathsFromReport=.*stories",
+    "lint:unused-exports": "ts-unused-exports tsconfig.json --ignoreFiles=icons --ignoreFiles=leather-styles --ignoreFiles=tests --excludePathsFromReport=.*stories",
     "lint:remote-wallet-config": "npx ajv-cli validate -s config/wallet-config.schema.json -d config/wallet-config.json",
     "lint:deps": "dependency-cruise  --config .dependency-cruiser.js \"src/**/*.{ts,tsx}\"",
     "prod:ext": "yarn build",
@@ -131,7 +132,7 @@
     "@dlc-link/dlc-tools": "1.1.1",
     "@fungible-systems/zone-file": "2.0.0",
     "@hirosystems/token-metadata-api-client": "1.2.0",
-    "@leather-wallet/tokens": "0.0.6",
+    "@leather-wallet/tokens": "0.0.8",
     "@ledgerhq/hw-transport-webusb": "6.27.19",
     "@noble/hashes": "1.3.2",
     "@noble/secp256k1": "2.0.0",
@@ -164,21 +165,21 @@
     "@stacks/transactions": "6.9.0",
     "@stacks/wallet-sdk": "6.9.0",
     "@stitches/react": "1.2.8",
-    "@storybook/addon-styling-webpack": "0.0.5",
+    "@storybook/addon-styling-webpack": "0.0.6",
     "@styled-system/theme-get": "5.1.2",
     "@tanstack/query-sync-storage-persister": "4.35.7",
     "@tanstack/react-query": "4.35.7",
     "@tanstack/react-query-devtools": "4.35.7",
     "@tanstack/react-query-persist-client": "4.35.7",
     "@types/lodash.uniqby": "4.7.7",
-    "@typescript-eslint/eslint-plugin": "6.7.4",
+    "@typescript-eslint/eslint-plugin": "7.0.2",
     "@vkontakte/vk-qr": "2.0.13",
     "@zondax/ledger-stacks": "1.0.4",
-    "alex-sdk": "0.1.23",
+    "alex-sdk": "0.1.24",
     "are-passive-events-supported": "1.1.1",
     "argon2-browser": "1.18.0",
     "assert": "2.0.0",
-    "axios": "1.6.0",
+    "axios": "1.6.7",
     "base64url": "3.0.1",
     "bignumber.js": "9.1.2",
     "bitcoin-address-validation": "2.2.1",
@@ -205,12 +206,12 @@
     "micro-packed": "0.3.2",
     "object-hash": "3.0.0",
     "observable-hooks": "4.2.3",
-    "pino": "8.17.2",
-    "postcss-preset-env": "9.3.0",
-    "prism-react-renderer": "2.2.0",
+    "pino": "8.19.0",
+    "postcss-preset-env": "9.4.0",
+    "prism-react-renderer": "2.3.1",
     "prismjs": "1.29.0",
     "promise-memoize": "1.2.1",
-    "punycode": "2.3.0",
+    "punycode": "2.3.1",
     "react": "18.2.0",
     "react-animate-height": "3.1.1",
     "react-async-hook": "4.0.0",
@@ -219,9 +220,9 @@
     "react-head": "3.4.2",
     "react-hot-toast": "2.4.1",
     "react-intersection-observer": "9.5.2",
-    "react-lottie": "1.2.3",
+    "react-lottie": "1.2.4",
     "react-redux": "8.1.3",
-    "react-router-dom": "6.21.1",
+    "react-router-dom": "6.22.1",
     "react-virtuoso": "4.6.0",
     "redux-persist": "6.0.0",
     "rxjs": "7.8.1",
@@ -234,15 +235,16 @@
     "valid-url": "1.0.9",
     "varuint-bitcoin": "1.1.2",
     "webextension-polyfill": "0.10.0",
-    "yup": "1.3.2",
+    "yup": "1.3.3",
     "zxcvbn": "4.4.2"
   },
   "devDependencies": {
     "@actions/core": "1.10.1",
     "@btckit/types": "0.0.19",
     "@leather-wallet/prettier-config": "0.0.1",
     "@ls-lint/ls-lint": "2.2.2",
-    "@pandacss/dev": "0.26.2",
+    "@mdx-js/loader": "3.0.0",
+    "@pandacss/dev": "0.32.0",
     "@playwright/test": "1.40.1",
     "@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
     "@redux-devtools/cli": "4.0.0",
@@ -251,96 +253,97 @@
     "@sentry/webpack-plugin": "2.10.2",
     "@stacks/connect-react": "22.2.0",
     "@stacks/stacks-blockchain-api-types": "6.3.4",
-    "@storybook/addon-essentials": "7.6.10",
-    "@storybook/addon-interactions": "7.6.10",
-    "@storybook/addon-links": "7.6.10",
-    "@storybook/addon-onboarding": "1.0.10",
-    "@storybook/blocks": "7.6.10",
-    "@storybook/react": "7.6.10",
-    "@storybook/react-webpack5": "7.6.10",
-    "@storybook/test": "7.6.10",
-    "@types/argon2-browser": "1.18.2",
-    "@types/chroma-js": "2.4.1",
-    "@types/chrome": "0.0.246",
-    "@types/dompurify": "3.0.3",
-    "@types/download": "8.0.2",
-    "@types/html-webpack-plugin": "3.2.7",
+    "@storybook/addon-docs": "7.6.17",
+    "@storybook/addon-essentials": "7.6.17",
+    "@storybook/addon-interactions": "7.6.17",
+    "@storybook/addon-links": "7.6.17",
+    "@storybook/addon-onboarding": "1.0.11",
+    "@storybook/blocks": "7.6.17",
+    "@storybook/react": "7.6.17",
+    "@storybook/react-webpack5": "7.6.17",
+    "@storybook/test": "7.6.17",
+    "@types/argon2-browser": "1.18.4",
+    "@types/chrome": "0.0.260",
+    "@types/dompurify": "3.0.5",
+    "@types/download": "8.0.5",
+    "@types/html-webpack-plugin": "3.2.9",
     "@types/jsdom": "21.1.3",
     "@types/lodash.get": "4.4.7",
-    "@types/node": "20.8.2",
-    "@types/object-hash": "3.0.4",
-    "@types/prismjs": "1.26.1",
+    "@types/node": "20.11.19",
+    "@types/prismjs": "1.26.3",
     "@types/promise-memoize": "1.2.4",
-    "@types/punycode": "2.1.3",
+    "@types/punycode": "2.1.4",
     "@types/qrcode.react": "1.0.5",
-    "@types/react": "18.2.47",
-    "@types/react-dom": "18.2.18",
-    "@types/react-lottie": "1.2.7",
+    "@types/react": "18.2.57",
+    "@types/react-dom": "18.2.19",
+    "@types/react-lottie": "1.2.10",
     "@types/react-router-dom": "5.3.3",
     "@types/remote-redux-devtools": "0.5.8",
     "@types/valid-url": "1.0.7",
     "@types/webextension-polyfill": "0.10.4",
     "@types/webpack": "5.28.5",
     "@types/zxcvbn": "4.4.4",
-    "@typescript-eslint/parser": "6.7.4",
-    "@vitest/coverage-istanbul": "1.1.3",
+    "@typescript-eslint/parser": "7.0.2",
+    "@vitest/coverage-istanbul": "1.3.1",
     "audit-ci": "6.6.1",
     "base64-loader": "1.0.0",
     "bip32": "4.0.0",
     "blns": "2.0.4",
-    "browserslist": "4.22.2",
-    "chromatic": "10.2.0",
+    "browserslist": "4.23.0",
+    "chromatic": "10.9.6",
     "chrome-webstore-upload-cli": "2.2.2",
     "clean-webpack-plugin": "4.0.0",
-    "concurrently": "8.0.1",
+    "concurrently": "8.2.2",
     "conventional-changelog-conventionalcommits": "7.0.2",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
     "crypto-browserify": "3.12.0",
     "deepmerge": "4.3.1",
-    "dependency-cruiser": "14.1.1",
+    "dependency-cruiser": "16.2.1",
     "dotenv-webpack": "8.0.1",
-    "esbuild": "0.19.11",
-    "esbuild-loader": "4.0.2",
+    "esbuild": "0.20.1",
+    "esbuild-loader": "4.0.3",
     "eslint-plugin-deprecation": "2.0.0",
+    "eslint-plugin-mdx": "3.1.5",
     "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",
-    "eslint-plugin-storybook": "0.6.15",
+    "eslint-plugin-storybook": "0.8.0",
     "file-loader": "6.2.0",
     "generate-json-webpack-plugin": "2.0.0",
     "html-webpack-plugin": "5.6.0",
     "jsdom": "22.1.0",
-    "postcss": "8.4.33",
-    "postcss-loader": "7.3.4",
-    "prettier": "3.0.3",
+    "postcss": "8.4.35",
+    "postcss-loader": "8.1.0",
+    "prettier": "3.2.5",
     "process": "0.11.10",
     "progress-bar-webpack-plugin": "2.1.0",
     "react-dev-utils": "12.0.1",
     "react-refresh": "0.14.0",
     "schema-inspector": "2.0.2",
     "speed-measure-webpack-plugin": "1.5.0",
-    "storybook": "7.6.12",
+    "storybook": "7.6.17",
     "stream-browserify": "3.0.0",
     "svg-url-loader": "8.0.0",
     "ts-node": "10.9.2",
     "ts-unused-exports": "10.0.1",
     "tsconfig-paths-webpack-plugin": "4.1.0",
     "typescript": "5.3.3",
-    "vitest": "1.1.3",
+    "vitest": "1.3.1",
     "vm-browserify": "1.1.2",
     "web-ext": "7.8.0",
     "web-ext-submit": "7.8.0",
-    "webpack": "5.89.0",
+    "webpack": "5.90.3",
     "webpack-bundle-analyzer": "4.10.1",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "4.15.1",
-    "webpack-hot-middleware": "2.26.0",
+    "webpack-hot-middleware": "2.26.1",
     "webpack-shell-plugin": "0.5.0"
   },
   "resolutions": {
     "nanoid": "3.3.4",
     "socket.io-parser": "4.2.4",
-    "**/**/bn.js": "5.2.1"
+    "**/**/bn.js": "5.2.1",
+    "wrap-ansi": "7.0.0"
   },
   "keywords": [
     "blockstack",

playwright.config.ts

@@ -1,7 +1,5 @@
 import { defineConfig, devices } from '@playwright/test';
 
-console.log('Branch: ', process.env.BRANCH_NAME);
-
 /**
  * See https://playwright.dev/docs/test-configuration
  */

public/assets/base.css

@@ -44,3 +44,11 @@
   font-weight: 400;
   font-style: normal;
 }
+
+#splash-screen {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}

public/assets/splash-screen.js

@@ -0,0 +1,11 @@
+var isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+var splashScreen = document.getElementById('splash-screen');
+
+// set ink.background-secondary
+if (isDark) {
+  // background-secondary (_dark)
+  splashScreen.style.backgroundColor = '#12100F';
+} else {
+  // background-secondary (base)
+  splashScreen.style.backgroundColor = '#F5F1ED';
+}

public/html/index.html

@@ -32,7 +32,9 @@
     />
   </head>
   <body>
+    <div id="splash-screen"></div>
     <div id="app"></div>
+    <script src="/assets/splash-screen.js"></script>
     <script src="browser-polyfill.js"></script>
   </body>
 </html>

public/html/popup.html

@@ -6,7 +6,9 @@
     <link href="/assets/base.css" rel="stylesheet" />
   </head>
   <body>
+    <div id="splash-screen"></div>
     <div id="app"></div>
+    <script src="/assets/splash-screen.js"></script>
     <script src="browser-polyfill.js"></script>
   </body>
 </html>