ta_data_mas 0.0.2

package/apps/web/src/app/globals.css

@@ -0,0 +1,115 @@
+@import 'tailwindcss';
+@import 'tw-animate-css';
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --font-sans: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+
+    --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+}
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.205 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(0.985 0 0);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+
+
+    --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.955 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.371 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.985 0 0);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+
+    --sidebar: oklch(0.18 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.985 0 0);
+  --sidebar-primary-foreground: oklch(0.205 0 0);
+  --sidebar-accent: oklch(0.24 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply bg-background text-foreground font-sans antialiased;
+  }
+}

package/apps/web/src/app/layout.tsx

@@ -0,0 +1,36 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import "./globals.css";
+import { TooltipProvider } from "@/components/ui/tooltip";
+
+const geistSans = Geist({
+  variable: "--font-geist-sans",
+  subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+  title: "Api_Database Model",
+  description: "Generated by create next app",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html
+      lang="en"
+      className={`${geistSans.variable} ${geistMono.variable} h-full antialiased`}
+    >
+      <body className="min-h-full flex flex-col">
+        <TooltipProvider>{children}</TooltipProvider>
+      </body>
+    </html>
+  );
+}

package/apps/web/src/app/login/page.tsx

@@ -0,0 +1,199 @@
+"use client";
+
+import { useActionState } from "react";
+import Image from "next/image";
+import { Controller, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import Link from "next/link";
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import {
+  Field,
+  FieldError,
+  FieldGroup,
+  FieldLabel,
+} from "@/components/ui/field";
+import { Input } from "@/components/ui/input";
+import { authAction } from "@/features/auth/action";
+import { AUTH_INTENT } from "@/features/auth/constants";
+import { loginSchema } from "@/features/auth/client.schema";
+
+type LoginFormValues = z.infer<typeof loginSchema>;
+
+export default function LoginPage() {
+  const [state, formAction, isPending] = useActionState(authAction, {});
+
+  const form = useForm<LoginFormValues>({
+    resolver: zodResolver(loginSchema),
+    defaultValues: { email: "", password: "" },
+  });
+
+  return (
+    <main className="px-4 py-4">
+      <Link className="flex items-center gap-2 italic font-semibold" href="/">
+        <Image
+          className="h-9 md:h-9.5 w-auto shrink-0 "
+          src="/logo.svg"
+          alt="Logo"
+          width={140}
+          height={40}
+          priority
+          fetchPriority="high"
+        />
+        ta_data_mas
+      </Link>
+
+      <div className="min-h-screen flex items-center justify-center bg-muted/40 px-4 py-12">
+        <Card className="w-full max-w-md shadow-sm italic">
+          <CardHeader>
+            <CardTitle>Welcome back</CardTitle>
+            <CardDescription>
+              Sign in to your ta_data_mas account
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            {state.error && (
+              <div className="bg-destructive/10 text-destructive text-sm rounded-lg px-4 py-3 mb-4">
+                {state.error}
+              </div>
+            )}
+
+            <form
+              action={formAction}
+              noValidate
+              onSubmitCapture={async (e) => {
+                const ok = await form.trigger(undefined, { shouldFocus: true });
+                if (!ok) e.preventDefault();
+              }}
+              className="space-y-4"
+            >
+              <FieldGroup>
+                <Controller
+                  name="email"
+                  control={form.control}
+                  render={({ field, fieldState }) => (
+                    <Field data-invalid={fieldState.invalid}>
+                      <FieldLabel htmlFor="login-email">Email</FieldLabel>
+                      <Input
+                        {...field}
+                        id="login-email"
+                        type="email"
+                        autoComplete="email"
+                        aria-invalid={fieldState.invalid}
+                      />
+                      {fieldState.invalid && (
+                        <FieldError errors={[fieldState.error]} />
+                      )}
+                    </Field>
+                  )}
+                />
+
+                <Controller
+                  name="password"
+                  control={form.control}
+                  render={({ field, fieldState }) => (
+                    <Field data-invalid={fieldState.invalid}>
+                      <FieldLabel htmlFor="login-password">Password</FieldLabel>
+                      <Input
+                        {...field}
+                        id="login-password"
+                        type="password"
+                        autoComplete="current-password"
+                        aria-invalid={fieldState.invalid}
+                      />
+                      {fieldState.invalid && (
+                        <FieldError errors={[fieldState.error]} />
+                      )}
+                    </Field>
+                  )}
+                />
+              </FieldGroup>
+
+              <Button
+                type="submit"
+                name="intent"
+                value={AUTH_INTENT.LOGIN}
+                disabled={isPending}
+                size="lg"
+                className="w-full"
+              >
+                {isPending ? "Signing in..." : "Sign in"}
+              </Button>
+            </form>
+
+            <div className="relative my-6">
+              <div className="absolute inset-0 flex items-center">
+                <div className="w-full border-t" />
+              </div>
+              <div className="relative flex justify-center text-xs text-muted-foreground bg-card px-2">
+                or continue with
+              </div>
+            </div>
+
+            <div className="space-y-3">
+              <Button variant="outline" size="lg" className="w-full" asChild>
+                <a
+                  href={`${process.env.NEXT_PUBLIC_API_URL}/auth/google`}
+                  className="inline-flex items-center justify-center gap-2"
+                >
+                  <svg className="size-4 shrink-0" viewBox="0 0 24 24">
+                    <path
+                      fill="#4285F4"
+                      d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
+                    />
+                    <path
+                      fill="#34A853"
+                      d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
+                    />
+                    <path
+                      fill="#FBBC05"
+                      d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l3.66-2.84z"
+                    />
+                    <path
+                      fill="#EA4335"
+                      d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
+                    />
+                  </svg>
+                  Continue with Google
+                </a>
+              </Button>
+
+              <Button variant="outline" size="lg" className="w-full" asChild>
+                <a
+                  href={`${process.env.NEXT_PUBLIC_API_URL}/auth/github`}
+                  className="inline-flex items-center justify-center gap-2"
+                >
+                  <svg
+                    className="size-4 shrink-0"
+                    fill="currentColor"
+                    viewBox="0 0 24 24"
+                  >
+                    <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z" />
+                  </svg>
+                  Continue with GitHub
+                </a>
+              </Button>
+            </div>
+
+            <p className="text-center text-sm text-muted-foreground mt-6">
+              Don&apos;t have an account?{" "}
+              <Link
+                href="/register"
+                className="font-medium text-foreground hover:underline"
+              >
+                Sign up
+              </Link>
+            </p>
+          </CardContent>
+        </Card>
+      </div>
+    </main>
+  );
+}

package/apps/web/src/app/page.tsx

@@ -0,0 +1,100 @@
+"use client";
+import {
+  RocketIcon,
+  ShapesIcon,
+  ThumbsUpIcon,
+  HardDrive,
+  BookHeart,
+  DatabasePlus,
+  KeySquare,
+} from "lucide-react";
+
+import Navbar from "@/components/navbar";
+
+export const featuresData = [
+  {
+    icon: DatabasePlus,
+    title: "Postgres Database",
+    description:
+      "Every project is a full Postgres database.Portable,extensible and ready to query...",
+  },
+  {
+    icon: ThumbsUpIcon,
+    title: "JavaScript SDK",
+    description:
+      "Query your backend from any app with the official ta_data_mas client library...",
+  },
+  {
+    icon: KeySquare,
+    title: "Authentication",
+    description:
+      "Add user sign ups and logins.Email,magic link and OAuth providers built in...",
+  },
+  {
+    icon: RocketIcon,
+    title: "Realtime",
+    description: "Built multiplayer experiences with real-time data sync...",
+  },
+  {
+    icon: HardDrive,
+    title: "Storage",
+    description:
+      "Store,organize and serve large files --from avatars to large video files...",
+  },
+  {
+    icon: BookHeart,
+    title: "Data APIs",
+    description:
+      "Instant ready-to-use REST APIs for every table in your project...",
+  },
+];
+
+// import { useEffect, useState } from "react";
+
+export default function Home() {
+  // const [status, setStatus] = useState("checking...");
+
+  // useEffect(() => {
+  //   fetch(`${process.env.NEXT_PUBLIC_API_URL}/health`)
+  //     .then((r) => r.json())
+  //     .then((data) => setStatus(data.status))
+  //     .catch(() => setStatus("unreachable"));
+  // }, []);
+
+  return (
+    <main className=" bg-slate-300">
+      <nav className="mt-2">
+        <Navbar />
+      </nav>
+      <div className="flex items-center gap-4 flex-col mt-10">
+        <h1 className=" text-2xl/5 md:text-[44px]/10 font-semibold max-w-2xl italic  text-center">
+          Build your own database with{" "}
+          <span className="text-blue-400  ">ta_data_mas</span>
+        </h1>
+        <p className="text-base dark:text-slate-300 max-w-lg ">
+          Start your project with a Postgres database,Add Authentication,Data
+          APIs,Realtime,Storage,and a Javascript SDK --all from one dashboard...
+        </p>
+      </div>
+      <div className="flex flex-wrap items-center justify-center gap-6 md:gap-4 mt-10 px-6 md:px-16 lg:px-24 xl:px-32">
+        {featuresData.map((feature, index) => (
+          <div
+            key={index}
+            className="p-3 rounded-xl space-y-3 border border-slate-200 dark:border-slate-800 bg-blue-100 dark:bg-slate-800/20 max-w-80 md:max-w-66"
+          >
+            <feature.icon
+              className="text-slate-500 size-8 mt-4"
+              strokeWidth={1.3}
+            />
+            <h3 className="text-base font-medium">{feature.title}</h3>
+            <p className="text-slate-700 line-clamp-2">{feature.description}</p>
+          </div>
+        ))}
+      </div>
+    </main>
+    // <main className="flex min-h-screen flex-col items-center justify-center p-24">
+    //   <h1 className="text-4xl font-bold italic">ta_data_mas</h1>
+    //   <p className="mt-4 text-gray-500">API status: {status}</p>
+    // </main>
+  );
+}

package/apps/web/src/app/register/page.tsx

@@ -0,0 +1,218 @@
+"use client";
+
+import { useActionState } from "react";
+import Image from "next/image";
+import { Controller, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import Link from "next/link";
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import {
+  Field,
+  FieldError,
+  FieldGroup,
+  FieldLabel,
+} from "@/components/ui/field";
+import { Input } from "@/components/ui/input";
+import { authAction } from "@/features/auth/action";
+import { AUTH_INTENT } from "@/features/auth/constants";
+import { registerSchema } from "@/features/auth/client.schema";
+
+type RegisterFormValues = z.infer<typeof registerSchema>;
+
+export default function RegisterPage() {
+  const [state, formAction, isPending] = useActionState(authAction, {});
+
+  const form = useForm<RegisterFormValues>({
+    resolver: zodResolver(registerSchema),
+    defaultValues: { email: "", password: "", name: "" },
+  });
+
+  return (
+    <main className="px-4 py-4">
+      <Link className="flex items-center gap-2 italic font-semibold" href="/">
+        <Image
+          className="h-9 md:h-9.5 w-auto shrink-0 "
+          src="/logo.svg"
+          alt="Logo"
+          width={140}
+          height={40}
+          priority
+          fetchPriority="high"
+        />
+        ta_data_mas
+      </Link>
+      <div className="min-h-screen flex items-center justify-center bg-muted/40 px-4 py-12">
+        <Card className="w-full max-w-md shadow-sm italic">
+          <CardHeader>
+            <CardTitle>Create an account</CardTitle>
+            <CardDescription>
+              Start building with ta_data_mas Model
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            {state.error && (
+              <div className="bg-destructive/10 text-destructive text-sm rounded-lg px-4 py-3 mb-4">
+                {state.error}
+              </div>
+            )}
+
+            <form
+              action={formAction}
+              noValidate
+              onSubmitCapture={async (e) => {
+                const ok = await form.trigger(undefined, { shouldFocus: true });
+                if (!ok) e.preventDefault();
+              }}
+              className="space-y-4"
+            >
+              <FieldGroup>
+                <Controller
+                  name="name"
+                  control={form.control}
+                  render={({ field, fieldState }) => (
+                    <Field data-invalid={fieldState.invalid}>
+                      <FieldLabel htmlFor="register-name">Name</FieldLabel>
+                      <Input
+                        {...field}
+                        id="register-name"
+                        type="text"
+                        autoComplete="name"
+                        aria-invalid={fieldState.invalid}
+                      />
+                      {fieldState.invalid && (
+                        <FieldError errors={[fieldState.error]} />
+                      )}
+                    </Field>
+                  )}
+                />
+
+                <Controller
+                  name="email"
+                  control={form.control}
+                  render={({ field, fieldState }) => (
+                    <Field data-invalid={fieldState.invalid}>
+                      <FieldLabel htmlFor="login-email">Email</FieldLabel>
+                      <Input
+                        {...field}
+                        id="login-email"
+                        type="email"
+                        autoComplete="email"
+                        aria-invalid={fieldState.invalid}
+                      />
+                      {fieldState.invalid && (
+                        <FieldError errors={[fieldState.error]} />
+                      )}
+                    </Field>
+                  )}
+                />
+
+                <Controller
+                  name="password"
+                  control={form.control}
+                  render={({ field, fieldState }) => (
+                    <Field data-invalid={fieldState.invalid}>
+                      <FieldLabel htmlFor="login-password">Password</FieldLabel>
+                      <Input
+                        {...field}
+                        id="login-password"
+                        type="password"
+                        autoComplete="current-password"
+                        aria-invalid={fieldState.invalid}
+                      />
+                      {fieldState.invalid && (
+                        <FieldError errors={[fieldState.error]} />
+                      )}
+                    </Field>
+                  )}
+                />
+              </FieldGroup>
+
+              <Button
+                type="submit"
+                name="intent"
+                value={AUTH_INTENT.REGISTER}
+                disabled={isPending}
+                size="lg"
+                className="w-full"
+              >
+                {isPending ? "Creating account..." : "Create Account"}
+              </Button>
+            </form>
+
+            <div className="relative my-6">
+              <div className="absolute inset-0 flex items-center">
+                <div className="w-full border-t" />
+              </div>
+              <div className="relative flex justify-center text-xs text-muted-foreground bg-card px-2">
+                or continue with
+              </div>
+            </div>
+
+            <div className="space-y-3">
+              <Button variant="outline" size="lg" className="w-full" asChild>
+                <a
+                  href={`${process.env.NEXT_PUBLIC_API_URL}/auth/google`}
+                  className="inline-flex items-center justify-center gap-2"
+                >
+                  <svg className="size-4 shrink-0" viewBox="0 0 24 24">
+                    <path
+                      fill="#4285F4"
+                      d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
+                    />
+                    <path
+                      fill="#34A853"
+                      d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
+                    />
+                    <path
+                      fill="#FBBC05"
+                      d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l3.66-2.84z"
+                    />
+                    <path
+                      fill="#EA4335"
+                      d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
+                    />
+                  </svg>
+                  Continue with Google
+                </a>
+              </Button>
+
+              <Button variant="outline" size="lg" className="w-full" asChild>
+                <a
+                  href={`${process.env.NEXT_PUBLIC_API_URL}/auth/github`}
+                  className="inline-flex items-center justify-center gap-2"
+                >
+                  <svg
+                    className="size-4 shrink-0"
+                    fill="currentColor"
+                    viewBox="0 0 24 24"
+                  >
+                    <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z" />
+                  </svg>
+                  Continue with GitHub
+                </a>
+              </Button>
+            </div>
+
+            <p className="text-center text-sm text-muted-foreground mt-6">
+              Don&apos;t have an account?{" "}
+              <Link
+                href="/login"
+                className="font-medium text-foreground hover:underline"
+              >
+                Sign in
+              </Link>
+            </p>
+          </CardContent>
+        </Card>
+      </div>
+    </main>
+  );
+}