diff --git a/client/src/app/(auth)/layout.css b/client/src/app/(auth)/layout.css index dd1246b..c575e36 100644 --- a/client/src/app/(auth)/layout.css +++ b/client/src/app/(auth)/layout.css @@ -33,12 +33,21 @@ padding: 2rem; display: flex; flex-direction: column; + align-items: center; gap: 2rem; text-align: center; text-wrap: balance; - width: min(95%, 600px); + width: min(95%, 500px); background: var(--primary-900); box-shadow: var(--box-shadow-xl); + + & h1 { + font-size: 2rem; + } + + & button { + width: max-content; + } } .form-container { diff --git a/client/src/app/(auth)/verify/VerifyContent.tsx b/client/src/app/(auth)/verify/VerifyContent.tsx new file mode 100644 index 0000000..a2034c5 --- /dev/null +++ b/client/src/app/(auth)/verify/VerifyContent.tsx @@ -0,0 +1,26 @@ +import { verifyAccount } from "@/lib/api/auth"; + +import { Button } from "@/components/ui/button/Button"; +import { LinkButton } from "@/components/ui/button/LinkButton"; + +export default async function VerifyContent({ token }: { token: string }) { + const res = await verifyAccount(token); + + if (res.success) { + return ( + <> +

All good!

+

You can now log in with your email/username

+ Go to login + + ); + } + + return ( + <> +

Verification failed

+

{res.error}

+ {res.status === 410 && } + + ); +} diff --git a/client/src/app/(auth)/verify/page.tsx b/client/src/app/(auth)/verify/page.tsx index 9203eac..50f9eee 100644 --- a/client/src/app/(auth)/verify/page.tsx +++ b/client/src/app/(auth)/verify/page.tsx @@ -1,20 +1,22 @@ -"use client"; -import { useSearchParams } from "next/navigation"; +import VerifyContent from "./VerifyContent"; +import { Suspense } from "react"; -export default function VerifyPage() { - const searchParams = useSearchParams(); - const token = searchParams.get("token"); +type VerifyPageProps = { + searchParams: Promise<{ + token?: string; + }>; +}; - // TODO: Implement actual verification logic by sending the token to the server for validation +export default async function VerifyPage({ searchParams }: VerifyPageProps) { + const params = await searchParams; + const token = params.token?.trim(); return (
-

Verify your email

-

- A verification link has been sent to your email. Please check your - inbox and click the link to verify your account. -

+ Verifying account...

}> + +
); diff --git a/client/src/lib/api/auth.ts b/client/src/lib/api/auth.ts index 2ff7399..1a84250 100644 --- a/client/src/lib/api/auth.ts +++ b/client/src/lib/api/auth.ts @@ -1,3 +1,5 @@ +import { ApiResponse } from "../types/apiResponse"; + import { config } from "../utils/envConfig"; import type { @@ -9,7 +11,7 @@ import type { const AUTH_URL = `${config.BACKEND_URL}/api/auth`; -// auth/available +// api/auth/available // GET // Check if email/username is available const checkDuplicateField = async ( @@ -37,7 +39,7 @@ export const checkDuplicateEmail = (value: string) => export const checkDuplicateUsername = (value: string) => checkDuplicateField("username", value); -// auth/register +// api/auth/register // POST // Create new user export const createUser = async ( @@ -62,7 +64,7 @@ export const createUser = async ( } }; -// auth/login +// api/auth/login // POST // Log in export const loggingIn = async ( @@ -87,9 +89,33 @@ export const loggingIn = async ( } }; -// auth/verify +// api/auth/verify - params: token // GET // Verify email with token -// export const verifyAccount = async +export const verifyAccount = async (token: string): Promise => { + try { + const res = await fetch( + `${AUTH_URL}/verify?token=${encodeURIComponent(token)}`, + { + cache: "no-store", + }, + ); + + const data = await res.json(); + + if (!res.ok) { + return { + success: false, + error: data.error ?? "Verification request failed.", + status: res.status, + }; + } + + return data; + } catch (err) { + console.error("Error: ", err); + return { success: false, error: "Network error" }; + } +}; // TOdO: Implement verifyAccount function when needed diff --git a/client/src/lib/types/apiResponse.ts b/client/src/lib/types/apiResponse.ts index eec85f3..8e5cd75 100644 --- a/client/src/lib/types/apiResponse.ts +++ b/client/src/lib/types/apiResponse.ts @@ -2,4 +2,5 @@ export type ApiResponse = { success: boolean; error?: string; message?: string; + status?: number; }; diff --git a/rust-server/src/db/queries.rs b/rust-server/src/db/queries.rs index ee1ebc5..935c842 100644 --- a/rust-server/src/db/queries.rs +++ b/rust-server/src/db/queries.rs @@ -21,7 +21,7 @@ pub async fn find_user_by_username(db: &PgPool, username: &str) -> Result