create-solostack 1.3.4 → 1.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-solostack",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "description": "The complete SaaS boilerplate for indie hackers - Next.js 15 with auth, payments, database, and email",
   "type": "module",
   "bin": {

package/src/generators/auth.js

@@ -21,6 +21,7 @@ async function generateSupabaseAuth(projectPath) {
   // Create auth directories
   await ensureDir(path.join(projectPath, 'src/app/auth/callback'));
   await ensureDir(path.join(projectPath, 'src/app/login'));
+  await ensureDir(path.join(projectPath, 'src/app/signup'));
   await ensureDir(path.join(projectPath, 'src/app/private'));
 
   // 1. Client Utility
@@ -73,7 +74,7 @@ export function createClient(cookieStore: ReturnType<typeof cookies>) {
 `;
   await writeFile(path.join(projectPath, 'src/utils/supabase/server.ts'), serverUtil);
 
-  // 3. MacOS/Middleware Utility
+  // 3. Middleware Utility
   const middlewareUtil = `import { createServerClient, type CookieOptions } from '@supabase/ssr'
 import { NextResponse, type NextRequest } from 'next/server'
 
@@ -191,6 +192,7 @@ import { createClient } from '@/utils/supabase/client';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { Rocket } from 'lucide-react';
+import Link from 'next/link';
 
 export default function LoginPage() {
   const router = useRouter();
@@ -301,6 +303,13 @@ export default function LoginPage() {
             {loading ? 'Signing in...' : 'Sign In'}
           </button>
         </form>
+
+        <div className="text-center text-sm">
+          <span className="text-zinc-500">Don't have an account? </span>
+          <Link href="/signup" className="font-medium text-indigo-400 hover:text-indigo-300">
+            Sign up
+          </Link>
+        </div>
       </div>
     </div>
   );
@@ -308,6 +317,150 @@ export default function LoginPage() {
 `;
 
   await writeFile(path.join(projectPath, 'src/app/login/page.tsx'), loginPage);
+
+  // 7. Signup Page (Supabase)
+  const signupPage = `'use client';
+import { createClient } from '@/utils/supabase/client';
+import { useRouter } from 'next/navigation';
+import { useState } from 'react';
+import { Rocket } from 'lucide-react';
+import Link from 'next/link';
+
+export default function SignupPage() {
+  const router = useRouter();
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [message, setMessage] = useState('');
+
+  const supabase = createClient();
+
+  const handleEmailSignup = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setLoading(true);
+    setMessage('');
+    
+    const { error } = await supabase.auth.signUp({
+      email,
+      password,
+      options: {
+        emailRedirectTo: \`\${location.origin}/auth/callback\`,
+      },
+    });
+    
+    if (error) {
+      setMessage(error.message);
+    } else {
+      setMessage('Check your email for the confirmation link!');
+    }
+    setLoading(false);
+  };
+
+  const handleGitHubLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'github',
+      options: {
+        redirectTo: \`\${location.origin}/auth/callback\`,
+      },
+    });
+  };
+
+  const handleGoogleLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'google',
+      options: {
+        redirectTo: \`\${location.origin}/auth/callback\`,
+      },
+    });
+  };
+
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-center bg-zinc-950 p-4 text-white">
+      <div className="w-full max-w-sm space-y-8 rounded-xl border border-zinc-800 bg-zinc-900/50 p-8 shadow-xl backdrop-blur-xl">
+        <div className="text-center">
+          <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-lg bg-indigo-600">
+            <Rocket className="h-6 w-6 text-white" />
+          </div>
+          <h2 className="text-2xl font-bold tracking-tight">Create account</h2>
+          <p className="mt-2 text-sm text-zinc-400">Sign up to get started</p>
+        </div>
+
+        <div className="space-y-4">
+          <button 
+             onClick={handleGitHubLogin}
+             className="w-full rounded-md border border-zinc-700 bg-zinc-800 py-2 text-sm font-medium hover:bg-zinc-700 transition-colors"
+          >
+            Continue with GitHub
+          </button>
+          <button 
+             onClick={handleGoogleLogin}
+             className="w-full rounded-md border border-zinc-700 bg-zinc-800 py-2 text-sm font-medium hover:bg-zinc-700 transition-colors"
+          >
+            Continue with Google
+          </button>
+        </div>
+
+        <div className="relative">
+          <div className="absolute inset-0 flex items-center">
+            <div className="w-full border-t border-zinc-800" />
+          </div>
+          <div className="relative flex justify-center text-xs uppercase">
+            <span className="bg-zinc-900 px-2 text-zinc-500">Or continue with</span>
+          </div>
+        </div>
+
+        <form onSubmit={handleEmailSignup} className="space-y-4">
+          <div>
+            <label className="mb-2 block text-sm font-medium text-zinc-400">Email</label>
+            <input
+              type="email"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+              className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm placeholder:text-zinc-600 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500"
+              required
+            />
+          </div>
+          <div>
+            <label className="mb-2 block text-sm font-medium text-zinc-400">Password</label>
+            <input
+              type="password"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+              className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm placeholder:text-zinc-600 focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500"
+              placeholder="Min 6 characters"
+              minLength={6}
+              required
+            />
+          </div>
+          
+          {message && (
+            <p className={message.includes('Check') ? 'text-sm text-green-400' : 'text-sm text-red-400'}>
+              {message}
+            </p>
+          )}
+
+          <button
+            type="submit"
+            disabled={loading}
+            className="w-full rounded-md bg-indigo-600 py-2 text-sm font-medium text-white hover:bg-indigo-500 disabled:opacity-50"
+          >
+            {loading ? 'Creating account...' : 'Sign Up'}
+          </button>
+        </form>
+
+        <div className="text-center text-sm">
+          <span className="text-zinc-500">Already have an account? </span>
+          <Link href="/login" className="font-medium text-indigo-400 hover:text-indigo-300">
+            Sign in
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}
+`;
+
+  await writeFile(path.join(projectPath, 'src/app/signup/page.tsx'), signupPage);
 }
 
 async function generateNextAuth(projectPath) {

package/src/index.js

@@ -53,7 +53,7 @@ export async function main() {
   ╚════════════════════════════════════════════════════════════════╝
     `));
 
-    console.log(chalk.gray(`    Version ${orangeBright('1.3.4')} • Built by ${orangeBright('Danish Akhtar')} • ${orangeBright('github.com/danish296')}\n`));
+    console.log(chalk.gray(`    Version ${orangeBright('1.3.5')} • Built by ${orangeBright('Danish Akhtar')} • ${orangeBright('github.com/danish296')}\n`));
 
     // Parse command line arguments
     program