We finally fixed the sign in and sign out stuff with our client components not updating

src/app/(auth-pages)/sign-in/page.tsx

@@ -1,13 +1,31 @@
+'use client';
 import Link from 'next/link';
-import { getUser, signIn } from '@/lib/actions';
-import { FormMessage, type Message, SubmitButton } from '@/components/default';
+import { signIn } from '@/lib/actions';
+import { SubmitButton } from '@/components/default';
 import { Input, Label } from '@/components/ui';
-import { redirect } from 'next/navigation';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/components/context/auth';
+import { useEffect } from 'react';
+
+const Login = () => {
+  const router = useRouter();
+  const { isAuthenticated, refreshUserData } = useAuth();
+
+  // Redirect if already authenticated
+  useEffect(() => {
+    if (isAuthenticated) {
+      router.push('/');
+    }
+  }, [isAuthenticated, router]);
+
+  const handleSignIn = async (formData: FormData) => {
+    const result = await signIn(formData);
+    if (result?.success) {
+      await refreshUserData();
+      router.push('/');
+    }
+  };
 
-const Login = async (props: { searchParams: Promise<Message> }) => {
-  const searchParams = await props.searchParams;
-  const user = await getUser();
-  if (user.success) redirect('/profile');
   return (
     <form className='flex-1 flex flex-col min-w-64'>
       <h1 className='text-2xl font-medium'>Sign in</h1>
@@ -35,12 +53,12 @@ const Login = async (props: { searchParams: Promise<Message> }) => {
           placeholder='Your password'
           required
         />
-        <SubmitButton pendingText='Signing In...' formAction={signIn}>
+        <SubmitButton pendingText='Signing In...' formAction={handleSignIn}>
           Sign in
         </SubmitButton>
-        <FormMessage message={searchParams} />
       </div>
     </form>
   );
 };
+
 export default Login;