// app/sign-in/page.tsx
import { SignInForm } from "@/components/sign-in-form";
 
export default function SignInPage() {
  return <SignInForm />;
}

// components/sign-in-form.tsx
"use client";
 
import { useSignIn } from "@bolkauth/react";
import { useRouter } from "next/navigation";
import { useState } from "react";
 
export function SignInForm() {
  const router = useRouter();
  const { signIn, isLoading, error } = useSignIn();
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
 
  async function onSubmit(event: React.FormEvent) {
    event.preventDefault();
    const result = await signIn({ email, password });
 
    if (!result.error) {
      router.push("/dashboard");
      router.refresh();
    }
  }
 
  return (
    <form onSubmit={onSubmit}>
      <input type="email" value={email} onChange={(event) => setEmail(event.target.value)} />
      <input type="password" value={password} onChange={(event) => setPassword(event.target.value)} />
      {error && <p>{error.message}</p>}
      <button disabled={isLoading}>Sign in</button>
    </form>
  );
}

// app/dashboard/page.tsx
import { requireAuth } from "@/lib/auth-server";
 
export default async function DashboardPage() {
  const user = await requireAuth();
 
  return (
    <main>
      <h1>Dashboard</h1>
      <p>Signed in as {user.email}</p>
    </main>
  );
}

"use client";
 
import { useOAuth } from "@bolkauth/react";
 
export function OAuthButtons() {
  const { signInWithOAuth } = useOAuth();
 
  return (
    <div>
      <button onClick={() => signInWithOAuth("github")}>GitHub</button>
      <button onClick={() => signInWithOAuth("google")}>Google</button>
    </div>
  );
}

"use client";
 
import { useRouter } from "next/navigation";
import { useState } from "react";
 
export function SignOutButton() {
  const router = useRouter();
  const [isLoading, setIsLoading] = useState(false);
 
  async function signOut() {
    setIsLoading(true);
    await fetch("/api/auth/sign-out", { method: "POST" });
    router.push("/sign-in");
    router.refresh();
  }
 
  return <button disabled={isLoading} onClick={signOut}>Sign out</button>;
}

// app/api/projects/route.ts
import { getUser } from "@/lib/auth-server";
import { NextResponse } from "next/server";
 
export async function GET() {
  const user = await getUser();
 
  if (!user) {
    return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
  }
 
  return NextResponse.json({ projects: [] });
}