ugly-app 0.1.146 → 0.1.147

package/dist/cli/version.d.ts

@@ -1,2 +1,2 @@
-export declare const CLI_VERSION = "0.1.146";
+export declare const CLI_VERSION = "0.1.147";
 //# sourceMappingURL=version.d.ts.map

package/dist/cli/version.js

@@ -1,3 +1,3 @@
 // Auto-generated by prebuild — do not edit manually
-export const CLI_VERSION = "0.1.146";
+export const CLI_VERSION = "0.1.147";
 //# sourceMappingURL=version.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ugly-app",
-  "version": "0.1.146",
+  "version": "0.1.147",
   "type": "module",
   "main": "./dist/server/index.js",
   "exports": {

package/src/cli/version.ts

@@ -1,2 +1,2 @@
 // Auto-generated by prebuild — do not edit manually
-export const CLI_VERSION = "0.1.146";
+export const CLI_VERSION = "0.1.147";

package/templates/.claude/skills/bot-swarm/SKILL.md

@@ -10,12 +10,40 @@ Run one full autonomous cycle. No human input. No clarifying questions. Make the
 
 **CORE PRINCIPLE: Be maximally ambitious. Every bot in this swarm — feedback bots, maintain bot, manager — should push for big changes, not incremental tweaks. Feedback bots should request new features, major redesigns, and bold improvements — not just "move this button 2px." The maintain bot must implement everything requested, no matter how large. "Too complex" is never a valid reason to skip work. The only limit is violating Critical Rules in CLAUDE.md.**
 
+## About the Website
+
+This website can do **anything**. It is a full-stack app with AI capabilities, real-time data, and a complete UI component library. The current sample pages demonstrate a subset of what's possible:
+
+- **AI Test** (`/ai-test`) — text generation (textGen) and image generation (imageGen)
+- **Audio Test** (`/audio-test`) — text-to-speech (TTS) and speech-to-text (STT)
+- **Kagi Test** (`/kagi-test`) — Kagi search API integration
+- **UI Components** (`/ui-components`) — suite of common UI controls (buttons, cards, inputs, selects, modals, etc.)
+- **Todo Demo** (`/todo-demo`) — real-time CRUD with live sync
+- **Auth Demo** (`/auth-demo`) — OAuth login/logout
+- **Path Params** (`/user/:userId`) and **Query Params** (`/search`) — routing demos
+
+These are just samples. The bot swarm should treat the site as a blank canvas — feedback bots can request entirely new pages, features, layouts, data models, or integrations. There are no limits on what can be built.
+
 ## Prerequisites
 
-- `npm run dev` must be running (Docker, server, Vite)
+- The dev server must be running with HMR and watchers disabled (see below)
 - `.env` must have `UGLY_BOT_TOKEN` (from `npx ugly-app login`)
 - Playwright must be installed (`npx playwright install chromium`)
 
+### Starting the dev server (no HMR, no watch)
+
+The bot swarm modifies source files while the server runs. To avoid HMR reloads and watcher interference mid-cycle, start the server without watchers:
+
+```bash
+# 1. Start Docker (MongoDB + Redis)
+docker compose up -d
+
+# 2. Run the server directly (no tsx watch, no tsc --watch, no eslint --watch)
+npx tsx --env-file=.env server/index.ts &
+```
+
+Do **not** use `npm run dev` — it enables tsx watch, tsc watch, and eslint watch which conflict with bot file edits. After the maintain bot finishes and commits, the restart step (Step 5) will kill and restart the server to pick up changes.
+
 ## First Run Bootstrap
 
 If `bots/` directory does not exist:
@@ -257,7 +285,7 @@ Run sequentially in one session. No questions. Make autonomous decisions.
 
 ## Step 5 — Restart Loop
 
-1. Stop the dev server (find and kill the `npm run dev` process group)
+1. Stop the server (find and kill the `npx tsx` server process)
 2. Run `npm install` (maintain bot may have added packages in Step 3)
 3. Run `npm run build`
 4. **If build fails:**
@@ -267,13 +295,13 @@ Run sequentially in one session. No questions. Make autonomous decisions.
    - Commit: `[bot] fix: build errors`
    - Run `npm run build` again
    - **Repeat until build succeeds. Do not stop. Do not ask for help.**
-5. Start `npm run dev` in the background
+5. Start the server without watchers: `npx tsx --env-file=.env server/index.ts &`
 6. Wait for the server to be ready — poll `http://localhost:3000` with up to 60 retries (1s apart)
 7. **If server fails to start or crashes:**
    - Read the error output and/or `npm run error`
    - Fix the code
    - Commit: `[bot] fix: startup errors`
-   - Kill and restart `npm run dev`
+   - Kill and restart `npx tsx --env-file=.env server/index.ts &`
    - **Repeat until server is healthy. Do not stop. Do not ask for help.**
 8. Once healthy: update the journal cycle file's Restart outcome to `success` or note any fixes made
 9. Commit any remaining changes: `[bot] fix: restart issues`

package/templates/client/main.tsx

@@ -48,6 +48,14 @@ if (!token) {
       );
     })
     .catch(() => {
-      window.location.reload();
+      root.render(
+        <RouterProvider
+          fallback={<div>404 — Page not found</div>}
+          loginFallback={loginPopup}
+          isAuthenticated={() => false}
+        >
+          <App socket={null} />
+        </RouterProvider>,
+      );
     });
 }

package/templates/client/pages/HomePage.tsx

@@ -142,39 +142,6 @@ function HomePageBody({
 
   const ctaLabel = getCtaLabel(branches);
 
-  const navItems = [
-    {
-      href: '/auth-demo',
-      label: 'Auth Demo',
-      desc: 'Login, logout, and user info',
-    },
-    {
-      href: '/user/example-user-id',
-      label: 'Path Params Demo',
-      desc: 'URL: /user/:userId',
-    },
-    {
-      href: '/search?q=hello',
-      label: 'Query Params Demo',
-      desc: 'URL: /search?q=...',
-    },
-    {
-      href: '/ai-test',
-      label: 'AI Test',
-      desc: 'Text & image generation models',
-    },
-    {
-      href: '/ui-components',
-      label: 'UI Components',
-      desc: 'Live demos of all built-in components',
-    },
-    {
-      href: '/todo-demo',
-      label: 'Todo Demo',
-      desc: 'Real-time CRUD with trackDocs & trackKeys',
-    },
-  ];
-
   return (
     <div style={{ maxWidth: 640, margin: '0 auto', padding: 24, display: 'flex', flexDirection: 'column', gap: 16 }}>
       <Card>
@@ -195,29 +162,24 @@ function HomePageBody({
           </div>
         )}
       </Card>
-
-      <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
-        {navItems.map(({ href, label, desc }) => (
-          <a key={href} href={href} style={{ textDecoration: 'none', color: 'inherit' }}>
-            <Card>
-              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-                <div>
-                  <Text weight="medium">{label}</Text>
-                  <Text size="sm" style={{ opacity: 0.6, marginTop: 2 }}>{desc}</Text>
-                </div>
-                <span style={{ fontSize: 20, opacity: 0.3 }}>&rarr;</span>
-              </div>
-            </Card>
-          </a>
-        ))}
-      </div>
     </div>
   );
 }
 
 export default function HomePage(): React.ReactElement {
-  const isLoggedIn = !!(window as unknown as { __AUTH_TOKEN__?: string })
-    .__AUTH_TOKEN__;
+  // Check both that a token exists AND that AppProvider is available.
+  // When the token is present but invalid (e.g. expired), the socket
+  // connection fails and we render without AppProvider — so we must
+  // fall back to the unauthenticated view to avoid a useApp() crash
+  // that causes an infinite reload loop.
+  let isLoggedIn = false;
+  try {
+    // useApp throws if there is no AppProvider ancestor
+    useApp();
+    isLoggedIn = true;
+  } catch {
+    isLoggedIn = false;
+  }
   if (isLoggedIn) return <HomePageAuthenticated />;
   return <HomePageUnauthenticated />;
 }