├── .eslintrc.json
├── .gitignore
├── README.md
├── app
├── admin
│ └── page.tsx
├── api
│ ├── auth
│ │ ├── [...nextauth]
│ │ │ └── route.ts
│ │ └── verify-password-reset-token
│ │ │ └── route.ts
│ └── subscribe
│ │ └── route.ts
├── auth-error
│ └── page.tsx
├── client
│ └── page.tsx
├── course
│ └── subscribe
│ │ ├── email-sent
│ │ └── page.tsx
│ │ ├── error
│ │ └── page.tsx
│ │ ├── status
│ │ └── page.tsx
│ │ └── success
│ │ └── page.tsx
├── favicon.ico
├── fonts
│ ├── GeistMonoVF.woff
│ └── GeistVF.woff
├── forgot-password
│ ├── email-sent
│ │ └── page.tsx
│ └── page.tsx
├── globals.css
├── layout.tsx
├── page.tsx
├── password-reset-actions.ts
├── private
│ └── page.tsx
├── reset-password
│ ├── page.tsx
│ ├── success
│ │ └── page.tsx
│ └── verify
│ │ └── page.tsx
├── schema.ts
├── server
│ └── page.tsx
├── signin-actions.ts
├── signin
│ ├── email-sent
│ │ └── page.tsx
│ ├── page.tsx
│ └── verify-email
│ │ └── page.tsx
└── verify-email
│ └── page.tsx
├── auth.config.ts
├── auth.ts
├── components.json
├── components
├── email-signin-template.tsx
├── email-verification-template.tsx
├── forgot-password-form.tsx
├── icons.tsx
├── main-nav.tsx
├── mobile-nav.tsx
├── nav-item.tsx
├── password-reset-email-template.tsx
├── reset-passsword-form.tsx
├── sign-out.tsx
├── signin-email-form.tsx
├── signin-email-password-form.tsx
├── signin-form.tsx
├── signin-google-form.tsx
├── subscribe-template.tsx
├── subscription-form.tsx
├── ui
│ ├── avatar.tsx
│ ├── button.tsx
│ ├── dropdown-menu.tsx
│ ├── input.tsx
│ ├── label.tsx
│ └── tabs.tsx
└── user-account-nav.tsx
├── config
└── navbar.ts
├── database.types.ts
├── hooks
└── use-current-session.ts
├── lib
├── assign-user-role.ts
├── authorize-credentials-error.ts
├── authorize-credentials.ts
├── aws.ts
├── check-credentials-email-verification-status.ts
├── check-subscriber-exists-error.ts
├── check-subscriber-exists.ts
├── check-user-exists-error.ts
├── check-user-exists.ts
├── create-password-reset-token-error.ts
├── create-password-reset-token.ts
├── create-user-error.ts
├── create-user.ts
├── custom-email-provider.ts
├── error-message.tsx
├── get-user-role.ts
├── handle-auth-jwt.ts
├── handle-auth-redirect.ts
├── handle-auth-session.ts
├── reset-passsord.ts
├── reset-password-error.ts
├── send-credentials-email-verification-email.ts
├── send-email-signin-link.ts
├── send-password-reset-email-error.ts
├── send-password-reset-email.ts
├── send-subscribe-email.ts
├── subscribe-actions.ts
├── supabase.ts
├── utils.ts
├── verify-credential-email-error.ts
├── verify-credential-email.ts
├── verify-password-reset-token-error.ts
└── verify-password-reset-token.ts
├── middleware.ts
├── next.config.ts
├── package-lock.json
├── package.json
├── postcss.config.js
├── postcss.config.mjs
├── public
├── file.svg
├── globe.svg
├── next.svg
├── vercel.svg
└── window.svg
├── supabase
├── .gitignore
└── config.toml
├── tailwind.config.ts
├── tsconfig.json
└── types
└── next-auth.d.ts
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["next/core-web-vitals", "next/typescript"],
3 | "rules": {
4 | "@typescript-eslint/no-unused-vars": "off"
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.*
7 | .yarn/*
8 | !.yarn/patches
9 | !.yarn/plugins
10 | !.yarn/releases
11 | !.yarn/versions
12 |
13 | # testing
14 | /coverage
15 |
16 | # next.js
17 | /.next/
18 | /out/
19 |
20 | # production
21 | /build
22 |
23 | # misc
24 | .DS_Store
25 | *.pem
26 |
27 | # debug
28 | npm-debug.log*
29 | yarn-debug.log*
30 | yarn-error.log*
31 |
32 | # env files (can opt-in for committing if needed)
33 | .env*
34 |
35 | # vercel
36 | .vercel
37 |
38 | # typescript
39 | *.tsbuildinfo
40 | next-env.d.ts
41 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | ## About
2 | An project that demonstrates how to implement
3 |
4 | - Sign in with Google
5 | - Sign in with Email
6 | - Sign in with Email and Password (including "Reset password" flow)
7 |
8 | in your Next.js (v15) app using Auth.js (v5).
9 |
10 | ## Course
11 | If you want to learn how Auth.js works in depth, check out [my course](https://www.hemantasundaray.com/courses/next-auth).
12 |
--------------------------------------------------------------------------------
/app/admin/page.tsx:
--------------------------------------------------------------------------------
1 | import { auth } from "@/auth";
2 |
3 | export default async function AdminPage() {
4 | const session = await auth();
5 |
6 | if (session?.user?.role === "user") {
7 | return (
8 |
9 |
Admin Access Only
10 |
11 | This page is only accessible to authenticated users having
12 | "admin" status.
13 |
14 |
20 | Welcome Admin
21 |
22 | );
23 | }
24 |
--------------------------------------------------------------------------------
/app/api/auth/[...nextauth]/route.ts:
--------------------------------------------------------------------------------
1 | import { handlers } from "@/auth";
2 |
3 | export const { GET, POST } = handlers;
4 |
--------------------------------------------------------------------------------
/app/api/auth/verify-password-reset-token/route.ts:
--------------------------------------------------------------------------------
1 | import { NextResponse, NextRequest } from "next/server";
2 | import { supabase } from "@/lib/supabase";
3 |
4 | type TokenVerificationStatus =
5 | | "token-invalid"
6 | | "token-expired"
7 | | "internal-error"
8 | | "token-valid";
9 |
10 | function getRedirectUrl(status: TokenVerificationStatus, token?: string) {
11 | if (status === "token-valid") {
12 | const path = `/reset-password?token=${token}`;
13 | console.log("Generated relative path:", path);
14 | return path;
15 | }
16 | const errorPath = `/reset-password/verify?error=${status}`;
17 | console.log("Generated error path:", errorPath);
18 | return errorPath;
19 | }
20 |
21 | export async function GET(request: NextRequest) {
22 | const searchParams = request.nextUrl.searchParams;
23 | const token = searchParams.get("token");
24 |
25 | try {
26 | const { data: tokenData, error: tokenError } = await supabase
27 | .schema("next_auth")
28 | .from("reset_tokens")
29 | .select("*")
30 | .eq("token", token!)
31 | .single();
32 |
33 | if (tokenError) {
34 | console.error("Error fetching password reset token:", tokenError);
35 | const redirectUrl = new URL(
36 | getRedirectUrl("token-invalid"),
37 | request.nextUrl.origin
38 | );
39 | return NextResponse.redirect(redirectUrl);
40 | }
41 |
42 | // Check token expiration
43 | if (new Date(tokenData.expires) < new Date()) {
44 | const redirectUrl = new URL(
45 | getRedirectUrl("token-expired"),
46 | request.nextUrl.origin
47 | );
48 | return NextResponse.redirect(redirectUrl);
49 | }
50 |
51 | // Valid token case - redirect to reset password page
52 | const redirectUrl = new URL(
53 | getRedirectUrl("token-valid", token!),
54 | request.nextUrl.origin
55 | );
56 | return NextResponse.redirect(redirectUrl);
57 | } catch (error) {
58 | console.error("Unexpected error during token verification:", error);
59 | const redirectUrl = new URL(
60 | getRedirectUrl("internal-error"),
61 | request.nextUrl.origin
62 | );
63 | return NextResponse.redirect(redirectUrl);
64 | }
65 | }
66 |
--------------------------------------------------------------------------------
/app/api/subscribe/route.ts:
--------------------------------------------------------------------------------
1 | import { NextResponse, NextRequest } from "next/server";
2 | import { supabase } from "@/lib/supabase";
3 |
4 | export async function GET(request: NextRequest) {
5 | const searchParams = request.nextUrl.searchParams;
6 | const email = searchParams.get("email")!;
7 |
8 | console.log("Subscriber email: ", email);
9 |
10 | try {
11 | // First, check if a user with this email already exists
12 | const { data: existingUser, error: lookupError } = await supabase
13 | .schema("next_auth")
14 | .from("subscribers")
15 | .select("*")
16 | .eq("email", email)
17 | .single();
18 |
19 | // If user exists, redirect to status page
20 | if (existingUser) {
21 | return NextResponse.redirect(
22 | new URL("/course/subscribe/status", request.nextUrl.origin)
23 | );
24 | }
25 |
26 | // Create user
27 | const { error: userError } = await supabase
28 | .schema("next_auth")
29 | .from("subscribers")
30 | .insert({
31 | email,
32 | })
33 | .select("*")
34 | .single();
35 |
36 | if (userError) {
37 | console.error("Error inserting new user:", userError);
38 | throw new Error("Failed to create user");
39 | }
40 |
41 | return NextResponse.redirect(
42 | new URL("/course/subscribe/success", request.nextUrl.origin)
43 | );
44 | } catch (error) {
45 | return NextResponse.redirect(
46 | new URL("/course/subscribe/error", request.nextUrl.origin)
47 | );
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/app/auth-error/page.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 | import { Icons } from "@/components/icons";
3 |
4 | export default async function AuthErrorPage({
5 | searchParams,
6 | }: {
7 | searchParams: Promise<{ error?: string }>;
8 | }) {
9 | const params = await searchParams;
10 |
11 | function getErrorMessage(error: string | undefined) {
12 | switch (error) {
13 | case "Verification":
14 | return "The sign in link has expired. Please request a new one.";
15 | case "Default":
16 | default:
17 | return "An error occurred during authentication. Please try again.";
18 | }
19 | }
20 | const errorMessage = getErrorMessage(params.error);
21 |
22 | return (
23 |
27 |
Authentication Error
28 |
{errorMessage}
29 |
33 |
34 | Sign in
35 |
36 |
12 |
13 |
Loading...
14 |
21 |
User Not Authenticated
22 |
User email: Not available
23 |
User role: Not available
24 |
25 | This is a Client Component.
26 |
27 |
33 |
User Authenticated
34 |
User email: {session?.user.email}
35 |
User role: {session?.user.role}
36 |
37 | This is a Client Component.
38 |
39 |
7 |
Check Inbox
8 |
9 | I've sent a subscription email. Click the link in the email to
10 | subscribe.
11 |
12 |
13 | Didn't receive the email? Check your spam or junk folder.
14 |
15 |
19 |
20 | Home
21 |
22 |
7 |
Something Went Wrong
8 |
Please subscribe again.
9 |
13 |
14 | Home
15 |
16 |
7 |
Already Subscribed
8 |
You are already subscribed.
9 |
13 |
14 | Home
15 |
16 |
7 |
Subscribed
8 |
You're all set!
9 |
10 | I'll send you an email when the course is launched.
11 |
12 |
16 |
17 | Home
18 |
19 |
7 |
Check Inbox
8 |
9 | We've sent a password reset email.
10 |
11 |
12 | Didn't receive the email? Check your spam or junk folder.
13 |
14 |
18 |
19 | Forgot password
20 |
21 |
{children}
25 |
26 |
27 | );
28 | }
29 |
--------------------------------------------------------------------------------
/app/page.tsx:
--------------------------------------------------------------------------------
1 | import { SubscriptionForm } from "@/components/subscription-form";
2 |
3 | export default async function Home() {
4 | return (
5 |
6 |
7 | Next.js(v15) + Auth.js(v5) Course
8 |
9 |
10 | Implementing authentication and authorization in a Next.js app using
11 | Auth.js is no easy task. You might spend weeks and even then there is no
12 | guarantee of success. You're most likely to get stuck trying to
13 | figure out an obscure error, but never really manage to fix it, leaving
14 | all the hard work in vain.
15 |
16 |
17 | Like many developers, I spent weeks, but managed to solve all
18 | authetication challenges after much trial and error. Now I'm
19 | building a course to share these hard-earned lessons, so you can
20 | implement authentication and authorization in just a few hours.
21 |
22 |
23 | In the course, you'll learn how to implement:
24 |
25 |
26 | Sign in with Google
27 | Sign in with email
28 | Sign in with email and password
29 |
30 |
31 | I am planning to finish the course in the next two weeks. It will be a
32 | text based course and will be released in my{" "}
33 |
39 | personal website
40 |
41 | .
42 |
43 |
44 | If you want to get notified as soon as the course is released, subscribe
45 | below:
46 |
47 |
48 |
8 |
User Authenticated
9 |
User email: {session?.user.email}
10 |
User role: {session?.user.role}
11 |
12 | This is a private page, only accessible to authenticated users.
13 |
14 |
7 |
9 | );
10 | }
11 |
--------------------------------------------------------------------------------
/app/reset-password/success/page.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 | import { Icons } from "@/components/icons";
3 |
4 | export default function ResetPasswordSuccessPage() {
5 | return (
6 |
7 |
Password Reset
8 |
9 | Your password has been reset successfully.
10 |
11 |
15 |
16 | Sign in
17 |
18 |
= {
20 | "token-invalid": {
21 | title: "Invalid Token",
22 | message: "Please request a new one.",
23 | },
24 | "token-expired": {
25 | title: "Invalid Token",
26 | message: "Please request a new one.",
27 | },
28 | "internal-error": {
29 | title: "Something Went Wrong",
30 | message: "Please try again.",
31 | },
32 | };
33 |
34 | function isValidErrorType(error: string): error is TokenVerificationStatus {
35 | return error in statusContent;
36 | }
37 |
38 | function ErrorMessage({ error }: { error: string }) {
39 | const content = isValidErrorType(error)
40 | ? statusContent[error]
41 | : defaultErrorContent;
42 |
43 | return (
44 |
45 |
{content.title}
46 |
{content.message}
47 |
51 |
52 | Sign In
53 |
54 |
71 |
Email Verified
72 |
9 |
User Not Authenticated
10 |
User email: Not available
11 |
User role: Not available
12 |
13 | This is a Server Component.
14 |
15 |
20 |
User Authenticated
21 |
User email: {session.user.email}
22 |
User role: {session.user.role}
23 |
24 | This is a Server Component.
25 |
26 |
7 |
Check Inbox
8 |
9 | I've sent a sign in link to your email address.
10 |
11 |
12 | Didn't receive the email? Check your spam or junk folder.
13 |
14 |
18 |
19 | Sign In
20 |
21 |
7 |
9 | );
10 | }
11 |
--------------------------------------------------------------------------------
/app/signin/verify-email/page.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 | import { Icons } from "@/components/icons";
3 |
4 | export default function VerifyEmailPage() {
5 | return (
6 |
7 |
Verify Your Email
8 |
9 | We've sent a verification link to your email.
10 |
11 |
12 | Didn't receive the email? Check your spam or junk folder.
13 |
14 |
18 |
19 | Sign In
20 |
21 |
40 |
41 | Email Verification Successful
42 |
43 |
44 | Your email has been successfully verified.
45 |
46 |
50 |
51 | Sign In
52 |
53 |
11 | Hey,
12 |
13 | Click the link below to sign in to your account:
14 |
15 |
19 | Sign In
20 |
21 |
22 | Note that the link will expire in 1 hour.
23 |
24 |
25 | If you did not try to log in to your account, you can safely ignore
26 | this email.
27 |
28 |
29 |
30 | );
31 | }
32 |
--------------------------------------------------------------------------------
/components/email-verification-template.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react";
2 | import { Button } from "@react-email/button";
3 | import { Html } from "@react-email/html";
4 | import { Tailwind } from "@react-email/tailwind";
5 | import { Text } from "@react-email/text";
6 |
7 | export function EmailVerificationTemplate({
8 | verificationUrl,
9 | }: {
10 | verificationUrl: string;
11 | }) {
12 | return (
13 |
14 |
15 | Hey,
16 |
17 | Click the link below to verify your account:
18 |
19 |
23 | Verify Email
24 |
25 |
26 | Note that the link will expire in 1 hour.
27 |
28 |
29 |
30 | If you did not try to log in to your account, you can safely ignore
31 | this email.
32 |
33 |
34 |
35 | );
36 | }
37 |
--------------------------------------------------------------------------------
/components/forgot-password-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { Label } from "@/components/ui/label";
4 | import { Input } from "@/components/ui/input";
5 | import { Button } from "@/components/ui/button";
6 | import { useForm } from "@conform-to/react";
7 | import { parseWithZod } from "@conform-to/zod";
8 | import { useActionState } from "react";
9 | import { requestPasswordReset } from "@/app/password-reset-actions";
10 | import { forgotPasswordSchema } from "@/app/schema";
11 |
12 | export function ForgotPasswordForm() {
13 | const [lastResult, action, isPending] = useActionState(
14 | requestPasswordReset,
15 | undefined
16 | );
17 |
18 | const [form, fields] = useForm({
19 | lastResult,
20 | onValidate({ formData }) {
21 | return parseWithZod(formData, { schema: forgotPasswordSchema });
22 | },
23 | });
24 |
25 | return (
26 |
27 |
28 | Forgot Password?
29 |
30 |
62 |
25 |
42 | ),
43 | };
44 |
--------------------------------------------------------------------------------
/components/main-nav.tsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import Link from "next/link";
3 |
4 | import { NavItem } from "@/components/nav-item";
5 | import { MobileNav } from "@/components/mobile-nav";
6 | import { UserAccountNav } from "@/components/user-account-nav";
7 |
8 | type NavItemType = {
9 | title: string;
10 | href: string;
11 | };
12 |
13 | type MainNavProps = {
14 | items: NavItemType[]; // Array of navigation items
15 | };
16 |
17 | export function MainNav({ items }: MainNavProps) {
18 | return (
19 |
20 |
21 |
26 | {items?.length ? (
27 |
28 |
29 | {items.map((item) => (
30 |
31 |
33 | ))}
34 |
35 |
36 | ) : null}
37 |
38 |
) {
40 | if (!(event.target instanceof HTMLElement)) {
41 | return;
42 | }
43 |
44 | const link = event.target.closest("a");
45 | if (
46 | link &&
47 | link.pathname + link.search + link.hash ===
48 | window.location.pathname + window.location.search + window.location.hash
49 | ) {
50 | close();
51 | }
52 | }
53 |
54 | const containerVariants = {
55 | hidden: { opacity: 0 },
56 | visible: {
57 | opacity: 1,
58 | transition: {
59 | staggerChildren: 0.1,
60 | delayChildren: 0.2,
61 | },
62 | },
63 | };
64 |
65 | const itemVariants = {
66 | hidden: { x: -20, opacity: 0 },
67 | visible: {
68 | x: 0,
69 | opacity: 1,
70 | },
71 | };
72 |
73 | return (
74 |
80 |
85 |
86 |
90 |
91 |
97 | {navbarLinks.main.map((item) => (
98 |
99 |
109 | ))}
110 |
111 |
112 |
113 |
114 |
115 |
116 | );
117 | }
118 |
119 | export function useIsInsideMobileNavigation() {
120 | return useContext(IsInsideMobileNavigationContext);
121 | }
122 |
123 | export const useMobileNavigationStore = create<{
124 | isOpen: boolean;
125 | open: () => void;
126 | close: () => void;
127 | toggle: () => void;
128 | }>()((set) => ({
129 | isOpen: false,
130 | open: () => set({ isOpen: true }),
131 | close: () => set({ isOpen: false }),
132 | toggle: () => set((state) => ({ isOpen: !state.isOpen })),
133 | }));
134 |
135 | export function MobileNav() {
136 | const isInsideMobileNavigation = useIsInsideMobileNavigation();
137 | const { isOpen, toggle, close } = useMobileNavigationStore();
138 |
139 | const pathname = usePathname();
140 |
141 | useEffect(() => {
142 | close();
143 | }, [pathname, close]);
144 |
145 | const barVariants = {
146 | closed: (custom: number) => ({
147 | y: custom * 8,
148 | rotate: 0,
149 | opacity: 1,
150 | transition: {
151 | y: { delay: 0.2, duration: 0.2 },
152 | rotate: { duration: 0.2 },
153 | opacity: { delay: 0.2, duration: 0.1 },
154 | },
155 | }),
156 | open: (custom: number) => ({
157 | y: 0,
158 | rotate: custom * 45,
159 | opacity: custom === 0 ? 0 : 1,
160 | transition: {
161 | y: { type: "spring", stiffness: 300, damping: 15, duration: 0.2 },
162 | rotate: { delay: 0.2, duration: 0.2 },
163 | opacity: { delay: 0.1, duration: 0.2 },
164 | },
165 | }),
166 | };
167 |
168 | return (
169 |
170 |
179 | {isOpen ? "Close menu" : "Open menu"}
180 |
186 | {[-1, 0, 1].map((index) => (
187 |
201 |
202 | {!isInsideMobileNavigation && (
203 |
204 |
206 | )}
207 |
208 | );
209 | }
210 |
--------------------------------------------------------------------------------
/components/nav-item.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import Link from "next/link";
4 | import { usePathname } from "next/navigation";
5 |
6 | import { cn } from "@/lib/utils";
7 |
8 | type NavItemProps = {
9 | href: string;
10 | title: string;
11 | };
12 |
13 | export function NavItem({ href, title }: NavItemProps) {
14 | const pathname = usePathname();
15 | const isActive = href === pathname;
16 |
17 | return (
18 |
11 | Hello,
12 |
13 | We received a request to reset your password. Click the link below to
14 | create a new password.
15 |
16 |
20 | Reset Password
21 |
22 |
23 | Note that the link will epire in 1 hour.
24 |
25 |
26 | If you didn't request a password reset, you can safely ignore
27 | this email. This link will expire in 24 hours.
28 |
29 |
30 |
31 | );
32 | }
33 |
--------------------------------------------------------------------------------
/components/reset-passsword-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { Label } from "@/components/ui/label";
4 | import { Input } from "@/components/ui/input";
5 | import { Button } from "@/components/ui/button";
6 | import { useForm } from "@conform-to/react";
7 | import { useSearchParams } from "next/navigation";
8 | import { parseWithZod } from "@conform-to/zod";
9 | import { useActionState } from "react";
10 | import { resetUserPassword } from "@/app/password-reset-actions";
11 | import { resetPasswordSchema } from "@/app/schema";
12 |
13 | export function ResetPasswordForm() {
14 | const searchParams = useSearchParams();
15 | const token = searchParams.get("token");
16 |
17 | // Bind the token to the action
18 | const boundResetPassword = resetUserPassword.bind(null, token!);
19 | const [lastResult, action, isPending] = useActionState(
20 | boundResetPassword,
21 | undefined
22 | );
23 |
24 | const [form, fields] = useForm({
25 | lastResult,
26 | onValidate({ formData }) {
27 | return parseWithZod(formData, { schema: resetPasswordSchema });
28 | },
29 | });
30 |
31 | return (
32 |
33 |
Reset Password
34 |
75 |
30 | {isLoading ? (
31 | <>
32 |
42 | );
43 | }
44 |
--------------------------------------------------------------------------------
/components/signin-email-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useActionState } from "react";
4 | import { useForm } from "@conform-to/react";
5 | import { parseWithZod } from "@conform-to/zod";
6 | import { Icons } from "@/components/icons";
7 | import { Button } from "@/components/ui/button";
8 | import { Input } from "@/components/ui/input";
9 | import { Label } from "@/components/ui/label";
10 | import { signInWithEmail } from "@/app/signin-actions";
11 | import { signInWithEmailSchema } from "@/app/schema";
12 |
13 | export function SignInEmailForm() {
14 | const [lastResult, formAction, isPending] = useActionState(
15 | signInWithEmail,
16 | undefined
17 | );
18 |
19 | const [form, fields] = useForm({
20 | lastResult,
21 | onValidate({ formData }) {
22 | return parseWithZod(formData, { schema: signInWithEmailSchema });
23 | },
24 | });
25 |
26 | return (
27 |
63 | );
64 | }
65 |
--------------------------------------------------------------------------------
/components/signin-email-password-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import Link from "next/link";
4 | import { Button } from "@/components/ui/button";
5 | import { Input } from "@/components/ui/input";
6 | import { Label } from "@/components/ui/label";
7 | import { Icons } from "@/components/icons";
8 | import { useForm } from "@conform-to/react";
9 | import { parseWithZod } from "@conform-to/zod";
10 | import { useState } from "react";
11 | import { useActionState } from "react";
12 | import { signInWithEmailAndPassword } from "@/app/signin-actions";
13 | import { signInWithEmailAndPasswordSchema } from "@/app/schema";
14 |
15 | export function SignInEmailPasswordForm({ from }: { from: string }) {
16 | const boundSignInWithEmailAndPassword = signInWithEmailAndPassword.bind(
17 | null,
18 | from
19 | );
20 |
21 | const [lastResult, formAction, isPending] = useActionState(
22 | boundSignInWithEmailAndPassword,
23 | undefined
24 | );
25 |
26 | const [form, fields] = useForm({
27 | lastResult,
28 | onValidate({ formData }) {
29 | return parseWithZod(formData, {
30 | schema: signInWithEmailAndPasswordSchema,
31 | });
32 | },
33 | });
34 |
35 | const [isPasswordVisible, setIsPasswordVisible] = useState(false);
36 |
37 | function togglePasswordVisibility() {
38 | setIsPasswordVisible((prevState) => !prevState);
39 | }
40 |
41 | return (
42 |
111 | );
112 | }
113 |
--------------------------------------------------------------------------------
/components/signin-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useSearchParams } from "next/navigation";
4 | import { SignInGoogleForm } from "@/components/signin-google-form";
5 | import { SignInEmailForm } from "@/components/signin-email-form";
6 | import { SignInEmailPasswordForm } from "@/components/signin-email-password-form";
7 | import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
8 |
9 | export function SigninForm() {
10 | const searchParams = useSearchParams();
11 | const from = searchParams.get("from") || "/";
12 |
13 | return (
14 |
15 |
16 | Sign in to your account
17 |
18 |
19 |
20 |
21 |
22 |
24 |
25 | Or continue with
26 |
27 |
28 |
29 |
30 | Email Link
31 | Password
32 |
33 |
34 |
36 |
37 |
39 |
40 |
41 |
11 | Hey,
12 |
13 | Click the link below to subscribe:
14 |
15 |
19 | Subscribe
20 |
21 |
22 | If you did not try to subscribe, you can safely ignore this email.
23 |
24 |
25 |
26 | );
27 | }
28 |
--------------------------------------------------------------------------------
/components/subscription-form.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useActionState } from "react";
4 | import { useForm } from "@conform-to/react";
5 | import { parseWithZod } from "@conform-to/zod";
6 | import { Icons } from "@/components/icons";
7 | import { Button } from "@/components/ui/button";
8 | import { Input } from "@/components/ui/input";
9 | import { Label } from "@/components/ui/label";
10 | import { subscribe } from "@/lib/subscribe-actions";
11 | import { subscribeSchema } from "@/app/schema";
12 |
13 | export function SubscriptionForm() {
14 | const [lastResult, formAction, isPending] = useActionState(
15 | subscribe,
16 | undefined
17 | );
18 |
19 | const [form, fields] = useForm({
20 | lastResult,
21 | onValidate({ formData }) {
22 | return parseWithZod(formData, { schema: subscribeSchema });
23 | },
24 | });
25 |
26 | return (
27 |
28 |
Subscribe
29 |
30 | Be first to know when the course launches.
31 |
32 |
72 |
,
10 | React.ComponentPropsWithoutRef
11 | >(({ className, ...props }, ref) => (
12 | ,
25 | React.ComponentPropsWithoutRef
26 | >(({ className, ...props }, ref) => (
27 | ,
37 | React.ComponentPropsWithoutRef
38 | >(({ className, ...props }, ref) => (
39 | ,
38 | VariantProps {
39 | asChild?: boolean
40 | }
41 |
42 | const Button = React.forwardRef(
43 | ({ className, variant, size, asChild = false, ...props }, ref) => {
44 | const Comp = asChild ? Slot : "button"
45 | return (
46 | ,
23 | React.ComponentPropsWithoutRef & {
24 | inset?: boolean
25 | }
26 | >(({ className, inset, children, ...props }, ref) => (
27 |
36 | {children}
37 |
39 | ))
40 | DropdownMenuSubTrigger.displayName =
41 | DropdownMenuPrimitive.SubTrigger.displayName
42 |
43 | const DropdownMenuSubContent = React.forwardRef<
44 | React.ElementRef,
45 | React.ComponentPropsWithoutRef
46 | >(({ className, ...props }, ref) => (
47 | ,
61 | React.ComponentPropsWithoutRef
62 | >(({ className, sideOffset = 4, ...props }, ref) => (
63 |
64 |
74 | ))
75 | DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
76 |
77 | const DropdownMenuItem = React.forwardRef<
78 | React.ElementRef,
79 | React.ComponentPropsWithoutRef & {
80 | inset?: boolean
81 | }
82 | >(({ className, inset, ...props }, ref) => (
83 | ,
97 | React.ComponentPropsWithoutRef
98 | >(({ className, children, checked, ...props }, ref) => (
99 |
108 |
109 |
110 |
112 |
113 | {children}
114 |
115 | ))
116 | DropdownMenuCheckboxItem.displayName =
117 | DropdownMenuPrimitive.CheckboxItem.displayName
118 |
119 | const DropdownMenuRadioItem = React.forwardRef<
120 | React.ElementRef,
121 | React.ComponentPropsWithoutRef
122 | >(({ className, children, ...props }, ref) => (
123 |
131 |
132 |
133 |
135 |
136 | {children}
137 |
138 | ))
139 | DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
140 |
141 | const DropdownMenuLabel = React.forwardRef<
142 | React.ElementRef,
143 | React.ComponentPropsWithoutRef & {
144 | inset?: boolean
145 | }
146 | >(({ className, inset, ...props }, ref) => (
147 | ,
161 | React.ComponentPropsWithoutRef
162 | >(({ className, ...props }, ref) => (
163 | ) => {
175 | return (
176 | >(
6 | ({ className, type, ...props }, ref) => {
7 | return (
8 | ,
15 | React.ComponentPropsWithoutRef &
16 | VariantProps
17 | >(({ className, ...props }, ref) => (
18 | ,
12 | React.ComponentPropsWithoutRef
13 | >(({ className, ...props }, ref) => (
14 | ,
27 | React.ComponentPropsWithoutRef
28 | >(({ className, ...props }, ref) => (
29 | ,
42 | React.ComponentPropsWithoutRef
43 | >(({ className, ...props }, ref) => (
44 |
31 |
32 |
33 |
35 | {session?.user.email!.slice(0, 2).toUpperCase()}
36 |
37 |
38 |
39 |
40 |
41 |
43 |
44 |
45 | );
46 | }
47 |
--------------------------------------------------------------------------------
/config/navbar.ts:
--------------------------------------------------------------------------------
1 | export const navbarLinks = {
2 | main: [
3 | { title: "Home", href: "/" },
4 | { title: "Client", href: "/client" },
5 | { title: "Server", href: "/server" },
6 | { title: "Private", href: "/private" },
7 | { title: "Admin", href: "/admin" },
8 | ],
9 | };
10 |
--------------------------------------------------------------------------------
/database.types.ts:
--------------------------------------------------------------------------------
1 | export type Json =
2 | | string
3 | | number
4 | | boolean
5 | | null
6 | | { [key: string]: Json | undefined }
7 | | Json[]
8 |
9 | export type Database = {
10 | next_auth: {
11 | Tables: {
12 | accounts: {
13 | Row: {
14 | access_token: string | null
15 | expires_at: number | null
16 | id: string
17 | id_token: string | null
18 | oauth_token: string | null
19 | oauth_token_secret: string | null
20 | provider: string
21 | providerAccountId: string
22 | refresh_token: string | null
23 | scope: string | null
24 | session_state: string | null
25 | token_type: string | null
26 | type: string
27 | userId: string | null
28 | }
29 | Insert: {
30 | access_token?: string | null
31 | expires_at?: number | null
32 | id?: string
33 | id_token?: string | null
34 | oauth_token?: string | null
35 | oauth_token_secret?: string | null
36 | provider: string
37 | providerAccountId: string
38 | refresh_token?: string | null
39 | scope?: string | null
40 | session_state?: string | null
41 | token_type?: string | null
42 | type: string
43 | userId?: string | null
44 | }
45 | Update: {
46 | access_token?: string | null
47 | expires_at?: number | null
48 | id?: string
49 | id_token?: string | null
50 | oauth_token?: string | null
51 | oauth_token_secret?: string | null
52 | provider?: string
53 | providerAccountId?: string
54 | refresh_token?: string | null
55 | scope?: string | null
56 | session_state?: string | null
57 | token_type?: string | null
58 | type?: string
59 | userId?: string | null
60 | }
61 | Relationships: [
62 | {
63 | foreignKeyName: "accounts_userId_fkey"
64 | columns: ["userId"]
65 | isOneToOne: false
66 | referencedRelation: "users"
67 | referencedColumns: ["id"]
68 | },
69 | ]
70 | }
71 | reset_tokens: {
72 | Row: {
73 | expires: string
74 | identifier: string | null
75 | token: string
76 | }
77 | Insert: {
78 | expires: string
79 | identifier?: string | null
80 | token: string
81 | }
82 | Update: {
83 | expires?: string
84 | identifier?: string | null
85 | token?: string
86 | }
87 | Relationships: []
88 | }
89 | sessions: {
90 | Row: {
91 | expires: string
92 | id: string
93 | sessionToken: string
94 | userId: string | null
95 | }
96 | Insert: {
97 | expires: string
98 | id?: string
99 | sessionToken: string
100 | userId?: string | null
101 | }
102 | Update: {
103 | expires?: string
104 | id?: string
105 | sessionToken?: string
106 | userId?: string | null
107 | }
108 | Relationships: [
109 | {
110 | foreignKeyName: "sessions_userId_fkey"
111 | columns: ["userId"]
112 | isOneToOne: false
113 | referencedRelation: "users"
114 | referencedColumns: ["id"]
115 | },
116 | ]
117 | }
118 | subscribers: {
119 | Row: {
120 | created_at: string
121 | email: string
122 | id: string
123 | }
124 | Insert: {
125 | created_at?: string
126 | email: string
127 | id?: string
128 | }
129 | Update: {
130 | created_at?: string
131 | email?: string
132 | id?: string
133 | }
134 | Relationships: []
135 | }
136 | users: {
137 | Row: {
138 | credentials_email_verified: boolean | null
139 | email: string | null
140 | emailVerified: string | null
141 | id: string
142 | image: string | null
143 | name: string | null
144 | password: string | null
145 | role: string
146 | }
147 | Insert: {
148 | credentials_email_verified?: boolean | null
149 | email?: string | null
150 | emailVerified?: string | null
151 | id?: string
152 | image?: string | null
153 | name?: string | null
154 | password?: string | null
155 | role?: string
156 | }
157 | Update: {
158 | credentials_email_verified?: boolean | null
159 | email?: string | null
160 | emailVerified?: string | null
161 | id?: string
162 | image?: string | null
163 | name?: string | null
164 | password?: string | null
165 | role?: string
166 | }
167 | Relationships: []
168 | }
169 | verification_tokens: {
170 | Row: {
171 | expires: string
172 | identifier: string | null
173 | token: string
174 | }
175 | Insert: {
176 | expires: string
177 | identifier?: string | null
178 | token: string
179 | }
180 | Update: {
181 | expires?: string
182 | identifier?: string | null
183 | token?: string
184 | }
185 | Relationships: []
186 | }
187 | }
188 | Views: {
189 | [_ in never]: never
190 | }
191 | Functions: {
192 | uid: {
193 | Args: Record
194 | Returns: string
195 | }
196 | }
197 | Enums: {
198 | [_ in never]: never
199 | }
200 | CompositeTypes: {
201 | [_ in never]: never
202 | }
203 | }
204 | }
205 |
206 | type PublicSchema = Database[Extract]
207 |
208 | export type Tables<
209 | PublicTableNameOrOptions extends
210 | | keyof (PublicSchema["Tables"] & PublicSchema["Views"])
211 | | { schema: keyof Database },
212 | TableName extends PublicTableNameOrOptions extends { schema: keyof Database }
213 | ? keyof (Database[PublicTableNameOrOptions["schema"]]["Tables"] &
214 | Database[PublicTableNameOrOptions["schema"]]["Views"])
215 | : never = never,
216 | > = PublicTableNameOrOptions extends { schema: keyof Database }
217 | ? (Database[PublicTableNameOrOptions["schema"]]["Tables"] &
218 | Database[PublicTableNameOrOptions["schema"]]["Views"])[TableName] extends {
219 | Row: infer R
220 | }
221 | ? R
222 | : never
223 | : PublicTableNameOrOptions extends keyof (PublicSchema["Tables"] &
224 | PublicSchema["Views"])
225 | ? (PublicSchema["Tables"] &
226 | PublicSchema["Views"])[PublicTableNameOrOptions] extends {
227 | Row: infer R
228 | }
229 | ? R
230 | : never
231 | : never
232 |
233 | export type TablesInsert<
234 | PublicTableNameOrOptions extends
235 | | keyof PublicSchema["Tables"]
236 | | { schema: keyof Database },
237 | TableName extends PublicTableNameOrOptions extends { schema: keyof Database }
238 | ? keyof Database[PublicTableNameOrOptions["schema"]]["Tables"]
239 | : never = never,
240 | > = PublicTableNameOrOptions extends { schema: keyof Database }
241 | ? Database[PublicTableNameOrOptions["schema"]]["Tables"][TableName] extends {
242 | Insert: infer I
243 | }
244 | ? I
245 | : never
246 | : PublicTableNameOrOptions extends keyof PublicSchema["Tables"]
247 | ? PublicSchema["Tables"][PublicTableNameOrOptions] extends {
248 | Insert: infer I
249 | }
250 | ? I
251 | : never
252 | : never
253 |
254 | export type TablesUpdate<
255 | PublicTableNameOrOptions extends
256 | | keyof PublicSchema["Tables"]
257 | | { schema: keyof Database },
258 | TableName extends PublicTableNameOrOptions extends { schema: keyof Database }
259 | ? keyof Database[PublicTableNameOrOptions["schema"]]["Tables"]
260 | : never = never,
261 | > = PublicTableNameOrOptions extends { schema: keyof Database }
262 | ? Database[PublicTableNameOrOptions["schema"]]["Tables"][TableName] extends {
263 | Update: infer U
264 | }
265 | ? U
266 | : never
267 | : PublicTableNameOrOptions extends keyof PublicSchema["Tables"]
268 | ? PublicSchema["Tables"][PublicTableNameOrOptions] extends {
269 | Update: infer U
270 | }
271 | ? U
272 | : never
273 | : never
274 |
275 | export type Enums<
276 | PublicEnumNameOrOptions extends
277 | | keyof PublicSchema["Enums"]
278 | | { schema: keyof Database },
279 | EnumName extends PublicEnumNameOrOptions extends { schema: keyof Database }
280 | ? keyof Database[PublicEnumNameOrOptions["schema"]]["Enums"]
281 | : never = never,
282 | > = PublicEnumNameOrOptions extends { schema: keyof Database }
283 | ? Database[PublicEnumNameOrOptions["schema"]]["Enums"][EnumName]
284 | : PublicEnumNameOrOptions extends keyof PublicSchema["Enums"]
285 | ? PublicSchema["Enums"][PublicEnumNameOrOptions]
286 | : never
287 |
288 | export type CompositeTypes<
289 | PublicCompositeTypeNameOrOptions extends
290 | | keyof PublicSchema["CompositeTypes"]
291 | | { schema: keyof Database },
292 | CompositeTypeName extends PublicCompositeTypeNameOrOptions extends {
293 | schema: keyof Database
294 | }
295 | ? keyof Database[PublicCompositeTypeNameOrOptions["schema"]]["CompositeTypes"]
296 | : never = never,
297 | > = PublicCompositeTypeNameOrOptions extends { schema: keyof Database }
298 | ? Database[PublicCompositeTypeNameOrOptions["schema"]]["CompositeTypes"][CompositeTypeName]
299 | : PublicCompositeTypeNameOrOptions extends keyof PublicSchema["CompositeTypes"]
300 | ? PublicSchema["CompositeTypes"][PublicCompositeTypeNameOrOptions]
301 | : never
302 |
--------------------------------------------------------------------------------
/hooks/use-current-session.ts:
--------------------------------------------------------------------------------
1 | import { Session } from "next-auth";
2 | import { getSession } from "next-auth/react";
3 | import { useState, useEffect } from "react";
4 |
5 | type AuthStatus = "loading" | "authenticated" | "unauthenticated";
6 |
7 | export function useCurrentSession() {
8 | const [session, setSession] = useState(null);
9 | const [status, setStatus] = useState("loading");
10 |
11 | useEffect(() => {
12 | async function retrieveSession() {
13 | try {
14 | const sessionData = await getSession();
15 | if (sessionData) {
16 | setSession(sessionData);
17 | setStatus("authenticated");
18 | return;
19 | }
20 | setStatus("unauthenticated");
21 | } catch (error) {
22 | setSession(null);
23 | setStatus("unauthenticated");
24 | }
25 | }
26 |
27 | retrieveSession();
28 | }, []);
29 |
30 | return { session, status };
31 | }
32 |
--------------------------------------------------------------------------------
/lib/assign-user-role.ts:
--------------------------------------------------------------------------------
1 | import { supabase } from "@/lib/supabase";
2 | import { User } from "next-auth";
3 |
4 | export async function assignUserRole({ user }: { user: User }) {
5 | const ADMIN_EMAILS = ["rawgrittt@gmail.com"];
6 |
7 | // Determine if this email should have admin privileges
8 | const role = ADMIN_EMAILS.includes(user.email!) ? "admin" : "user";
9 |
10 | try {
11 | const { error } = await supabase
12 | .schema("next_auth")
13 | .from("users")
14 | .update({ role: role })
15 | .eq("email", user.email!);
16 |
17 | if (error) {
18 | console.error("Error updating user role:", error);
19 | throw error;
20 | }
21 | } catch (error) {
22 | console.log("Failed to assign role to new user:", error);
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/lib/authorize-credentials-error.ts:
--------------------------------------------------------------------------------
1 | export class AuthorizeCredentialsError extends Error {
2 | public static readonly errorMessages = {
3 | EMAIL_SENT: "Verification email sent.",
4 | INVALID_CREDENTIALS: "Invalid email or password.",
5 | INTERNAL_ERROR: "Something went wrong.",
6 | } as const;
7 |
8 | public readonly code: keyof typeof AuthorizeCredentialsError.errorMessages;
9 |
10 | constructor(code: keyof typeof AuthorizeCredentialsError.errorMessages) {
11 | const message = AuthorizeCredentialsError.errorMessages[code];
12 | super(message);
13 |
14 | this.code = code;
15 | this.name = "AuthorizeCredentialsError";
16 | }
17 |
18 | public static getErrorMessage(
19 | code: keyof typeof AuthorizeCredentialsError.errorMessages
20 | ) {
21 | return this.errorMessages[code];
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/lib/authorize-credentials.ts:
--------------------------------------------------------------------------------
1 | import bcrypt from "bcrypt";
2 | import { checkUserExists } from "@/lib/check-user-exists";
3 | import { createUser } from "@/lib/create-user";
4 | import { sendCredentialEmailVerificationEmail } from "@/lib/send-credentials-email-verification-email";
5 | import { checkCredentialsEmailVerificationStatus } from "@/lib/check-credentials-email-verification-status";
6 | import { AuthorizeCredentialsError } from "@/lib/authorize-credentials-error";
7 | import { User } from "next-auth";
8 |
9 | export async function authorizeCredentials(
10 | credentials: Partial>
11 | ): Promise {
12 | const email = credentials.email as string;
13 | const password = credentials.password as string;
14 |
15 | // Try to find an existing user
16 | const user = await checkUserExists(email);
17 |
18 | const verificationToken = crypto.randomUUID();
19 |
20 | // Handle new user signup flow
21 | if (!user) {
22 | const [userCreationStatus, emailSendingStatus] = await Promise.all([
23 | createUser(email, password, verificationToken),
24 | sendCredentialEmailVerificationEmail(email, verificationToken),
25 | ]);
26 |
27 | if (userCreationStatus.success && emailSendingStatus.success) {
28 | throw new AuthorizeCredentialsError("EMAIL_SENT");
29 | }
30 | }
31 |
32 | // Verify password
33 | const passwordsMatch = await bcrypt.compare(password, user!.password!);
34 |
35 | if (!passwordsMatch) {
36 | throw new AuthorizeCredentialsError("INVALID_CREDENTIALS");
37 | }
38 |
39 | // Check email verification
40 | const verificationStatus =
41 | await checkCredentialsEmailVerificationStatus(email);
42 |
43 | if (!verificationStatus.verified) {
44 | await sendCredentialEmailVerificationEmail(email, verificationToken);
45 | throw new AuthorizeCredentialsError("EMAIL_SENT");
46 | }
47 |
48 | return {
49 | email: user?.email,
50 | role: user?.role,
51 | } as User;
52 | }
53 |
--------------------------------------------------------------------------------
/lib/aws.ts:
--------------------------------------------------------------------------------
1 | import { SESClient } from "@aws-sdk/client-ses";
2 |
3 | const sesClient = new SESClient({
4 | region: process.env.AWS_REGION!,
5 | credentials: {
6 | accessKeyId: process.env.AWS_ACCESS_KEY_ID!,
7 | secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY!,
8 | },
9 | });
10 |
11 | export { sesClient };
12 |
--------------------------------------------------------------------------------
/lib/check-credentials-email-verification-status.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 |
4 | export async function checkCredentialsEmailVerificationStatus(email: string) {
5 | // First, get the user's verification status from the users table
6 | const { data: user, error: userError } = await supabase
7 | .schema("next_auth")
8 | .from("users")
9 | .select("credentials_email_verified")
10 | .eq("email", email)
11 | .single();
12 |
13 | if (userError) {
14 | console.error("Error checking user verification status:", userError);
15 | throw new Error("Failed to check credentials email verification status");
16 | }
17 |
18 | // If credentials email is already verified, we're good to go
19 | if (user.credentials_email_verified) {
20 | return { verified: true };
21 | }
22 |
23 | // At this point, the user exists, but the email is not confirmed
24 | // Check the expiry of the verification token
25 | const { data: token, error: tokenError } = await supabase
26 | .schema("next_auth")
27 | .from("verification_tokens")
28 | .select("expires")
29 | .eq("identifier", email)
30 | .single();
31 |
32 | if (tokenError) {
33 | console.error("Error checking verification token:", tokenError);
34 | throw new Error("Failed to check verification token");
35 | }
36 |
37 | // If the token has expired, we should allow sending a new one
38 | if (new Date(token.expires) < new Date()) {
39 | return { verified: false, canResendVerificationMail: true };
40 | }
41 |
42 | // Token exists and hasn't expired
43 | return {
44 | verified: false,
45 | canResendVerificationMail: false,
46 | };
47 | }
48 |
--------------------------------------------------------------------------------
/lib/check-subscriber-exists-error.ts:
--------------------------------------------------------------------------------
1 | export class CheckSubscriberExistsError extends Error {
2 | public static readonly errorMessages = {
3 | USER_NOT_FOUND: "User not found.",
4 | INTERNAL_ERROR: "Something went wrong.",
5 | } as const;
6 |
7 | public readonly code: keyof typeof CheckSubscriberExistsError.errorMessages;
8 |
9 | constructor(code: keyof typeof CheckSubscriberExistsError.errorMessages) {
10 | const message = CheckSubscriberExistsError.errorMessages[code];
11 | super(message);
12 |
13 | this.code = code;
14 | this.name = "CheckUserExistsError";
15 | }
16 |
17 | public static getErrorMessage(
18 | code: keyof typeof CheckSubscriberExistsError.errorMessages
19 | ) {
20 | return this.errorMessages[code];
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/lib/check-subscriber-exists.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 | import { CheckSubscriberExistsError } from "@/lib/check-subscriber-exists-error";
4 |
5 | export async function checkSubscriberExists(email: string) {
6 | try {
7 | const { error: userError } = await supabase
8 | .schema("next_auth")
9 | .from("subscribers")
10 | .select("*")
11 | .eq("email", email)
12 | .single();
13 |
14 | if (userError) {
15 | console.log("User exists error: ", userError);
16 | throw new CheckSubscriberExistsError("USER_NOT_FOUND");
17 | }
18 | return {
19 | success: true,
20 | };
21 | } catch (error) {
22 | return {
23 | error: true,
24 | };
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/lib/check-user-exists-error.ts:
--------------------------------------------------------------------------------
1 | export class CheckUserExistsError extends Error {
2 | public static readonly errorMessages = {
3 | USER_NOT_FOUND: "User not found.",
4 | INTERNAL_ERROR: "Something went wrong.",
5 | } as const;
6 |
7 | public readonly code: keyof typeof CheckUserExistsError.errorMessages;
8 |
9 | constructor(code: keyof typeof CheckUserExistsError.errorMessages) {
10 | const message = CheckUserExistsError.errorMessages[code];
11 | super(message);
12 |
13 | this.code = code;
14 | this.name = "CheckUserExistsError";
15 | }
16 |
17 | public static getErrorMessage(
18 | code: keyof typeof CheckUserExistsError.errorMessages
19 | ) {
20 | return this.errorMessages[code];
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/lib/check-user-exists.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 |
4 | export async function checkUserExists(email: string) {
5 | try {
6 | const { data, error } = await supabase
7 | .schema("next_auth")
8 | .from("users")
9 | .select("*")
10 | .eq("email", email)
11 | .single();
12 |
13 | if (error) {
14 | console.log("Failed to check user existence:", error.message);
15 | }
16 |
17 | return data;
18 | } catch (error) {
19 | console.error("Unexpected error while checking user existence:", error);
20 | return null;
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/lib/create-password-reset-token-error.ts:
--------------------------------------------------------------------------------
1 | export class CreatePasswordResetTokenError extends Error {
2 | public static readonly errorMessages = {
3 | TOKEN_CREATION_FAILED: "Failed to create password reset token.",
4 | TOKEN_DELETION_FAILED: "Failed to delete password reset token.",
5 | } as const;
6 |
7 | public readonly code: keyof typeof CreatePasswordResetTokenError.errorMessages;
8 |
9 | constructor(code: keyof typeof CreatePasswordResetTokenError.errorMessages) {
10 | const message = CreatePasswordResetTokenError.errorMessages[code];
11 | super(message);
12 |
13 | this.code = code;
14 | this.name = "CreatePasswordResetTokenError";
15 | }
16 |
17 | public static getErrorMessage(
18 | code: keyof typeof CreatePasswordResetTokenError.errorMessages
19 | ) {
20 | return this.errorMessages[code];
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/lib/create-password-reset-token.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 | import { CreatePasswordResetTokenError } from "@/lib/create-password-reset-token-error";
4 |
5 | export async function createPasswordResetToken(
6 | email: string,
7 | resetPasswordToken: string
8 | ) {
9 | try {
10 | // Delete existing token
11 | const { error: deleteTokenError } = await supabase
12 | .schema("next_auth")
13 | .from("reset_tokens")
14 | .delete()
15 | .eq("identifier", email);
16 |
17 | if (deleteTokenError) {
18 | console.error("Failed to delete password reset token:", deleteTokenError);
19 | throw new CreatePasswordResetTokenError("TOKEN_DELETION_FAILED");
20 | }
21 |
22 | // Create new token
23 | const { error: createTokenError } = await supabase
24 | .schema("next_auth")
25 | .from("reset_tokens")
26 | .insert({
27 | identifier: email,
28 | token: resetPasswordToken,
29 | expires: new Date(Date.now() + 60 * 60 * 1000).toISOString(),
30 | });
31 |
32 | if (createTokenError) {
33 | console.error("Failed to create password reset token:", deleteTokenError);
34 | throw new CreatePasswordResetTokenError("TOKEN_DELETION_FAILED");
35 | }
36 | } catch (error) {
37 | if (error instanceof CreatePasswordResetTokenError) {
38 | throw error;
39 | }
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/lib/create-user-error.ts:
--------------------------------------------------------------------------------
1 | export class CreateUserError extends Error {
2 | public static readonly errorMessages = {
3 | USER_CREATION_FAILED: "Failed to create user.",
4 | USER_DELETION_FAILED: "Failed to delete user.",
5 | TOKEN_CREATION_FAILED: "Failed to insert token.",
6 | INTERNAL_ERROR: "Something went wrong.",
7 | } as const;
8 |
9 | public readonly code: keyof typeof CreateUserError.errorMessages;
10 |
11 | constructor(code: keyof typeof CreateUserError.errorMessages) {
12 | const message = CreateUserError.errorMessages[code];
13 | super(message);
14 |
15 | this.code = code;
16 | this.name = "CreateUserError";
17 | }
18 |
19 | public static getErrorMessage(
20 | code: keyof typeof CreateUserError.errorMessages
21 | ) {
22 | return this.errorMessages[code];
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/lib/create-user.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import bcrypt from "bcrypt";
3 | import { supabase } from "@/lib/supabase";
4 | import { CreateUserError } from "@/lib/create-user-error";
5 |
6 | const adminEmails = ["rawgrittt@gmail.com"];
7 |
8 | export async function createUser(
9 | email: string,
10 | password: string,
11 | verificationToken: string
12 | ) {
13 | const hashedPassword = await bcrypt.hash(password, 10);
14 |
15 | const role = adminEmails.includes(email.toLowerCase()) ? "admin" : "user";
16 |
17 | try {
18 | // Create user
19 | const { error: userError } = await supabase
20 | .schema("next_auth")
21 | .from("users")
22 | .insert({
23 | email,
24 | password: hashedPassword,
25 | credentials_email_verified: false,
26 | role,
27 | })
28 | .select("*")
29 | .single();
30 |
31 | if (userError) {
32 | console.error("Error inserting new user:", userError);
33 | throw new CreateUserError("USER_CREATION_FAILED");
34 | }
35 |
36 | // Insert the verification token into the verification_tokens table
37 | const { error: tokenError } = await supabase
38 | .schema("next_auth")
39 | .from("verification_tokens")
40 | .insert({
41 | token: verificationToken,
42 | identifier: email,
43 | expires: new Date(Date.now() + 60 * 60 * 1000).toISOString(), // 1 hour
44 | });
45 |
46 | if (tokenError) {
47 | // If token insertion fails, delete the user we just created
48 | const { error: userDeletionError } = await supabase
49 | .schema("next_auth")
50 | .from("users")
51 | .delete()
52 | .eq("email", email);
53 |
54 | if (userDeletionError) {
55 | console.error("Error deleting user:", userDeletionError);
56 | throw new CreateUserError("USER_DELETION_FAILED");
57 | }
58 |
59 | // If we successfully deleted the user, we should still throw an error
60 | // about the original token creation failure
61 | throw new CreateUserError("TOKEN_CREATION_FAILED");
62 | }
63 |
64 | return {
65 | success: true,
66 | message: "User created",
67 | };
68 | } catch (error) {
69 | if (error instanceof CreateUserError) {
70 | throw error;
71 | }
72 | throw new CreateUserError("INTERNAL_ERROR");
73 | }
74 | }
75 |
--------------------------------------------------------------------------------
/lib/custom-email-provider.ts:
--------------------------------------------------------------------------------
1 | import type { EmailConfig } from "next-auth/providers";
2 | import { sendEmailSignInLink } from "@/lib/send-email-signin-link";
3 |
4 | export function customEmailProvider(): EmailConfig {
5 | return {
6 | id: "ses",
7 | type: "email",
8 | name: "Email",
9 | maxAge: 60 * 60,
10 |
11 | async sendVerificationRequest({ identifier: email, url }) {
12 | await sendEmailSignInLink(email, url);
13 | },
14 | };
15 | }
16 |
--------------------------------------------------------------------------------
/lib/error-message.tsx:
--------------------------------------------------------------------------------
1 | import Link from "next/link";
2 | import { Icons } from "@/components/icons";
3 | import { VerifyCredentialEmailError } from "@/lib/verify-credential-email-error";
4 |
5 | export function ErrorMessage({
6 | code,
7 | }: {
8 | code: keyof typeof VerifyCredentialEmailError.errorMessages;
9 | }) {
10 | const message = VerifyCredentialEmailError.getErrorMessage(code);
11 | return (
12 |
13 |
14 | Token Verification Error
15 |
16 |
{message}
17 |
21 |
22 | Sign In
23 |
24 |
(
5 | process.env.SUPABASE_URL!,
6 | process.env.SUPABASE_SERVICE_ROLE_KEY!
7 | );
8 |
--------------------------------------------------------------------------------
/lib/utils.ts:
--------------------------------------------------------------------------------
1 | import { clsx, type ClassValue } from "clsx"
2 | import { twMerge } from "tailwind-merge"
3 |
4 | export function cn(...inputs: ClassValue[]) {
5 | return twMerge(clsx(inputs))
6 | }
7 |
--------------------------------------------------------------------------------
/lib/verify-credential-email-error.ts:
--------------------------------------------------------------------------------
1 | export class VerifyCredentialEmailError extends Error {
2 | public static readonly errorMessages = {
3 | TOKEN_NOT_FOUND: "Verification token not found.",
4 | TOKEN_EXPIRED: "Verification token has expired.",
5 | TOKEN_INVALID: "Verification token is invalid.",
6 | INTERNAL_ERROR: "Something went wrong.",
7 | } as const;
8 |
9 | public readonly code: keyof typeof VerifyCredentialEmailError.errorMessages;
10 |
11 | constructor(code: keyof typeof VerifyCredentialEmailError.errorMessages) {
12 | const message = VerifyCredentialEmailError.errorMessages[code];
13 | super(message);
14 |
15 | this.code = code;
16 | this.name = "VerifyCredentialEmailError";
17 | }
18 |
19 | public static getErrorMessage(
20 | code: keyof typeof VerifyCredentialEmailError.errorMessages
21 | ) {
22 | return this.errorMessages[code];
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/lib/verify-credential-email.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 | import { VerifyCredentialEmailError } from "@/lib/verify-credential-email-error";
4 |
5 | export async function verifyCredentialEmail(token: string) {
6 | try {
7 | // Fetch the verification token record
8 | const { data: tokenData, error: tokenError } = await supabase
9 | .schema("next_auth")
10 | .from("verification_tokens")
11 | .select("*")
12 | .eq("token", token)
13 | .single();
14 |
15 | if (tokenError) {
16 | console.error("Error fetching verification token:", tokenError);
17 | throw new VerifyCredentialEmailError("TOKEN_INVALID");
18 | }
19 |
20 | // Check the token expiration
21 | if (new Date(tokenData.expires) < new Date()) {
22 | throw new VerifyCredentialEmailError("TOKEN_EXPIRED");
23 | }
24 |
25 | // Update the user's verification status
26 | const { data: userData, error: updateError } = await supabase
27 | .schema("next_auth")
28 | .from("users")
29 | .update({ credentials_email_verified: true })
30 | .eq("email", tokenData.identifier!)
31 | .select()
32 | .single();
33 |
34 | if (updateError) {
35 | throw new VerifyCredentialEmailError("INTERNAL_ERROR");
36 | }
37 |
38 | // If verification succeeded, clean up the used token
39 | const { error: deleteError } = await supabase
40 | .schema("next_auth")
41 | .from("verification_tokens")
42 | .delete()
43 | .eq("token", token);
44 |
45 | if (deleteError) {
46 | throw new VerifyCredentialEmailError("INTERNAL_ERROR");
47 | }
48 |
49 | return userData;
50 | } catch (error) {
51 | if (error instanceof VerifyCredentialEmailError) {
52 | throw error;
53 | }
54 |
55 | throw new VerifyCredentialEmailError("INTERNAL_ERROR");
56 | }
57 | }
58 |
--------------------------------------------------------------------------------
/lib/verify-password-reset-token-error.ts:
--------------------------------------------------------------------------------
1 | export class VerifyPasswordResetTokenError extends Error {
2 | public static readonly errorMessages = {
3 | TOKEN_NOT_FOUND: "Reset token not found.",
4 | TOKEN_EXPIRED: "Reset token has expired.",
5 | TOKEN_INVALID: "Reset token is invalid.",
6 | INTERNAL_ERROR: "Something went wrong.",
7 | } as const;
8 |
9 | public readonly code: keyof typeof VerifyPasswordResetTokenError.errorMessages;
10 |
11 | constructor(code: keyof typeof VerifyPasswordResetTokenError.errorMessages) {
12 | const message = VerifyPasswordResetTokenError.errorMessages[code];
13 | super(message);
14 |
15 | this.code = code;
16 | this.name = "VerifyPasswordResetTokenError";
17 | }
18 |
19 | // Add a method to get the message for a specific code
20 | public static getErrorMessage(
21 | code: keyof typeof VerifyPasswordResetTokenError.errorMessages
22 | ) {
23 | return this.errorMessages[code];
24 | }
25 | }
26 |
27 |
--------------------------------------------------------------------------------
/lib/verify-password-reset-token.ts:
--------------------------------------------------------------------------------
1 | import "server-only";
2 | import { supabase } from "@/lib/supabase";
3 | import { VerifyPasswordResetTokenError } from "@/lib/verify-password-reset-token-error";
4 |
5 | type TokenVerificationResult = {
6 | success: true;
7 | email: string;
8 | };
9 |
10 | export async function verifyPasswordResetToken(
11 | token: string
12 | ): Promise {
13 | try {
14 | // Fetch the reset token record
15 | const { data: tokenData, error: tokenError } = await supabase
16 | .schema("next_auth")
17 | .from("reset_tokens")
18 | .select("*")
19 | .eq("token", token)
20 | .single();
21 |
22 | if (tokenError) {
23 | console.error("Error fetching reset token:", tokenError);
24 | throw new VerifyPasswordResetTokenError("TOKEN_INVALID");
25 | }
26 |
27 | // Check token expiration
28 | if (new Date(tokenData.expires) < new Date()) {
29 | throw new VerifyPasswordResetTokenError("TOKEN_EXPIRED");
30 | }
31 |
32 | return {
33 | success: true,
34 | email: tokenData.identifier!,
35 | };
36 | } catch (error) {
37 | // If it's our known error type, rethrow it
38 | if (error instanceof VerifyPasswordResetTokenError) {
39 | throw error;
40 | }
41 | throw new VerifyPasswordResetTokenError("INTERNAL_ERROR");
42 | }
43 | }
44 |
--------------------------------------------------------------------------------
/middleware.ts:
--------------------------------------------------------------------------------
1 | import NextAuth from "next-auth";
2 | import { authConfig } from "@/auth.config";
3 | import { NextResponse } from "next/server";
4 |
5 | const { auth } = NextAuth(authConfig);
6 |
7 | export default auth((req) => {
8 | // Get the pathname from the request URL
9 | const { nextUrl } = req;
10 | const path = nextUrl.pathname;
11 |
12 | // Get authentication status from the req.auth object
13 | const isAuthenticated = !!req.auth;
14 |
15 | // If authenticated users try to access the "/signin" route, redirect them to the home page
16 | if (isAuthenticated && path === "/signin") {
17 | return Response.redirect(new URL("/", nextUrl));
18 | }
19 |
20 | // Redirect unauthenticated users to signin page
21 | if (!isAuthenticated) {
22 | const signInUrl = new URL("/signin", nextUrl);
23 | // Store the original URL as a query param to redirect after signin
24 | signInUrl.searchParams.set("from", path);
25 | return Response.redirect(signInUrl);
26 | }
27 |
28 | // Allow the request to proceed normally for other routes
29 | return NextResponse.next();
30 | });
31 |
32 | // Configure which routes use the middleware
33 | export const config = {
34 | matcher: ["/private/:path*", "/admin/:path*"],
35 | };
36 |
--------------------------------------------------------------------------------
/next.config.ts:
--------------------------------------------------------------------------------
1 | import type { NextConfig } from "next";
2 |
3 | const nextConfig: NextConfig = {
4 | /* config options here */
5 | };
6 |
7 | export default nextConfig;
8 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "next-auth-course",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev --turbopack",
7 | "build": "next build",
8 | "start": "next start",
9 | "lint": "next lint"
10 | },
11 | "dependencies": {
12 | "@auth/supabase-adapter": "^1.7.4",
13 | "@aws-sdk/client-ses": "^3.699.0",
14 | "@conform-to/react": "^1.2.2",
15 | "@conform-to/zod": "^1.2.2",
16 | "@headlessui/react": "^2.2.0",
17 | "@radix-ui/react-avatar": "^1.1.1",
18 | "@radix-ui/react-dropdown-menu": "^2.1.2",
19 | "@radix-ui/react-label": "^2.1.0",
20 | "@radix-ui/react-slot": "^1.1.0",
21 | "@radix-ui/react-tabs": "^1.1.1",
22 | "@react-email/components": "^0.0.30",
23 | "@supabase/supabase-js": "^2.46.2",
24 | "bcrypt": "^5.1.1",
25 | "class-variance-authority": "^0.7.1",
26 | "clsx": "^2.1.1",
27 | "framer-motion": "^12.0.0-alpha.2",
28 | "lucide-react": "^0.462.0",
29 | "next": "^15.1.0",
30 | "next-auth": "^5.0.0-beta.25",
31 | "nextjs-toploader": "^3.7.15",
32 | "react": "^19.0.0",
33 | "react-dom": "^19.0.0",
34 | "react-hot-toast": "^2.4.1",
35 | "server-only": "^0.0.1",
36 | "supabase": "^2.0.0",
37 | "tailwind-merge": "^2.5.5",
38 | "tailwindcss-animate": "^1.0.7",
39 | "zod": "^3.23.8",
40 | "zustand": "^5.0.2"
41 | },
42 | "devDependencies": {
43 | "@types/bcrypt": "^5.0.2",
44 | "@types/node": "^20",
45 | "@types/react": "^18",
46 | "@types/react-dom": "^18",
47 | "autoprefixer": "^10.4.20",
48 | "eslint": "^8",
49 | "eslint-config-next": "15.0.3",
50 | "postcss": "^8.4.49",
51 | "tailwindcss": "^3.4.15",
52 | "typescript": "^5"
53 | }
54 | }
55 |
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/postcss.config.mjs:
--------------------------------------------------------------------------------
1 | /** @type {import('postcss-load-config').Config} */
2 | const config = {
3 | plugins: {
4 | tailwindcss: {},
5 | },
6 | };
7 |
8 | export default config;
9 |
--------------------------------------------------------------------------------
/public/file.svg:
--------------------------------------------------------------------------------
1 | //"
177 |
178 | # Configure one of the supported SMS providers: `twilio`, `twilio_verify`, `messagebird`, `textlocal`, `vonage`.
179 | [auth.sms.twilio]
180 | enabled = false
181 | account_sid = ""
182 | message_service_sid = ""
183 | # DO NOT commit your Twilio auth token to git. Use environment variable substitution instead:
184 | auth_token = "env(SUPABASE_AUTH_SMS_TWILIO_AUTH_TOKEN)"
185 |
186 | [auth.mfa]
187 | # Control how many MFA factors can be enrolled at once per user.
188 | max_enrolled_factors = 10
189 |
190 | # Control use of MFA via App Authenticator (TOTP)
191 | [auth.mfa.totp]
192 | enroll_enabled = true
193 | verify_enabled = true
194 |
195 | # Configure Multi-factor-authentication via Phone Messaging
196 | [auth.mfa.phone]
197 | enroll_enabled = false
198 | verify_enabled = false
199 | otp_length = 6
200 | template = "Your code is {{ .Code }}"
201 | max_frequency = "5s"
202 |
203 | # Configure Multi-factor-authentication via WebAuthn
204 | # [auth.mfa.web_authn]
205 | # enroll_enabled = true
206 | # verify_enabled = true
207 |
208 | # Use an external OAuth provider. The full list of providers are: `apple`, `azure`, `bitbucket`,
209 | # `discord`, `facebook`, `github`, `gitlab`, `google`, `keycloak`, `linkedin_oidc`, `notion`, `twitch`,
210 | # `twitter`, `slack`, `spotify`, `workos`, `zoom`.
211 | [auth.external.apple]
212 | enabled = false
213 | client_id = ""
214 | # DO NOT commit your OAuth provider secret to git. Use environment variable substitution instead:
215 | secret = "env(SUPABASE_AUTH_EXTERNAL_APPLE_SECRET)"
216 | # Overrides the default auth redirectUrl.
217 | redirect_uri = ""
218 | # Overrides the default auth provider URL. Used to support self-hosted gitlab, single-tenant Azure,
219 | # or any other third-party OIDC providers.
220 | url = ""
221 | # If enabled, the nonce check will be skipped. Required for local sign in with Google auth.
222 | skip_nonce_check = false
223 |
224 | # Use Firebase Auth as a third-party provider alongside Supabase Auth.
225 | [auth.third_party.firebase]
226 | enabled = false
227 | # project_id = "my-firebase-project"
228 |
229 | # Use Auth0 as a third-party provider alongside Supabase Auth.
230 | [auth.third_party.auth0]
231 | enabled = false
232 | # tenant = "my-auth0-tenant"
233 | # tenant_region = "us"
234 |
235 | # Use AWS Cognito (Amplify) as a third-party provider alongside Supabase Auth.
236 | [auth.third_party.aws_cognito]
237 | enabled = false
238 | # user_pool_id = "my-user-pool-id"
239 | # user_pool_region = "us-east-1"
240 |
241 | [edge_runtime]
242 | enabled = true
243 | # Configure one of the supported request policies: `oneshot`, `per_worker`.
244 | # Use `oneshot` for hot reload, or `per_worker` for load testing.
245 | policy = "oneshot"
246 | # Port to attach the Chrome inspector for debugging edge functions.
247 | inspector_port = 8083
248 |
249 | # Use these configurations to customize your Edge Function.
250 | # [functions.MY_FUNCTION_NAME]
251 | # enabled = true
252 | # verify_jwt = true
253 | # import_map = "./functions/MY_FUNCTION_NAME/deno.json"
254 | # Uncomment to specify a custom file path to the entrypoint.
255 | # Supported file extensions are: .ts, .js, .mjs, .jsx, .tsx
256 | # entrypoint = "./functions/MY_FUNCTION_NAME/index.ts"
257 |
258 | [analytics]
259 | enabled = true
260 | port = 54327
261 | # Configure one of the supported backends: `postgres`, `bigquery`.
262 | backend = "postgres"
263 |
264 | # Experimental features may be deprecated any time
265 | [experimental]
266 | # Configures Postgres storage engine to use OrioleDB (S3)
267 | orioledb_version = ""
268 | # Configures S3 bucket URL, eg. .s3-.amazonaws.com
269 | s3_host = "env(S3_HOST)"
270 | # Configures S3 bucket region, eg. us-east-1
271 | s3_region = "env(S3_REGION)"
272 | # Configures AWS_ACCESS_KEY_ID for S3 bucket
273 | s3_access_key = "env(S3_ACCESS_KEY)"
274 | # Configures AWS_SECRET_ACCESS_KEY for S3 bucket
275 | s3_secret_key = "env(S3_SECRET_KEY)"
276 |
--------------------------------------------------------------------------------
/tailwind.config.ts:
--------------------------------------------------------------------------------
1 | import type { Config } from "tailwindcss";
2 |
3 | export default {
4 | darkMode: ["class"],
5 | content: [
6 | "./pages/**/*.{js,ts,jsx,tsx,mdx}",
7 | "./components/**/*.{js,ts,jsx,tsx,mdx}",
8 | "./app/**/*.{js,ts,jsx,tsx,mdx}",
9 | ],
10 | theme: {
11 | extend: {
12 | colors: {
13 | background: 'hsl(var(--background))',
14 | foreground: 'hsl(var(--foreground))',
15 | card: {
16 | DEFAULT: 'hsl(var(--card))',
17 | foreground: 'hsl(var(--card-foreground))'
18 | },
19 | popover: {
20 | DEFAULT: 'hsl(var(--popover))',
21 | foreground: 'hsl(var(--popover-foreground))'
22 | },
23 | primary: {
24 | DEFAULT: 'hsl(var(--primary))',
25 | foreground: 'hsl(var(--primary-foreground))'
26 | },
27 | secondary: {
28 | DEFAULT: 'hsl(var(--secondary))',
29 | foreground: 'hsl(var(--secondary-foreground))'
30 | },
31 | muted: {
32 | DEFAULT: 'hsl(var(--muted))',
33 | foreground: 'hsl(var(--muted-foreground))'
34 | },
35 | accent: {
36 | DEFAULT: 'hsl(var(--accent))',
37 | foreground: 'hsl(var(--accent-foreground))'
38 | },
39 | destructive: {
40 | DEFAULT: 'hsl(var(--destructive))',
41 | foreground: 'hsl(var(--destructive-foreground))'
42 | },
43 | border: 'hsl(var(--border))',
44 | input: 'hsl(var(--input))',
45 | ring: 'hsl(var(--ring))',
46 | chart: {
47 | '1': 'hsl(var(--chart-1))',
48 | '2': 'hsl(var(--chart-2))',
49 | '3': 'hsl(var(--chart-3))',
50 | '4': 'hsl(var(--chart-4))',
51 | '5': 'hsl(var(--chart-5))'
52 | }
53 | },
54 | borderRadius: {
55 | lg: 'var(--radius)',
56 | md: 'calc(var(--radius) - 2px)',
57 | sm: 'calc(var(--radius) - 4px)'
58 | }
59 | }
60 | },
61 | plugins: [require("tailwindcss-animate")],
62 | } satisfies Config;
63 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "ES2017",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "skipLibCheck": true,
7 | "strict": true,
8 | "noEmit": true,
9 | "esModuleInterop": true,
10 | "module": "esnext",
11 | "moduleResolution": "bundler",
12 | "resolveJsonModule": true,
13 | "isolatedModules": true,
14 | "jsx": "preserve",
15 | "incremental": true,
16 | "plugins": [
17 | {
18 | "name": "next"
19 | }
20 | ],
21 | "paths": {
22 | "@/*": ["./*"]
23 | }
24 | },
25 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
26 | "exclude": ["node_modules"]
27 | }
28 |
--------------------------------------------------------------------------------
/types/next-auth.d.ts:
--------------------------------------------------------------------------------
1 | import { type DefaultSession } from "next-auth";
2 |
3 | declare module "next-auth" {
4 | // First extend the User interface
5 | interface User {
6 | role?: string;
7 | }
8 |
9 | // Then extend the Session interface, being explicit about the user property
10 | interface Session {
11 | user: {
12 | role?: string;
13 | } & DefaultSession["user"]; // Merge with the default user properties
14 | }
15 | }
16 |
17 | // Extend JWT in a separate module declaration
18 | declare module "next-auth/jwt" {
19 | interface JWT {
20 | role?: string;
21 | }
22 | }
23 |
--------------------------------------------------------------------------------