refactor: add a shared authentication header object

Author: betich

apps/web/src/app/auth/callback/page.tsx

@@ -3,6 +3,7 @@
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
+import { authHeaders } from "@/config/header";
 import { client } from "@/lib/client";
 
 export default function AuthCallback() {
@@ -12,7 +13,7 @@ export default function AuthCallback() {
 	const [userInfo, setUserInfo] = useState<{
 		id: string;
 		email: string;
-		username: string;
+		name: string;
 		avatar_url?: string;
 	} | null>(null);
 
@@ -47,8 +48,7 @@ export default function AuthCallback() {
 					},
 					{
 						headers: {
-							"Content-Type": "application/json",
-							credentials: "include",
+							...authHeaders,
 						},
 					}
 				);
@@ -134,7 +134,7 @@ export default function AuthCallback() {
 												/>
 											)}
 											<div className="text-left">
-												<p className="text-sm font-medium text-gray-900">{userInfo.username}</p>
+												<p className="text-sm font-medium text-gray-900">{userInfo.name}</p>
 												<p className="text-sm text-gray-500">{userInfo.email}</p>
 											</div>
 										</div>

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

@@ -3,14 +3,14 @@
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
+import { authHeaders } from "@/config/header";
 import { SIGN_IN_LINK } from "@/config/link";
-import { env } from "@/env";
 import { client } from "@/lib/client";
 
 interface UserInfo {
 	id: string;
 	email: string;
-	username: string;
+	name: string;
 	avatar_url?: string;
 }
 
@@ -39,9 +39,7 @@ export default function TestPage() {
 			.post(
 				{},
 				{
-					headers: {
-						credentials: "include",
-					},
+					...authHeaders,
 				}
 			)
 			.catch((error) => {
@@ -67,7 +65,7 @@ export default function TestPage() {
 									/>
 								)}
 								<div className="text-left">
-									<h3 className="text-lg font-medium text-gray-900">{user.username}</h3>
+									<h3 className="text-lg font-medium text-gray-900">{user.name}</h3>
 									<p className="text-sm text-gray-500">{user.email}</p>
 									<p className="text-xs text-gray-400 mt-1">ID: {user.id}</p>
 								</div>

apps/web/src/config/header.ts

@@ -0,0 +1,3 @@
+export const authHeaders: Record<string, string> = {
+	credentials: "include",
+};