1da90c2756
### What? [1] Clean up `with-supabase` example following patterns from @leerob's recent video on authentication [2] Add images to matcher to reduce number of times a session is refreshed [3] Move instantiation of `cookieStore` into Supabase server helper ### Why? [1] Make template easier to understand and use [2] Reduce likelihood users will receive Auth Rate Limit Exceeded error [3] Makes creating a Supabase client much simpler in Server Components, Route Handlers and Server Actions ### How? [1] Refactor middleware and its helper function [2] Add image extensions to middleware matcher [3] Call `cookies()` function from `createClient` helper - this should still be in the [same execution context](https://nextjs.org/docs/messages/dynamic-server-error) and appears to work from my testing, but would be good to get the 👍 from someone at Vercel
37 lines
910 B
TypeScript
37 lines
910 B
TypeScript
import { createClient } from "@/utils/supabase/server";
|
|
import Link from "next/link";
|
|
import { redirect } from "next/navigation";
|
|
|
|
export default async function AuthButton() {
|
|
const supabase = createClient();
|
|
|
|
const {
|
|
data: { user },
|
|
} = await supabase.auth.getUser();
|
|
|
|
const signOut = async () => {
|
|
"use server";
|
|
|
|
const supabase = createClient();
|
|
await supabase.auth.signOut();
|
|
return redirect("/login");
|
|
};
|
|
|
|
return user ? (
|
|
<div className="flex items-center gap-4">
|
|
Hey, {user.email}!
|
|
<form action={signOut}>
|
|
<button className="py-2 px-4 rounded-md no-underline bg-btn-background hover:bg-btn-background-hover">
|
|
Logout
|
|
</button>
|
|
</form>
|
|
</div>
|
|
) : (
|
|
<Link
|
|
href="/login"
|
|
className="py-2 px-3 flex rounded-md no-underline bg-btn-background hover:bg-btn-background-hover"
|
|
>
|
|
Login
|
|
</Link>
|
|
);
|
|
}
|