@helloleo/plugins 0.1.9 → 0.1.10

package/dist/index.js

@@ -12544,6 +12544,263 @@ var RemovePlugin = async () => {
 // src/tools/scaffold.ts
 import { mkdir } from "fs/promises";
 import path2 from "path";
+
+// src/tools/scaffold-netsuite.ts
+function netsuiteTs() {
+  return `/*
+ * NetSuite OAuth client helper (bearer-token-in-fragment).
+ *
+ * Two NetSuite Integration Records back this:
+ *   1. MCP (scope: mcp)            -- used by HelloLeo at build time.
+ *   2. Runtime (scope: rest_webservices) -- used here at sign-in time.
+ * Runtime credentials live as HelloLeo Cloud secrets on the project's Worker
+ * (env.NETSUITE_ACCOUNT_ID / _CLIENT_ID / _CLIENT_SECRET). They never reach
+ * the browser. Cookies are NOT used -- frontend \u2194 Worker are cross-site
+ * (e.g. *.helloleo.dev <-> *.workers.dev) and Chrome partitions / drops
+ * third-party cookies in the HelloLeo preview iframe.
+ *
+ * Flow:
+ *   1. User clicks "Sign in with NetSuite".
+ *   2. Browser navigates to the Worker /auth/netsuite/start.
+ *   3. Worker redirects to NetSuite's OAuth UI with PKCE.
+ *   4. NetSuite redirects back to the Worker /auth/netsuite/callback.
+ *   5. Worker exchanges the code, mints a session id, then redirects to
+ *      <return_to>#nssid=<sid>. URL fragments stay in the browser only.
+ *   6. This module reads the fragment on load, stashes the sid in
+ *      sessionStorage, and sends it as Authorization: Bearer on every
+ *      Worker call.
+ *
+ * NEVER use a hardcoded password gate. NEVER use sessionStorage as the
+ * authoritative auth state -- the only acceptable check is /api/me on the
+ * Worker. sessionStorage here is just a cache of the bearer token.
+ */
+
+export const WORKER_URL = import.meta.env.VITE_WORKER_URL ?? '';
+const TOKEN_KEY = 'nssid';
+
+// Capture-and-strip the #nssid=... fragment as early as possible so URLs
+// shown to the user stay clean. Runs once at module load.
+(function bootstrapTokenFromHash() {
+  if (typeof window === 'undefined') return;
+  const hash = window.location.hash.replace(/^#/, '');
+  if (!hash) return;
+  const params = new URLSearchParams(hash);
+  const sid = params.get(TOKEN_KEY);
+  if (sid) {
+    try { sessionStorage.setItem(TOKEN_KEY, sid); } catch {}
+    params.delete(TOKEN_KEY);
+    const remaining = params.toString();
+    const newHash = remaining ? '#' + remaining : '';
+    window.history.replaceState(null, '', window.location.pathname + window.location.search + newHash);
+  }
+})();
+
+export function getSessionToken(): string | null {
+  try { return sessionStorage.getItem(TOKEN_KEY); } catch { return null; }
+}
+
+export function signInWithNetSuite(returnTo: string = window.location.href) {
+  if (!WORKER_URL) {
+    throw new Error(
+      'VITE_WORKER_URL is not set. HelloLeo Cloud must be provisioned before sign-in works.',
+    );
+  }
+  const url = new URL(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/start\`);
+  url.searchParams.set('return_to', returnTo);
+  // The app usually renders inside the HelloLeo preview iframe. NetSuite's
+  // OAuth page sets X-Frame-Options: DENY, so navigating the iframe to the
+  // Worker (which 302s to NetSuite) ends up loading a page the browser
+  // refuses to render -- looks like "nothing happens" to the user. Navigate
+  // the top frame instead so the OAuth flow runs at the top level and the
+  // callback redirect lands on the same top frame, which then reads the
+  // #nssid= fragment. Fallback to same-frame navigation if the top window
+  // is cross-origin and can't be reassigned.
+  try {
+    if (window.top && window.top !== window) {
+      window.top.location.assign(url.toString());
+      return;
+    }
+  } catch {
+    /* top window not accessible \u2014 fall through to same-frame navigation */
+  }
+  window.location.assign(url.toString());
+}
+
+export interface NetSuiteSession {
+  authenticated: boolean;
+  account_id?: string;
+  user_id?: string;
+  email?: string;
+}
+
+export async function getNetSuiteSession(): Promise<NetSuiteSession> {
+  if (!WORKER_URL) return { authenticated: false };
+  const sid = getSessionToken();
+  if (!sid) return { authenticated: false };
+  const res = await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/api/me\`, {
+    headers: { Authorization: 'Bearer ' + sid },
+  });
+  if (!res.ok) return { authenticated: false };
+  const data = await res.json();
+  return { authenticated: Boolean(data?.account_id), ...data };
+}
+
+export async function signOutNetSuite(): Promise<void> {
+  if (!WORKER_URL) return;
+  const sid = getSessionToken();
+  if (sid) {
+    try {
+      await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/logout\`, {
+        method: 'POST',
+        headers: { Authorization: 'Bearer ' + sid },
+      });
+    } catch {}
+  }
+  try { sessionStorage.removeItem(TOKEN_KEY); } catch {}
+  window.location.reload();
+}
+
+/**
+ * Helper for ALL other Worker calls (your dashboard endpoints, etc.).
+ * Always go through this instead of bare fetch -- it injects the bearer
+ * token and routes through the Worker so NetSuite tokens stay server-side.
+ */
+export async function workerFetch(pathOrUrl: string, init: RequestInit = {}): Promise<Response> {
+  if (!WORKER_URL) throw new Error('VITE_WORKER_URL is not set');
+  const url = pathOrUrl.startsWith('http')
+    ? pathOrUrl
+    : \`\${WORKER_URL.replace(/\\/$/, '')}\${pathOrUrl.startsWith('/') ? '' : '/'}\${pathOrUrl}\`;
+  const sid = getSessionToken();
+  const headers = new Headers(init.headers ?? {});
+  if (sid) headers.set('Authorization', 'Bearer ' + sid);
+  return fetch(url, { ...init, headers });
+}
+`;
+}
+function signInButtonTsx() {
+  return `import { signInWithNetSuite } from '../../lib/netsuite';
+
+export function SignInWithNetSuite() {
+  return (
+    <button
+      onClick={() => signInWithNetSuite()}
+      className="inline-flex items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+    >
+      Sign in with NetSuite
+    </button>
+  );
+}
+`;
+}
+function netsuiteLoginPageTsx() {
+  return `import { SignInWithNetSuite } from './SignInWithNetSuite';
+
+/**
+ * Default unauthenticated landing page. Replaces any password gate.
+ * Customise copy / imagery freely but keep <SignInWithNetSuite /> as the
+ * only call-to-action -- it points to the Worker's /auth/netsuite/start.
+ */
+export function LoginPage() {
+  return (
+    <div className="min-h-screen bg-background text-foreground flex">
+      <div className="hidden lg:flex lg:w-1/2 bg-primary text-primary-foreground p-12 flex-col justify-between">
+        <div className="text-xl font-semibold">NetSuite App</div>
+        <div>
+          <h1 className="text-4xl font-bold leading-tight">
+            Connect your NetSuite account
+          </h1>
+          <p className="mt-4 text-primary-foreground/80 max-w-md">
+            Sign in with your NetSuite credentials to access your data securely.
+            Tokens stay server-side on HelloLeo Cloud -- they never reach the
+            browser.
+          </p>
+        </div>
+        <div className="text-xs text-primary-foreground/60">
+          Powered by HelloLeo
+        </div>
+      </div>
+      <div className="flex-1 flex items-center justify-center px-6 py-12">
+        <div className="w-full max-w-sm space-y-6">
+          <div>
+            <h2 className="text-2xl font-semibold">Welcome</h2>
+            <p className="mt-2 text-sm text-muted-foreground">
+              Use the button below to sign in. You'll be redirected to NetSuite
+              to authorise access, then back here.
+            </p>
+          </div>
+          <SignInWithNetSuite />
+        </div>
+      </div>
+    </div>
+  );
+}
+`;
+}
+function netsuiteAuthGateTsx() {
+  return `import { useEffect, useState } from 'react';
+import { LoginPage } from './LoginPage';
+import { getNetSuiteSession, type NetSuiteSession } from '../../lib/netsuite';
+
+/**
+ * Mandatory auth gate for NetSuite projects. Wrap your real App content with
+ * <AuthGate>...</AuthGate>. Never render NetSuite data without this gate -- it
+ * is the ONLY supported authentication for a NetSuite project (no password
+ * gates, no sessionStorage flags, no shared credential).
+ *
+ * Pattern in src/App.tsx:
+ *
+ *   import { AuthGate } from './components/auth/AuthGate';
+ *   export default function App() {
+ *     return (
+ *       <AuthGate>
+ *         <Dashboard />   // your authenticated content
+ *       </AuthGate>
+ *     );
+ *   }
+ */
+export function AuthGate({ children }: { children: React.ReactNode }) {
+  const [session, setSession] = useState<NetSuiteSession | null>(null);
+
+  useEffect(() => { getNetSuiteSession().then(setSession); }, []);
+
+  if (session === null) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-background">
+        <div className="h-8 w-8 rounded-full border-2 border-primary border-t-transparent animate-spin" />
+      </div>
+    );
+  }
+
+  if (!session.authenticated) return <LoginPage />;
+
+  return <>{children}</>;
+}
+`;
+}
+function netsuiteAppTsx() {
+  return `import { AuthGate } from './components/auth/AuthGate';
+
+/**
+ * NetSuite project entry point. KEEP <AuthGate> as the outermost element --
+ * removing it disables real OAuth and exposes NetSuite data to anonymous
+ * users. Build your dashboard / pages inside the gate.
+ */
+export default function App() {
+  return (
+    <AuthGate>
+      <div className="min-h-screen bg-background text-foreground p-8">
+        <h1 className="text-2xl font-bold">You are signed in to NetSuite.</h1>
+        <p className="text-muted-foreground mt-2">
+          Replace this placeholder with your dashboard.
+        </p>
+      </div>
+    </AuthGate>
+  );
+}
+`;
+}
+
+// src/tools/scaffold.ts
 function packageJson(name) {
   return JSON.stringify({
     name,
@@ -12908,243 +13165,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
   </React.StrictMode>,
 )`;
 }
-function netsuiteTs() {
-  return `/*
- * NetSuite OAuth client helper (bearer-token-in-fragment).
- *
- * Two NetSuite Integration Records back this:
- *   1. MCP (scope: mcp)            -- used by HelloLeo at build time.
- *   2. Runtime (scope: rest_webservices) -- used here at sign-in time.
- * Runtime credentials live as HelloLeo Cloud secrets on the project's Worker
- * (env.NETSUITE_ACCOUNT_ID / _CLIENT_ID / _CLIENT_SECRET). They never reach
- * the browser. Cookies are NOT used -- frontend \u2194 Worker are cross-site
- * (e.g. *.helloleo.dev <-> *.workers.dev) and Chrome partitions / drops
- * third-party cookies in the HelloLeo preview iframe.
- *
- * Flow:
- *   1. User clicks "Sign in with NetSuite".
- *   2. Browser navigates to the Worker /auth/netsuite/start.
- *   3. Worker redirects to NetSuite's OAuth UI with PKCE.
- *   4. NetSuite redirects back to the Worker /auth/netsuite/callback.
- *   5. Worker exchanges the code, mints a session id, then redirects to
- *      <return_to>#nssid=<sid>. URL fragments stay in the browser only.
- *   6. This module reads the fragment on load, stashes the sid in
- *      sessionStorage, and sends it as Authorization: Bearer on every
- *      Worker call.
- *
- * NEVER use a hardcoded password gate. NEVER use sessionStorage as the
- * authoritative auth state -- the only acceptable check is /api/me on the
- * Worker. sessionStorage here is just a cache of the bearer token.
- */
-
-export const WORKER_URL = import.meta.env.VITE_WORKER_URL ?? '';
-const TOKEN_KEY = 'nssid';
-
-// Capture-and-strip the #nssid=... fragment as early as possible so URLs
-// shown to the user stay clean. Runs once at module load.
-(function bootstrapTokenFromHash() {
-  if (typeof window === 'undefined') return;
-  const hash = window.location.hash.replace(/^#/, '');
-  if (!hash) return;
-  const params = new URLSearchParams(hash);
-  const sid = params.get(TOKEN_KEY);
-  if (sid) {
-    try { sessionStorage.setItem(TOKEN_KEY, sid); } catch {}
-    params.delete(TOKEN_KEY);
-    const remaining = params.toString();
-    const newHash = remaining ? '#' + remaining : '';
-    window.history.replaceState(null, '', window.location.pathname + window.location.search + newHash);
-  }
-})();
-
-export function getSessionToken(): string | null {
-  try { return sessionStorage.getItem(TOKEN_KEY); } catch { return null; }
-}
-
-export function signInWithNetSuite(returnTo: string = window.location.href) {
-  if (!WORKER_URL) {
-    throw new Error(
-      'VITE_WORKER_URL is not set. HelloLeo Cloud must be provisioned before sign-in works.',
-    );
-  }
-  const url = new URL(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/start\`);
-  url.searchParams.set('return_to', returnTo);
-  window.location.assign(url.toString());
-}
-
-export interface NetSuiteSession {
-  authenticated: boolean;
-  account_id?: string;
-  user_id?: string;
-  email?: string;
-}
-
-export async function getNetSuiteSession(): Promise<NetSuiteSession> {
-  if (!WORKER_URL) return { authenticated: false };
-  const sid = getSessionToken();
-  if (!sid) return { authenticated: false };
-  const res = await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/api/me\`, {
-    headers: { Authorization: 'Bearer ' + sid },
-  });
-  if (!res.ok) return { authenticated: false };
-  const data = await res.json();
-  return { authenticated: Boolean(data?.account_id), ...data };
-}
-
-export async function signOutNetSuite(): Promise<void> {
-  if (!WORKER_URL) return;
-  const sid = getSessionToken();
-  if (sid) {
-    try {
-      await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/logout\`, {
-        method: 'POST',
-        headers: { Authorization: 'Bearer ' + sid },
-      });
-    } catch {}
-  }
-  try { sessionStorage.removeItem(TOKEN_KEY); } catch {}
-  window.location.reload();
-}
-
-/**
- * Helper for ALL other Worker calls (your dashboard endpoints, etc.).
- * Always go through this instead of bare fetch -- it injects the bearer
- * token and routes through the Worker so NetSuite tokens stay server-side.
- */
-export async function workerFetch(pathOrUrl: string, init: RequestInit = {}): Promise<Response> {
-  if (!WORKER_URL) throw new Error('VITE_WORKER_URL is not set');
-  const url = pathOrUrl.startsWith('http')
-    ? pathOrUrl
-    : \`\${WORKER_URL.replace(/\\/$/, '')}\${pathOrUrl.startsWith('/') ? '' : '/'}\${pathOrUrl}\`;
-  const sid = getSessionToken();
-  const headers = new Headers(init.headers ?? {});
-  if (sid) headers.set('Authorization', 'Bearer ' + sid);
-  return fetch(url, { ...init, headers });
-}
-`;
-}
-function signInButtonTsx() {
-  return `import { signInWithNetSuite } from '../../lib/netsuite';
-
-export function SignInWithNetSuite() {
-  return (
-    <button
-      onClick={() => signInWithNetSuite()}
-      className="inline-flex items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-    >
-      Sign in with NetSuite
-    </button>
-  );
-}
-`;
-}
-function netsuiteLoginPageTsx() {
-  return `import { SignInWithNetSuite } from './SignInWithNetSuite';
-
-/**
- * Default unauthenticated landing page. Replaces any password gate.
- * Customise copy / imagery freely but keep <SignInWithNetSuite /> as the
- * only call-to-action -- it points to the Worker's /auth/netsuite/start.
- */
-export function LoginPage() {
-  return (
-    <div className="min-h-screen bg-background text-foreground flex">
-      <div className="hidden lg:flex lg:w-1/2 bg-primary text-primary-foreground p-12 flex-col justify-between">
-        <div className="text-xl font-semibold">NetSuite App</div>
-        <div>
-          <h1 className="text-4xl font-bold leading-tight">
-            Connect your NetSuite account
-          </h1>
-          <p className="mt-4 text-primary-foreground/80 max-w-md">
-            Sign in with your NetSuite credentials to access your data securely.
-            Tokens stay server-side on HelloLeo Cloud -- they never reach the
-            browser.
-          </p>
-        </div>
-        <div className="text-xs text-primary-foreground/60">
-          Powered by HelloLeo
-        </div>
-      </div>
-      <div className="flex-1 flex items-center justify-center px-6 py-12">
-        <div className="w-full max-w-sm space-y-6">
-          <div>
-            <h2 className="text-2xl font-semibold">Welcome</h2>
-            <p className="mt-2 text-sm text-muted-foreground">
-              Use the button below to sign in. You'll be redirected to NetSuite
-              to authorise access, then back here.
-            </p>
-          </div>
-          <SignInWithNetSuite />
-        </div>
-      </div>
-    </div>
-  );
-}
-`;
-}
-function netsuiteAuthGateTsx() {
-  return `import { useEffect, useState } from 'react';
-import { LoginPage } from './LoginPage';
-import { getNetSuiteSession, type NetSuiteSession } from '../../lib/netsuite';
-
-/**
- * Mandatory auth gate for NetSuite projects. Wrap your real App content with
- * <AuthGate>...</AuthGate>. Never render NetSuite data without this gate -- it
- * is the ONLY supported authentication for a NetSuite project (no password
- * gates, no sessionStorage flags, no shared credential).
- *
- * Pattern in src/App.tsx:
- *
- *   import { AuthGate } from './components/auth/AuthGate';
- *   export default function App() {
- *     return (
- *       <AuthGate>
- *         <Dashboard />   {/* your authenticated content */}
- *       </AuthGate>
- *     );
- *   }
- */
-export function AuthGate({ children }: { children: React.ReactNode }) {
-  const [session, setSession] = useState<NetSuiteSession | null>(null);
-
-  useEffect(() => { getNetSuiteSession().then(setSession); }, []);
-
-  if (session === null) {
-    return (
-      <div className="min-h-screen flex items-center justify-center bg-background">
-        <div className="h-8 w-8 rounded-full border-2 border-primary border-t-transparent animate-spin" />
-      </div>
-    );
-  }
-
-  if (!session.authenticated) return <LoginPage />;
-
-  return <>{children}</>;
-}
-`;
-}
-function netsuiteAppTsx() {
-  return `import { AuthGate } from './components/auth/AuthGate';
-
-/**
- * NetSuite project entry point. KEEP <AuthGate> as the outermost element --
- * removing it disables real OAuth and exposes NetSuite data to anonymous
- * users. Build your dashboard / pages inside the gate.
- */
-export default function App() {
-  return (
-    <AuthGate>
-      <div className="min-h-screen bg-background text-foreground p-8">
-        <h1 className="text-2xl font-bold">You are signed in to NetSuite.</h1>
-        <p className="text-muted-foreground mt-2">
-          Replace this placeholder with your dashboard.
-        </p>
-      </div>
-    </AuthGate>
-  );
-}
-`;
-}
 var scaffold = tool({
   description: "Scaffold a new React + Vite + Tailwind CSS project with the HelloLeo design system. " + "Creates all mandatory boilerplate: package.json, index.html (with Google Fonts), " + "vite.config.js, tailwind.config.js, postcss.config.js, src/index.css (CSS variables " + "light+dark), src/lib/utils.ts (cn helper), and src/main.tsx. " + "Call this FIRST for any new project before writing App.tsx and components.",
   args: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@helloleo/plugins",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "OpenCode plugins for HelloLeo",
   "license": "UNLICENSED",
   "type": "module",

package/src/tools/scaffold-netsuite.ts

@@ -0,0 +1,268 @@
+/**
+ * NetSuite-specific scaffold templates.
+ *
+ * Extracted from scaffold.ts so the OAuth bits (client helper, sign-in
+ * button, login page, auth gate, gated App.tsx entry point) live in one
+ * file. Imported and emitted by scaffold.ts when the caller passes
+ * `integrations: ["netsuite"]`. The string contents are byte-for-byte
+ * identical to the previous inline versions — splitting is purely
+ * organisational and does NOT change scaffold output.
+ */
+
+export function netsuiteTs(): string {
+	return `/*
+ * NetSuite OAuth client helper (bearer-token-in-fragment).
+ *
+ * Two NetSuite Integration Records back this:
+ *   1. MCP (scope: mcp)            -- used by HelloLeo at build time.
+ *   2. Runtime (scope: rest_webservices) -- used here at sign-in time.
+ * Runtime credentials live as HelloLeo Cloud secrets on the project's Worker
+ * (env.NETSUITE_ACCOUNT_ID / _CLIENT_ID / _CLIENT_SECRET). They never reach
+ * the browser. Cookies are NOT used -- frontend ↔ Worker are cross-site
+ * (e.g. *.helloleo.dev <-> *.workers.dev) and Chrome partitions / drops
+ * third-party cookies in the HelloLeo preview iframe.
+ *
+ * Flow:
+ *   1. User clicks "Sign in with NetSuite".
+ *   2. Browser navigates to the Worker /auth/netsuite/start.
+ *   3. Worker redirects to NetSuite's OAuth UI with PKCE.
+ *   4. NetSuite redirects back to the Worker /auth/netsuite/callback.
+ *   5. Worker exchanges the code, mints a session id, then redirects to
+ *      <return_to>#nssid=<sid>. URL fragments stay in the browser only.
+ *   6. This module reads the fragment on load, stashes the sid in
+ *      sessionStorage, and sends it as Authorization: Bearer on every
+ *      Worker call.
+ *
+ * NEVER use a hardcoded password gate. NEVER use sessionStorage as the
+ * authoritative auth state -- the only acceptable check is /api/me on the
+ * Worker. sessionStorage here is just a cache of the bearer token.
+ */
+
+export const WORKER_URL = import.meta.env.VITE_WORKER_URL ?? '';
+const TOKEN_KEY = 'nssid';
+
+// Capture-and-strip the #nssid=... fragment as early as possible so URLs
+// shown to the user stay clean. Runs once at module load.
+(function bootstrapTokenFromHash() {
+  if (typeof window === 'undefined') return;
+  const hash = window.location.hash.replace(/^#/, '');
+  if (!hash) return;
+  const params = new URLSearchParams(hash);
+  const sid = params.get(TOKEN_KEY);
+  if (sid) {
+    try { sessionStorage.setItem(TOKEN_KEY, sid); } catch {}
+    params.delete(TOKEN_KEY);
+    const remaining = params.toString();
+    const newHash = remaining ? '#' + remaining : '';
+    window.history.replaceState(null, '', window.location.pathname + window.location.search + newHash);
+  }
+})();
+
+export function getSessionToken(): string | null {
+  try { return sessionStorage.getItem(TOKEN_KEY); } catch { return null; }
+}
+
+export function signInWithNetSuite(returnTo: string = window.location.href) {
+  if (!WORKER_URL) {
+    throw new Error(
+      'VITE_WORKER_URL is not set. HelloLeo Cloud must be provisioned before sign-in works.',
+    );
+  }
+  const url = new URL(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/start\`);
+  url.searchParams.set('return_to', returnTo);
+  // The app usually renders inside the HelloLeo preview iframe. NetSuite's
+  // OAuth page sets X-Frame-Options: DENY, so navigating the iframe to the
+  // Worker (which 302s to NetSuite) ends up loading a page the browser
+  // refuses to render -- looks like "nothing happens" to the user. Navigate
+  // the top frame instead so the OAuth flow runs at the top level and the
+  // callback redirect lands on the same top frame, which then reads the
+  // #nssid= fragment. Fallback to same-frame navigation if the top window
+  // is cross-origin and can't be reassigned.
+  try {
+    if (window.top && window.top !== window) {
+      window.top.location.assign(url.toString());
+      return;
+    }
+  } catch {
+    /* top window not accessible — fall through to same-frame navigation */
+  }
+  window.location.assign(url.toString());
+}
+
+export interface NetSuiteSession {
+  authenticated: boolean;
+  account_id?: string;
+  user_id?: string;
+  email?: string;
+}
+
+export async function getNetSuiteSession(): Promise<NetSuiteSession> {
+  if (!WORKER_URL) return { authenticated: false };
+  const sid = getSessionToken();
+  if (!sid) return { authenticated: false };
+  const res = await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/api/me\`, {
+    headers: { Authorization: 'Bearer ' + sid },
+  });
+  if (!res.ok) return { authenticated: false };
+  const data = await res.json();
+  return { authenticated: Boolean(data?.account_id), ...data };
+}
+
+export async function signOutNetSuite(): Promise<void> {
+  if (!WORKER_URL) return;
+  const sid = getSessionToken();
+  if (sid) {
+    try {
+      await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/logout\`, {
+        method: 'POST',
+        headers: { Authorization: 'Bearer ' + sid },
+      });
+    } catch {}
+  }
+  try { sessionStorage.removeItem(TOKEN_KEY); } catch {}
+  window.location.reload();
+}
+
+/**
+ * Helper for ALL other Worker calls (your dashboard endpoints, etc.).
+ * Always go through this instead of bare fetch -- it injects the bearer
+ * token and routes through the Worker so NetSuite tokens stay server-side.
+ */
+export async function workerFetch(pathOrUrl: string, init: RequestInit = {}): Promise<Response> {
+  if (!WORKER_URL) throw new Error('VITE_WORKER_URL is not set');
+  const url = pathOrUrl.startsWith('http')
+    ? pathOrUrl
+    : \`\${WORKER_URL.replace(/\\/$/, '')}\${pathOrUrl.startsWith('/') ? '' : '/'}\${pathOrUrl}\`;
+  const sid = getSessionToken();
+  const headers = new Headers(init.headers ?? {});
+  if (sid) headers.set('Authorization', 'Bearer ' + sid);
+  return fetch(url, { ...init, headers });
+}
+`;
+}
+
+export function signInButtonTsx(): string {
+	return `import { signInWithNetSuite } from '../../lib/netsuite';
+
+export function SignInWithNetSuite() {
+  return (
+    <button
+      onClick={() => signInWithNetSuite()}
+      className="inline-flex items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+    >
+      Sign in with NetSuite
+    </button>
+  );
+}
+`;
+}
+
+export function netsuiteLoginPageTsx(): string {
+	return `import { SignInWithNetSuite } from './SignInWithNetSuite';
+
+/**
+ * Default unauthenticated landing page. Replaces any password gate.
+ * Customise copy / imagery freely but keep <SignInWithNetSuite /> as the
+ * only call-to-action -- it points to the Worker's /auth/netsuite/start.
+ */
+export function LoginPage() {
+  return (
+    <div className="min-h-screen bg-background text-foreground flex">
+      <div className="hidden lg:flex lg:w-1/2 bg-primary text-primary-foreground p-12 flex-col justify-between">
+        <div className="text-xl font-semibold">NetSuite App</div>
+        <div>
+          <h1 className="text-4xl font-bold leading-tight">
+            Connect your NetSuite account
+          </h1>
+          <p className="mt-4 text-primary-foreground/80 max-w-md">
+            Sign in with your NetSuite credentials to access your data securely.
+            Tokens stay server-side on HelloLeo Cloud -- they never reach the
+            browser.
+          </p>
+        </div>
+        <div className="text-xs text-primary-foreground/60">
+          Powered by HelloLeo
+        </div>
+      </div>
+      <div className="flex-1 flex items-center justify-center px-6 py-12">
+        <div className="w-full max-w-sm space-y-6">
+          <div>
+            <h2 className="text-2xl font-semibold">Welcome</h2>
+            <p className="mt-2 text-sm text-muted-foreground">
+              Use the button below to sign in. You'll be redirected to NetSuite
+              to authorise access, then back here.
+            </p>
+          </div>
+          <SignInWithNetSuite />
+        </div>
+      </div>
+    </div>
+  );
+}
+`;
+}
+
+export function netsuiteAuthGateTsx(): string {
+	return `import { useEffect, useState } from 'react';
+import { LoginPage } from './LoginPage';
+import { getNetSuiteSession, type NetSuiteSession } from '../../lib/netsuite';
+
+/**
+ * Mandatory auth gate for NetSuite projects. Wrap your real App content with
+ * <AuthGate>...</AuthGate>. Never render NetSuite data without this gate -- it
+ * is the ONLY supported authentication for a NetSuite project (no password
+ * gates, no sessionStorage flags, no shared credential).
+ *
+ * Pattern in src/App.tsx:
+ *
+ *   import { AuthGate } from './components/auth/AuthGate';
+ *   export default function App() {
+ *     return (
+ *       <AuthGate>
+ *         <Dashboard />   // your authenticated content
+ *       </AuthGate>
+ *     );
+ *   }
+ */
+export function AuthGate({ children }: { children: React.ReactNode }) {
+  const [session, setSession] = useState<NetSuiteSession | null>(null);
+
+  useEffect(() => { getNetSuiteSession().then(setSession); }, []);
+
+  if (session === null) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-background">
+        <div className="h-8 w-8 rounded-full border-2 border-primary border-t-transparent animate-spin" />
+      </div>
+    );
+  }
+
+  if (!session.authenticated) return <LoginPage />;
+
+  return <>{children}</>;
+}
+`;
+}
+
+export function netsuiteAppTsx(): string {
+	return `import { AuthGate } from './components/auth/AuthGate';
+
+/**
+ * NetSuite project entry point. KEEP <AuthGate> as the outermost element --
+ * removing it disables real OAuth and exposes NetSuite data to anonymous
+ * users. Build your dashboard / pages inside the gate.
+ */
+export default function App() {
+  return (
+    <AuthGate>
+      <div className="min-h-screen bg-background text-foreground p-8">
+        <h1 className="text-2xl font-bold">You are signed in to NetSuite.</h1>
+        <p className="text-muted-foreground mt-2">
+          Replace this placeholder with your dashboard.
+        </p>
+      </div>
+    </AuthGate>
+  );
+}
+`;
+}

package/src/tools/scaffold.ts

@@ -2,6 +2,13 @@ import { mkdir } from "node:fs/promises";
 import path from "node:path";
 import type { Plugin } from "@opencode-ai/plugin";
 import { tool } from "@opencode-ai/plugin";
+import {
+	netsuiteAppTsx,
+	netsuiteAuthGateTsx,
+	netsuiteLoginPageTsx,
+	netsuiteTs,
+	signInButtonTsx,
+} from "./scaffold-netsuite";
 
 function packageJson(name: string) {
 	return JSON.stringify(
@@ -387,248 +394,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 )`;
 }
 
-function netsuiteTs() {
-	return `/*
- * NetSuite OAuth client helper (bearer-token-in-fragment).
- *
- * Two NetSuite Integration Records back this:
- *   1. MCP (scope: mcp)            -- used by HelloLeo at build time.
- *   2. Runtime (scope: rest_webservices) -- used here at sign-in time.
- * Runtime credentials live as HelloLeo Cloud secrets on the project's Worker
- * (env.NETSUITE_ACCOUNT_ID / _CLIENT_ID / _CLIENT_SECRET). They never reach
- * the browser. Cookies are NOT used -- frontend ↔ Worker are cross-site
- * (e.g. *.helloleo.dev <-> *.workers.dev) and Chrome partitions / drops
- * third-party cookies in the HelloLeo preview iframe.
- *
- * Flow:
- *   1. User clicks "Sign in with NetSuite".
- *   2. Browser navigates to the Worker /auth/netsuite/start.
- *   3. Worker redirects to NetSuite's OAuth UI with PKCE.
- *   4. NetSuite redirects back to the Worker /auth/netsuite/callback.
- *   5. Worker exchanges the code, mints a session id, then redirects to
- *      <return_to>#nssid=<sid>. URL fragments stay in the browser only.
- *   6. This module reads the fragment on load, stashes the sid in
- *      sessionStorage, and sends it as Authorization: Bearer on every
- *      Worker call.
- *
- * NEVER use a hardcoded password gate. NEVER use sessionStorage as the
- * authoritative auth state -- the only acceptable check is /api/me on the
- * Worker. sessionStorage here is just a cache of the bearer token.
- */
-
-export const WORKER_URL = import.meta.env.VITE_WORKER_URL ?? '';
-const TOKEN_KEY = 'nssid';
-
-// Capture-and-strip the #nssid=... fragment as early as possible so URLs
-// shown to the user stay clean. Runs once at module load.
-(function bootstrapTokenFromHash() {
-  if (typeof window === 'undefined') return;
-  const hash = window.location.hash.replace(/^#/, '');
-  if (!hash) return;
-  const params = new URLSearchParams(hash);
-  const sid = params.get(TOKEN_KEY);
-  if (sid) {
-    try { sessionStorage.setItem(TOKEN_KEY, sid); } catch {}
-    params.delete(TOKEN_KEY);
-    const remaining = params.toString();
-    const newHash = remaining ? '#' + remaining : '';
-    window.history.replaceState(null, '', window.location.pathname + window.location.search + newHash);
-  }
-})();
-
-export function getSessionToken(): string | null {
-  try { return sessionStorage.getItem(TOKEN_KEY); } catch { return null; }
-}
-
-export function signInWithNetSuite(returnTo: string = window.location.href) {
-  if (!WORKER_URL) {
-    throw new Error(
-      'VITE_WORKER_URL is not set. HelloLeo Cloud must be provisioned before sign-in works.',
-    );
-  }
-  const url = new URL(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/start\`);
-  url.searchParams.set('return_to', returnTo);
-  window.location.assign(url.toString());
-}
-
-export interface NetSuiteSession {
-  authenticated: boolean;
-  account_id?: string;
-  user_id?: string;
-  email?: string;
-}
-
-export async function getNetSuiteSession(): Promise<NetSuiteSession> {
-  if (!WORKER_URL) return { authenticated: false };
-  const sid = getSessionToken();
-  if (!sid) return { authenticated: false };
-  const res = await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/api/me\`, {
-    headers: { Authorization: 'Bearer ' + sid },
-  });
-  if (!res.ok) return { authenticated: false };
-  const data = await res.json();
-  return { authenticated: Boolean(data?.account_id), ...data };
-}
-
-export async function signOutNetSuite(): Promise<void> {
-  if (!WORKER_URL) return;
-  const sid = getSessionToken();
-  if (sid) {
-    try {
-      await fetch(\`\${WORKER_URL.replace(/\\/$/, '')}/auth/netsuite/logout\`, {
-        method: 'POST',
-        headers: { Authorization: 'Bearer ' + sid },
-      });
-    } catch {}
-  }
-  try { sessionStorage.removeItem(TOKEN_KEY); } catch {}
-  window.location.reload();
-}
-
-/**
- * Helper for ALL other Worker calls (your dashboard endpoints, etc.).
- * Always go through this instead of bare fetch -- it injects the bearer
- * token and routes through the Worker so NetSuite tokens stay server-side.
- */
-export async function workerFetch(pathOrUrl: string, init: RequestInit = {}): Promise<Response> {
-  if (!WORKER_URL) throw new Error('VITE_WORKER_URL is not set');
-  const url = pathOrUrl.startsWith('http')
-    ? pathOrUrl
-    : \`\${WORKER_URL.replace(/\\/$/, '')}\${pathOrUrl.startsWith('/') ? '' : '/'}\${pathOrUrl}\`;
-  const sid = getSessionToken();
-  const headers = new Headers(init.headers ?? {});
-  if (sid) headers.set('Authorization', 'Bearer ' + sid);
-  return fetch(url, { ...init, headers });
-}
-`;
-}
-
-function signInButtonTsx() {
-	return `import { signInWithNetSuite } from '../../lib/netsuite';
-
-export function SignInWithNetSuite() {
-  return (
-    <button
-      onClick={() => signInWithNetSuite()}
-      className="inline-flex items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-    >
-      Sign in with NetSuite
-    </button>
-  );
-}
-`;
-}
-
-function netsuiteLoginPageTsx() {
-	return `import { SignInWithNetSuite } from './SignInWithNetSuite';
-
-/**
- * Default unauthenticated landing page. Replaces any password gate.
- * Customise copy / imagery freely but keep <SignInWithNetSuite /> as the
- * only call-to-action -- it points to the Worker's /auth/netsuite/start.
- */
-export function LoginPage() {
-  return (
-    <div className="min-h-screen bg-background text-foreground flex">
-      <div className="hidden lg:flex lg:w-1/2 bg-primary text-primary-foreground p-12 flex-col justify-between">
-        <div className="text-xl font-semibold">NetSuite App</div>
-        <div>
-          <h1 className="text-4xl font-bold leading-tight">
-            Connect your NetSuite account
-          </h1>
-          <p className="mt-4 text-primary-foreground/80 max-w-md">
-            Sign in with your NetSuite credentials to access your data securely.
-            Tokens stay server-side on HelloLeo Cloud -- they never reach the
-            browser.
-          </p>
-        </div>
-        <div className="text-xs text-primary-foreground/60">
-          Powered by HelloLeo
-        </div>
-      </div>
-      <div className="flex-1 flex items-center justify-center px-6 py-12">
-        <div className="w-full max-w-sm space-y-6">
-          <div>
-            <h2 className="text-2xl font-semibold">Welcome</h2>
-            <p className="mt-2 text-sm text-muted-foreground">
-              Use the button below to sign in. You'll be redirected to NetSuite
-              to authorise access, then back here.
-            </p>
-          </div>
-          <SignInWithNetSuite />
-        </div>
-      </div>
-    </div>
-  );
-}
-`;
-}
-
-function netsuiteAuthGateTsx() {
-	return `import { useEffect, useState } from 'react';
-import { LoginPage } from './LoginPage';
-import { getNetSuiteSession, type NetSuiteSession } from '../../lib/netsuite';
-
-/**
- * Mandatory auth gate for NetSuite projects. Wrap your real App content with
- * <AuthGate>...</AuthGate>. Never render NetSuite data without this gate -- it
- * is the ONLY supported authentication for a NetSuite project (no password
- * gates, no sessionStorage flags, no shared credential).
- *
- * Pattern in src/App.tsx:
- *
- *   import { AuthGate } from './components/auth/AuthGate';
- *   export default function App() {
- *     return (
- *       <AuthGate>
- *         <Dashboard />   {/* your authenticated content */}
- *       </AuthGate>
- *     );
- *   }
- */
-export function AuthGate({ children }: { children: React.ReactNode }) {
-  const [session, setSession] = useState<NetSuiteSession | null>(null);
-
-  useEffect(() => { getNetSuiteSession().then(setSession); }, []);
-
-  if (session === null) {
-    return (
-      <div className="min-h-screen flex items-center justify-center bg-background">
-        <div className="h-8 w-8 rounded-full border-2 border-primary border-t-transparent animate-spin" />
-      </div>
-    );
-  }
-
-  if (!session.authenticated) return <LoginPage />;
-
-  return <>{children}</>;
-}
-`;
-}
-
-function netsuiteAppTsx() {
-	return `import { AuthGate } from './components/auth/AuthGate';
-
-/**
- * NetSuite project entry point. KEEP <AuthGate> as the outermost element --
- * removing it disables real OAuth and exposes NetSuite data to anonymous
- * users. Build your dashboard / pages inside the gate.
- */
-export default function App() {
-  return (
-    <AuthGate>
-      <div className="min-h-screen bg-background text-foreground p-8">
-        <h1 className="text-2xl font-bold">You are signed in to NetSuite.</h1>
-        <p className="text-muted-foreground mt-2">
-          Replace this placeholder with your dashboard.
-        </p>
-      </div>
-    </AuthGate>
-  );
-}
-`;
-}
-
 export const scaffold = tool({
 	description:
 		"Scaffold a new React + Vite + Tailwind CSS project with the HelloLeo design system. " +