Update dependencies and improve command handling in the tool editor

Author: divyeshio

bun.lock

@@ -52,6 +52,7 @@
     "tailwindcss-animate": "^1.0.7",
     "uuid": "^11.1.0",
     "vite": "^6.3.5",
+    "vite-tsconfig-paths": "^5.1.4",
     "zod": "^3.25.76"
   },
   "devDependencies": {
@@ -71,7 +72,7 @@
     "oxlint": "^1.12.0",
     "shadcn": "^2.10.0",
     "typescript": "^5.9.2",
-    "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^3.2.4"
+    "vitest": "^3.2.4",
+    "vitest-browser-react": "^1.0.1"
   }
-}
+}

package.json

@@ -54,14 +54,12 @@ export function CommandTree() {
   const handleAddSubcommand = (parentId?: string) => {
     const prevIds = new Set(tool.commands.map((cmd) => cmd.id));
     toolBuilderActions.addSubcommand(parentId);
-    setTimeout(() => {
-      const newCmd = toolBuilderStore.state.tool.commands.find(
-        (cmd) => !prevIds.has(cmd.id)
-      );
-      if (newCmd) {
-        setLastAddedCommand({ id: newCmd.id, parentId });
-      }
-    }, 0);
+    const newCmd = toolBuilderStore.state.tool.commands.find(
+      (cmd) => !prevIds.has(cmd.id)
+    );
+    if (newCmd) {
+      setLastAddedCommand({ id: newCmd.id, parentId });
+    }
   };
 
   useEffect(() => {

registry/commandly/tool-editor/command-tree.tsx

@@ -13,9 +13,6 @@ import { Button } from "./ui/button";
 type Theme = "dark" | "light" | "system";
 
 export function ThemeSwitcher() {
-  if (typeof window === "undefined") {
-    return null;
-  }
   const { theme, setTheme } = useTheme();
   const ref = useRef<HTMLButtonElement>(null);
 
@@ -102,8 +99,6 @@ export function ThemeProvider({
   });
 
   useEffect(() => {
-    if (typeof window === "undefined") return;
-
     if (theme === "dark") {
       document.documentElement.classList.add("dark");
     } else {

src/components/theme-switcher.tsx

@@ -17,10 +17,6 @@ export const Route = createFileRoute("/tools/$toolName/edit")({
     newTool
   }),
   loader: async ({ params: { toolName }, deps: { newTool } }) => {
-    if (typeof window === "undefined") {
-      return null;
-    }
-
     if (newTool) {
       const newToolData = localStorage.getItem(`tool-${newTool}`);
       if (newToolData) {

src/routes/tools/$toolName/edit.tsx

@@ -65,10 +65,6 @@ export const Route = createFileRoute("/tools/$toolName/")({
     newTool
   }),
   loader: async ({ params: { toolName }, deps: { newTool } }) => {
-    if (typeof window === "undefined") {
-      return null;
-    }
-
     if (newTool) {
       const newToolData = localStorage.getItem(`tool-${newTool}`);
       if (newToolData) {

src/routes/tools/$toolName/index.tsx

@@ -8,6 +8,7 @@ export default defineConfig({
       projects: ["./tsconfig.json"]
     }),
     tanstackStart({
+      customViteReactPlugin: true,
       target: "github-pages",
       prerender: {
         enabled: true,
@@ -22,6 +23,14 @@ export default defineConfig({
             crawlLinks: true
           }
         },
+        {
+          path: "/tools",
+          prerender: {
+            outputPath: "tools.html",
+            enabled: true,
+            crawlLinks: true
+          }
+        },
       ],
       spa: {
         enabled: true,