feat: Display dedupe status and dependencies

.vscode/snippets.code-snippets

@@ -72,11 +72,11 @@
       "import { html } from \"lit\";",
       "import { ifDefined } from \"lit/directives/if-defined.js\";",
       "",
-      "import type { ${1:Component} } from \"@/${2:directory}/${3:component}\";",
+      "import type { ${TM_FILENAME_BASE} } from \"@/${2:directory}/${3:component}\";",
       "",
       "import \"@/${2:directory}/${3:component}\";",
       "",
-      "export type RenderProps = ${1:Component};",
+      "export type RenderProps = ${TM_FILENAME_BASE};",
       "",
       "export const renderComponent = (props: Partial<RenderProps>) => {",
       "  return html`<btrix-${3:component} ${4:property}=${ifDefined(props.${4:property})}></btrix-${3:component}>`;",

frontend/.storybook/main.ts

@@ -18,6 +18,7 @@ const config: StorybookConfig = {
       to: shoelaceAssetsPublicPath,
     },
     { from: "../src/assets/", to: "/assets" },
+    "../src/__generated__/static",
   ],
   addons: [
     "@storybook/addon-webpack5-compiler-swc",

frontend/.storybook/preview.ts

@@ -5,6 +5,8 @@ import {
   setCustomElementsManifest,
   type Preview,
 } from "@storybook/web-components";
+import { delay, http, HttpResponse } from "msw";
+import { initialize, mswLoader } from "msw-storybook-addon";
 
 // eslint-disable-next-line import-x/no-unresolved -- File is generated at build time
 import customElements from "@/__generated__/custom-elements.json";
@@ -14,7 +16,11 @@ import "../src/theme.stylesheet.css";
 // Automatically document component properties
 setCustomElementsManifest(customElements);
 
+// Initialize mock service worker
+initialize();
+
 const preview: Preview = {
+  loaders: [mswLoader],
   parameters: {
     actions: { argTypesRegex: "^on[A-Z].*" },
     controls: {
@@ -24,6 +30,15 @@ const preview: Preview = {
         date: /Date$/i,
       },
     },
+    msw: {
+      handlers: [
+        // Mock all API requests by default
+        http.get(/\/api\//, async () => {
+          await delay(500);
+          return new HttpResponse(null);
+        }),
+      ],
+    },
   },
 };
 

frontend/package.json

@@ -141,6 +141,8 @@
     "concurrently": "^9.1.2",
     "husky": "^8.0.3",
     "lint-staged": "^13.1.0",
+    "msw": "^2.12.4",
+    "msw-storybook-addon": "^2.0.6",
     "prettier-plugin-tailwindcss": "^0.5.12",
     "remark-gfm": "^4.0.1",
     "rollup-plugin-typescript-paths": "^1.4.0",
@@ -179,5 +181,10 @@
   "browserslist": [
     "defaults"
   ],
-  "packageManager": "[email protected]+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+  "packageManager": "[email protected]+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
+  "msw": {
+    "workerDirectory": [
+      "src/__generated__/static"
+    ]
+  }
 }