Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
2026-04-16 22:47:56 +00:00
parent 411137b170
commit c1cd4f415b
3 changed files with 313 additions and 3 deletions
@@ -0,0 +1,143 @@
+import { createFileRoute, useNavigate, Link } from "@tanstack/react-router";
+import { useEffect, useState } from "react";
+import { supabase } from "@/integrations/supabase/client";
+import { useAuth } from "@/lib/auth";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Loader2, Scale } from "lucide-react";
+import { toast } from "sonner";
+
+export const Route = createFileRoute("/setup")({
+  component: SetupPage,
+});
+
+function SetupPage() {
+  const navigate = useNavigate();
+  const { loading, session } = useAuth();
+  const [checking, setChecking] = useState(true);
+  const [allowed, setAllowed] = useState(false);
+  const [name, setName] = useState("");
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [submitting, setSubmitting] = useState(false);
+
+  useEffect(() => {
+    // If anyone exists, block access to /setup
+    (async () => {
+      const { count } = await supabase
+        .from("user_roles")
+        .select("*", { count: "exact", head: true });
+      if ((count ?? 0) === 0) setAllowed(true);
+      setChecking(false);
+    })();
+  }, []);
+
+  useEffect(() => {
+    if (!loading && session && !allowed) navigate({ to: "/" });
+  }, [loading, session, allowed, navigate]);
+
+  const onSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setSubmitting(true);
+    const redirectUrl = `${window.location.origin}/`;
+    const { error } = await supabase.auth.signUp({
+      email: email.trim(),
+      password,
+      options: {
+        emailRedirectTo: redirectUrl,
+        data: { full_name: name.trim() },
+      },
+    });
+    setSubmitting(false);
+    if (error) {
+      toast.error("Could not create account", { description: error.message });
+      return;
+    }
+    toast.success("Founding admin account created");
+    navigate({ to: "/" });
+  };
+
+  if (checking) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-background">
+        <Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
+      </div>
+    );
+  }
+
+  if (!allowed) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-background p-6">
+        <Card className="max-w-md">
+          <CardHeader>
+            <CardTitle className="font-serif">Setup unavailable</CardTitle>
+            <CardDescription>
+              Firm is already initialized. Use the standard sign-in page.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <Button asChild>
+              <Link to="/login">Go to sign in</Link>
+            </Button>
+          </CardContent>
+        </Card>
+      </div>
+    );
+  }
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-background p-6">
+      <Card className="w-full max-w-md">
+        <CardHeader>
+          <div className="flex items-center gap-2 mb-2">
+            <Scale className="h-5 w-5 text-primary" />
+            <span className="font-serif text-lg">Counsel</span>
+          </div>
+          <CardTitle className="font-serif text-2xl">Create founding admin</CardTitle>
+          <CardDescription>
+            This is a one-time setup. The first account becomes the firm administrator and can invite
+            attorneys and staff afterward.
+          </CardDescription>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={onSubmit} className="space-y-4">
+            <div className="space-y-2">
+              <Label htmlFor="name">Full name</Label>
+              <Input id="name" required value={name} onChange={(e) => setName(e.target.value)} />
+            </div>
+            <div className="space-y-2">
+              <Label htmlFor="email">Email</Label>
+              <Input
+                id="email"
+                type="email"
+                required
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+              />
+            </div>
+            <div className="space-y-2">
+              <Label htmlFor="password">Password</Label>
+              <Input
+                id="password"
+                type="password"
+                required
+                minLength={10}
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+              />
+              <p className="text-xs text-muted-foreground">
+                Minimum 10 characters. Avoid commonly leaked passwords.
+              </p>
+            </div>
+            <Button type="submit" className="w-full" disabled={submitting}>
+              {submitting && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+              Create admin account
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}