fluxy-bot 0.12.7 → 0.13.0

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "fluxy-bot",
-  "version": "0.12.7",
+  "version": "0.13.0",
   "releaseNotes": [
-    "Adding a way for users to claim their fluxies on the fluxy.bot dashboard",
-    "2. ",
-    "3. ",
-    "4. "
+    "1. react router implemented",
+    "2. new workspace design",
+    "3. tour",
+    "4. worspace helth checker"
   ],
   "description": "Self-hosted, self-evolving AI agent with its own dashboard.",
   "type": "module",

package/workspace/client/src/components/deleteme_onboarding/WorkspaceTour.tsx

@@ -16,12 +16,65 @@ const TOUR_KEY = 'fluxy_workspace_tour_done';
 
 export default function WorkspaceTour() {
   useEffect(() => {
-    if (localStorage.getItem(TOUR_KEY)) return;
-
-    // Mark immediately to prevent StrictMode double-fire
-    localStorage.setItem(TOUR_KEY, 'pending');
+    const val = localStorage.getItem(TOUR_KEY);
+    if (val === '1') return;
 
     const timer = setTimeout(() => {
+      // Prevent StrictMode double-fire
+      if (localStorage.getItem(TOUR_KEY) === '1') return;
+
+      // Build steps dynamically — skip missing elements
+      const steps: any[] = [
+        {
+          element: '#tour-sidebar',
+          popover: {
+            title: 'Your Sidebar',
+            description: 'When you ask Fluxy to build something, it creates an App that shows up right here. Think of it as your personal app launcher.',
+            side: 'right',
+            align: 'start',
+          },
+        },
+        {
+          element: '#tour-dashboard',
+          popover: {
+            title: 'Your Dashboard',
+            description: 'Fluxy can add widgets here with a summary of your apps, the weather in your city, home automation controls... whatever you need at a glance.',
+            side: 'left',
+            align: 'start',
+          },
+        },
+      ];
+
+      // Only add chat step if the widget exists (not present in dev:workspace mode)
+      if (document.getElementById('fluxy-widget-toggle')) {
+        steps.push({
+          element: '#fluxy-widget-toggle',
+          popover: {
+            title: 'Chat with Fluxy',
+            description: 'This is where you talk to your Fluxy. Tell it what to build, ask questions, or just chat. It is always here for you.',
+            side: 'left',
+            align: 'end',
+          },
+        });
+      }
+
+      steps.push({
+        popover: {
+          title: 'A few things to know',
+          description: `
+            <div style="display:flex;flex-direction:column;gap:12px;font-size:13px;line-height:1.5">
+              <p><strong>Make it yours.</strong> These widgets are just examples. You own this workspace and Fluxy can transform it into anything you want.</p>
+              <p><strong>Set a workspace password.</strong> By default, your workspace is open. Ask Fluxy to add a password so only you can see your apps and data.</p>
+              <p><strong>Keep your chat password safe.</strong> It controls access to Fluxy, which has full access to this machine. Use a strong one. If you ever lose it, run <code style="background:rgba(255,255,255,0.1);padding:2px 6px;border-radius:4px;font-size:12px">fluxy password-reset</code> in your terminal.</p>
+              <p><strong>Fluxy does more than build apps.</strong> It can research topics, manage files, run commands, and help with just about anything. Just ask.</p>
+              <p><strong>Fluxy wakes up on its own.</strong> Every 30 minutes, it checks in and can take action proactively. You can adjust this anytime.</p>
+              <p><strong>Schedule anything.</strong> Ask things like "Every day at 6am, send me a briefing" or "In 40 minutes, remind me to call the dentist." Fluxy handles cron jobs and one-time reminders.</p>
+              <p><strong>Install it on your phone.</strong> Fluxy is a PWA. You can add it to your home screen and enable push notifications. It only pings you when something actually matters, and you can tune that by asking.</p>
+            </div>
+          `,
+        },
+      });
+
       const d = driver({
         showProgress: true,
         animate: true,
@@ -37,51 +90,7 @@ export default function WorkspaceTour() {
         onDestroyed: () => {
           localStorage.setItem(TOUR_KEY, '1');
         },
-        steps: [
-          {
-            element: '#tour-sidebar',
-            popover: {
-              title: 'Your Sidebar',
-              description: 'When you ask Fluxy to build something, it creates an App that shows up right here. Think of it as your personal app launcher.',
-              side: 'right',
-              align: 'start',
-            },
-          },
-          {
-            element: '#tour-dashboard',
-            popover: {
-              title: 'Your Dashboard',
-              description: 'Fluxy can add widgets here with a summary of your apps, the weather in your city, home automation controls... whatever you need at a glance.',
-              side: 'left',
-              align: 'start',
-            },
-          },
-          {
-            element: '#fluxy-widget-toggle',
-            popover: {
-              title: 'Chat with Fluxy',
-              description: 'This is where you talk to your Fluxy. Tell it what to build, ask questions, or just chat. It is always here for you.',
-              side: 'left',
-              align: 'end',
-            },
-          },
-          {
-            popover: {
-              title: 'A few things to know',
-              description: `
-                <div style="display:flex;flex-direction:column;gap:12px;font-size:13px;line-height:1.5">
-                  <p><strong>Make it yours.</strong> These widgets are just examples. You own this workspace and Fluxy can transform it into anything you want.</p>
-                  <p><strong>Set a workspace password.</strong> By default, your workspace is open. Ask Fluxy to add a password so only you can see your apps and data.</p>
-                  <p><strong>Keep your chat password safe.</strong> It controls access to Fluxy, which has full access to this machine. Use a strong one. If you ever lose it, run <code style="background:rgba(255,255,255,0.1);padding:2px 6px;border-radius:4px;font-size:12px">fluxy password-reset</code> in your terminal.</p>
-                  <p><strong>Fluxy does more than build apps.</strong> It can research topics, manage files, run commands, and help with just about anything. Just ask.</p>
-                  <p><strong>Fluxy wakes up on its own.</strong> Every 30 minutes, it checks in and can take action proactively. You can adjust this anytime.</p>
-                  <p><strong>Schedule anything.</strong> Ask things like "Every day at 6am, send me a briefing" or "In 40 minutes, remind me to call the dentist." Fluxy handles cron jobs and one-time reminders.</p>
-                  <p><strong>Install it on your phone.</strong> Fluxy is a PWA. You can add it to your home screen and enable push notifications. It only pings you when something actually matters, and you can tune that by asking.</p>
-                </div>
-              `,
-            },
-          },
-        ],
+        steps,
       });
 
       d.drive();

package/workspace/client/src/components/ui/sheet.tsx

@@ -59,7 +59,7 @@ function SheetContent({
         data-slot="sheet-content"
         aria-describedby={undefined}
         className={cn(
-          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+          "data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 bg-[#1A1A1A]",
           side === "right" &&
             "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
           side === "left" &&