create-alta-app 2.0.0 → 2.2.0

package/index.mjs

@@ -148,17 +148,9 @@ export default function Root() {
 
   fs.writeFileSync(
     path.join(appDir, 'components', 'layout', 'header.tsx'),
-    `import { Separator } from '@alta/design-system/components/ui/separator';
-import { Text } from '@alta/design-system/components/ui/text';
-
-export function Header() {
+    `export function Header() {
   return (
-    <header className="flex h-14 items-center gap-2 border-b px-4">
-      <Separator orientation="vertical" className="h-4" />
-      <div className="ml-auto flex items-center gap-3">
-        <Text variant="muted">Alta App</Text>
-      </div>
-    </header>
+    <header className="flex h-14 items-center justify-end border-b px-4" />
   );
 }
 `
@@ -166,49 +158,10 @@ export function Header() {
 
   fs.writeFileSync(
     path.join(appDir, 'routes', 'app', 'dashboard.tsx'),
-    `import { Card, CardContent, CardHeader, CardTitle } from '@alta/design-system/components/ui/card';
-import { Text } from '@alta/design-system/components/ui/text';
-import { Badge } from '@alta/design-system/components/ui/badge';
-import { Separator } from '@alta/design-system/components/ui/separator';
-
-export default function DashboardRoute() {
+    `export default function DashboardRoute() {
   return (
     <div className="space-y-6">
-      <div>
-        <Text variant="heading3">Dashboard</Text>
-        <Text variant="muted" className="mt-1">Welcome to your app</Text>
-      </div>
-      <Separator />
-      <div className="grid gap-4 md:grid-cols-3">
-        <Card>
-          <CardHeader className="flex flex-row items-center justify-between pb-2">
-            <CardTitle className="text-sm font-medium text-muted-foreground">Status</CardTitle>
-            <Badge variant="default">Active</Badge>
-          </CardHeader>
-          <CardContent>
-            <Text variant="heading3">All systems go</Text>
-            <Text variant="small" className="mt-1 text-muted-foreground">Your app is running smoothly</Text>
-          </CardContent>
-        </Card>
-        <Card>
-          <CardHeader className="pb-2">
-            <CardTitle className="text-sm font-medium text-muted-foreground">Environment</CardTitle>
-          </CardHeader>
-          <CardContent>
-            <Text variant="heading3">Development</Text>
-            <Text variant="small" className="mt-1 text-muted-foreground">Local dev server</Text>
-          </CardContent>
-        </Card>
-        <Card>
-          <CardHeader className="pb-2">
-            <CardTitle className="text-sm font-medium text-muted-foreground">Framework</CardTitle>
-          </CardHeader>
-          <CardContent>
-            <Text variant="heading3">Alta</Text>
-            <Text variant="small" className="mt-1 text-muted-foreground">React + Supabase + Vercel</Text>
-          </CardContent>
-        </Card>
-      </div>
+      <h1 className="text-2xl font-bold">Dashboard</h1>
     </div>
   );
 }
@@ -217,24 +170,10 @@ export default function DashboardRoute() {
 
   fs.writeFileSync(
     path.join(appDir, 'routes', 'app', 'settings.tsx'),
-    `import { Card, CardContent, CardHeader, CardTitle } from '@alta/design-system/components/ui/card';
-import { Text } from '@alta/design-system/components/ui/text';
-
-export default function SettingsRoute() {
+    `export default function SettingsRoute() {
   return (
     <div className="space-y-6">
-      <div>
-        <Text variant="heading3">Settings</Text>
-        <Text variant="muted" className="mt-1">Manage your app preferences</Text>
-      </div>
-      <Card>
-        <CardHeader>
-          <CardTitle>App Settings</CardTitle>
-        </CardHeader>
-        <CardContent>
-          <Text variant="paragraph">Configure your app here.</Text>
-        </CardContent>
-      </Card>
+      <h1 className="text-2xl font-bold">Settings</h1>
     </div>
   );
 }
@@ -430,30 +369,17 @@ async function main() {
     credentials = null;
   }
 
-  // ── Step 4: Login to Supabase CLI ──
-  const SUPABASE_TOKEN = 'sbp_66e351be37d4e570fe4347ea7c78bbebc8988219';
-  const spinnerLogin = ora({ text: 'Logging in to Supabase CLI...', indent: 2 }).start();
-  try {
-    run(`npx supabase login --token ${SUPABASE_TOKEN}`, targetDir);
-    process.env.SUPABASE_ACCESS_TOKEN = SUPABASE_TOKEN;
-    spinnerLogin.succeed(pc.green('Supabase CLI authenticated'));
-  } catch {
-    spinnerLogin.warn(pc.yellow('Could not login to Supabase CLI'));
-    console.log(`  ${pc.dim('Run manually: npx supabase login')}`);
-  }
-
-  // ── Step 5: Wait for Supabase project to provision & get anon key ──
+  // ── Step 4: Wait for Supabase project to provision & get anon key ──
   let anonKey = '';
   if (credentials) {
     const spinnerKeys = ora({ text: 'Waiting for Supabase project to provision...', indent: 2 }).start();
-    const token = process.env.SUPABASE_ACCESS_TOKEN;
     const ref = credentials.supabaseProjectRef;
 
     for (let i = 0; i < 24; i++) {
       await new Promise((r) => setTimeout(r, 5000));
       try {
         const res = await fetch(`https://api.supabase.com/v1/projects/${ref}/api-keys`, {
-          headers: { Authorization: `Bearer ${token}` },
+          headers: { Authorization: `Bearer ${credentials.supabaseToken}` },
         });
         if (res.ok) {
           const keys = await res.json();
@@ -522,15 +448,38 @@ async function main() {
   }
 
 
-  // ── Step 6: Link Supabase project (uses SUPABASE_ACCESS_TOKEN from env) ──
+  // ── Step 6: Login & link Supabase ──
   if (credentials) {
     const spinnerLink = ora({ text: 'Linking Supabase project...', indent: 2 }).start();
     try {
+      run(`npx supabase login --token ${credentials.supabaseToken}`, targetDir);
       run(`npx supabase link --project-ref ${credentials.supabaseProjectRef}`, targetDir);
       spinnerLink.succeed(pc.green('Supabase project linked'));
     } catch {
       spinnerLink.warn(pc.yellow('Could not link Supabase project'));
-      console.log(`  ${pc.dim(`Run manually: cd ${projectName} && npx supabase link --project-ref ${credentials.supabaseProjectRef}`)}`);
+      console.log(`  ${pc.dim(`Run manually: npx supabase login && npx supabase link --project-ref ${credentials.supabaseProjectRef}`)}`);
+    }
+  }
+
+  // ── Step 6b: Login & link Vercel ──
+  if (credentials) {
+    // Check if already logged in to Vercel
+    if (!canRun('npx vercel whoami')) {
+      console.log(`\n  ${pc.cyan('Vercel login required — opening browser...')}\n`);
+      try {
+        execSync('npx vercel login', { cwd: targetDir, stdio: 'inherit' });
+      } catch {
+        console.log(`  ${pc.dim('Vercel login skipped — run "vercel login" later to enable deploys')}`);
+      }
+    }
+
+    const spinnerVercel = ora({ text: 'Linking Vercel project...', indent: 2 }).start();
+    try {
+      run(`npx vercel link --project ${projectName} --yes`, targetDir);
+      spinnerVercel.succeed(pc.green('Vercel project linked'));
+    } catch {
+      spinnerVercel.warn(pc.yellow('Could not link Vercel project'));
+      console.log(`  ${pc.dim('Run manually: vercel link --project ' + projectName)}`);
     }
   }
 
@@ -546,7 +495,7 @@ async function main() {
           supabase: {
             url: `https://mcp.supabase.com/mcp`,
             headers: {
-              'x-supabase-access-token': SUPABASE_TOKEN,
+              'x-supabase-access-token': credentials.supabaseToken,
               'x-project-ref': credentials.supabaseProjectRef,
             },
           },
@@ -600,7 +549,7 @@ async function main() {
       spinnerDeploy.succeed(pc.green('Deployed to Vercel'));
     } catch {
       spinnerDeploy.warn(pc.yellow('Could not deploy to Vercel'));
-      console.log(`  ${pc.dim('Deploy manually: cd ' + projectName + ' && pnpm deploy')}`);
+      console.log(`  ${pc.dim('Deploy manually: cd ' + projectName + ' && pnpm run deploy')}`);
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-alta-app",
-  "version": "2.0.0",
+  "version": "2.2.0",
   "description": "Create a new Alta project",
   "bin": {
     "create-alta-app": "./index.mjs"