fix: fix some bug, remove supabase getSession warning

Author: lxup

package.json

@@ -96,7 +96,7 @@
     "modern-screenshot": "^4.6.7",
     "negotiator": "^1.0.0",
     "next": "16.0.7",
-    "next-intl": "^4.5.7",
+    "next-intl": "^4.5.8",
     "next-themes": "^0.4.6",
     "next-turnstile": "^1.0.5",
     "nextjs-toploader": "^3.8.16",

pnpm-lock.yaml

@@ -31,6 +31,7 @@ export function LoginPasswordForm({
   }), [common]);
 
   const onSubmit = useCallback(async (event: React.SyntheticEvent) => {
+    event?.preventDefault();
     try {
       setIsLoading(true);
       const emailForm = (event.target as HTMLFormElement).email.value;

src/app/[lang]/(app)/auth/login/_components/LoginPasswordForm.tsx

@@ -15,7 +15,7 @@ import { Images } from '@/config/images';
 import { useRandomImage } from '@/hooks/use-random-image';
 import { Link, useRouter } from "@/lib/i18n/navigation";
 import { useSearchParams } from 'next/navigation';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { useSupabaseClient } from '@/context/supabase-context';
 import { useLocale, useTranslations } from 'next-intl';
 import * as z from 'zod';
@@ -151,7 +151,7 @@ export default function Signup() {
 	// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [usernameAvailability.isAvailable, common]);
 
-	const handleSubmit = async (data: SignupFormValues) => {
+	const handleSubmit = useCallback(async (data: SignupFormValues) => {
 		try {
 			setIsLoading(true);
 			if (turnstileStatus !== 'success') {
@@ -185,9 +185,9 @@ export default function Signup() {
 		} finally {
 			setIsLoading(false);
 		}
-	};
+	}, [signup, t, common, locale, turnstileStatus]);
 
-	const resendOtp = async () => {
+	const resendOtp = useCallback(async () => {
 		try {
 			setIsLoading(true);
 			await loginWithOtp(form.getValues('email'), redirectTo);
@@ -207,9 +207,9 @@ export default function Signup() {
 		} finally {
 			setIsLoading(false);
 		}
-	};
+	}, [loginWithOtp, redirectTo, form, common]);
 
-	const handleVerifyOtp = async (otp: string) => {
+	const handleVerifyOtp = useCallback(async (otp: string) => {
 		try {
 		  setIsLoading(true);
 		  const { error } = await supabase.auth.verifyOtp({
@@ -236,7 +236,7 @@ export default function Signup() {
 		} finally {
 		  setIsLoading(false);
 		}
-	};
+	}, [supabase, router, redirectTo, form, common]);
 
 	return (
 	<div

src/app/[lang]/(app)/auth/signup/page.tsx

@@ -17,7 +17,7 @@ export const SupabaseProvider = ({
 }) => {
 	const locale = useLocale();
 	const supabase = useMemo(() => {
-		return createBrowserClient<Database>(
+		const client = createBrowserClient<Database>(
 			SUPABASE_URL,
 			SUPABASE_ANON_KEY,
 			{
@@ -28,6 +28,10 @@ export const SupabaseProvider = ({
 				},
 			},
 		);
+
+		(client.auth as any).suppressGetSessionWarning = true;
+
+		return client;
 	}, [locale]);
 
 	return (

src/app/[lang]/(app)/loading.tsx

@@ -10,7 +10,7 @@ export const createMiddlewareClient = ({
   request: NextRequest;
   response: NextResponse;
 }) => {
-  return createServerClient<Database>(
+  const client = createServerClient<Database>(
     SUPABASE_URL,
     SUPABASE_ANON_KEY,
     {
@@ -27,4 +27,8 @@ export const createMiddlewareClient = ({
       },
     }
   );
+
+  (client.auth as any).suppressGetSessionWarning = true;
+
+  return client;
 };

src/context/supabase-context.tsx

@@ -9,7 +9,7 @@ import { getLocale } from 'next-intl/server';
 export const createServerClient = async () => {
   const cookieStore = await cookies();
   const locale = await getLocale();
-  return createServerClientSupabase<Database>(
+  const client = createServerClientSupabase<Database>(
     SUPABASE_URL,
     SUPABASE_ANON_KEY,
     {
@@ -36,4 +36,8 @@ export const createServerClient = async () => {
       }
     },
   );
+
+  (client.auth as any).suppressGetSessionWarning = true;
+
+  return client;
 };