From 8931ba4c352f572742a88882b33a8d91284b02a8 Mon Sep 17 00:00:00 2001
From: heswell <steve@heswell.com>
Date: Tue, 6 Feb 2024 08:53:32 +0000
Subject: [PATCH] move theme detection into SHowcaseStandalone

---
 vuu-ui/package.json                               |  2 +-
 vuu-ui/showcase/package.json                      |  3 +--
 vuu-ui/showcase/scripts/preview.mjs               | 15 ---------------
 vuu-ui/showcase/src/index-standalone.tsx          | 12 +-----------
 .../tools/vuu-showcase/src/ShowcaseStandalone.tsx |  8 +++++++-
 5 files changed, 10 insertions(+), 30 deletions(-)
 delete mode 100644 vuu-ui/showcase/scripts/preview.mjs

diff --git a/vuu-ui/package.json b/vuu-ui/package.json
index e3f00f909..14fa86b3f 100644
--- a/vuu-ui/package.json
+++ b/vuu-ui/package.json
@@ -33,7 +33,7 @@
     "view-bundle": "node ./scripts/visualize-bundle.mjs",
     "type-defs": "node ./scripts/build-all-type-defs.mjs",
     "showcase": "cd showcase && npm run showcase",
-    "showcase:preview": "serve ./showcase/dist",
+    "showcase:preview": "serve ./showcase/dist -p 4173",
     "showcase:build": " cd showcase && node scripts/build.mjs",
     "test:cypress": "cypress run --component --browser chrome --headless",
     "test:cypress:local": "cypress open --component --browser chrome",
diff --git a/vuu-ui/showcase/package.json b/vuu-ui/showcase/package.json
index 403f60ecf..d31a3221d 100644
--- a/vuu-ui/showcase/package.json
+++ b/vuu-ui/showcase/package.json
@@ -5,10 +5,9 @@
   "main": "index.js",
   "private": true,
   "scripts": {
-    "build": "vite build",
+    "build": "node ./scripts/build.mjs",
     "dev": "vite",
     "docs": "node ./scripts/build-docs.mjs",
-    "preview": "node ./scripts/preview.mjs",
     "showcase": "node ./scripts/showcase.mjs",
     "stories": "node ./scripts/parse-stories.mjs"
   },
diff --git a/vuu-ui/showcase/scripts/preview.mjs b/vuu-ui/showcase/scripts/preview.mjs
deleted file mode 100644
index 913ed19eb..000000000
--- a/vuu-ui/showcase/scripts/preview.mjs
+++ /dev/null
@@ -1,15 +0,0 @@
-import open from "open";
-import chalk from "chalk";
-import { execWait } from "../../scripts/utils.mjs";
-
-import "./copy-preview.mjs";
-
-// fs.copyFileSync("./templates/index-preview.html", "./index.html");
-
-execWait("node ../node_modules/.bin/vite preview");
-
-console.log(`opening showcase at ${chalk.green("http://localhost:4173/")} ...`);
-
-setTimeout(() => {
-  open("http://localhost:4173/");
-}, 1000);
diff --git a/vuu-ui/showcase/src/index-standalone.tsx b/vuu-ui/showcase/src/index-standalone.tsx
index dbb762576..2d0ede983 100644
--- a/vuu-ui/showcase/src/index-standalone.tsx
+++ b/vuu-ui/showcase/src/index-standalone.tsx
@@ -1,16 +1,6 @@
 import { ShowcaseStandalone } from "@finos/vuu-showcase";
 import ReactDOM from "react-dom";
-import { getUrlParameter } from "@finos/vuu-utils";
-
-const theme = getUrlParameter("theme", "vuu");
 
 const root = document.getElementById("root") as HTMLDivElement;
 
-ReactDOM.render(
-  <ShowcaseStandalone
-    density="high"
-    theme={theme}
-    themeMode="light"
-  ></ShowcaseStandalone>,
-  root
-);
+ReactDOM.render(<ShowcaseStandalone />, root);
diff --git a/vuu-ui/tools/vuu-showcase/src/ShowcaseStandalone.tsx b/vuu-ui/tools/vuu-showcase/src/ShowcaseStandalone.tsx
index 189156a30..848643966 100644
--- a/vuu-ui/tools/vuu-showcase/src/ShowcaseStandalone.tsx
+++ b/vuu-ui/tools/vuu-showcase/src/ShowcaseStandalone.tsx
@@ -1,6 +1,7 @@
 import {
   assertModuleExportsAtLeastOneComponent,
   Density,
+  getUrlParameter,
   ThemeMode,
   ThemeProvider,
 } from "@finos/vuu-utils";
@@ -11,7 +12,7 @@ import "./Showcase.css";
 
 export const ShowcaseStandalone = ({
   density = "high",
-  theme = "vuu",
+  theme: themeProp,
   themeMode = "light",
 }: {
   density?: Density;
@@ -21,6 +22,11 @@ export const ShowcaseStandalone = ({
   const [component, setComponent] = useState<ReactNode>(null);
   const [themeReady, setThemeReady] = useState(false);
 
+  const theme = useMemo(
+    () => themeProp ?? getUrlParameter("theme", "vuu"),
+    [themeProp]
+  );
+
   useMemo(() => {
     switch (theme) {
       case "vuu":