fix: redirect to dashboard when loggedin

src/app/(authentication)/layout.tsx

@@ -1,16 +1,15 @@
-import React from 'react';
-import { Container } from 'react-bootstrap';
+'use client'
 
-export default function Layout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <div className="bg-light dark:bg-dark min-vh-100 d-flex flex-row align-items-center">
-      <Container>
-        {children}
-      </Container>
-    </div>
-  )
+import React from 'react'
+import { Container } from 'react-bootstrap'
+import { SessionProvider } from 'next-auth/react'
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+    return (
+        <div className="bg-light dark:bg-dark min-vh-100 d-flex flex-row align-items-center">
+            <Container>
+                <SessionProvider>{children}</SessionProvider>{' '}
+            </Container>
+        </div>
+    )
 }

src/app/(authentication)/login/login.tsx

@@ -5,10 +5,10 @@ import useDictionary from '@/locales/dictionary-hook'
 import { faUser } from '@fortawesome/free-regular-svg-icons'
 import { faLock } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { signIn } from 'next-auth/react'
+import { signIn, useSession } from 'next-auth/react'
 import Link from 'next/link'
 import { useRouter } from 'next/navigation'
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import { Alert, Button, Col, Form, FormControl, InputGroup, Row } from 'react-bootstrap'
 import InputGroupText from 'react-bootstrap/InputGroupText'
 
@@ -17,6 +17,13 @@ export default function Login({ callbackUrl }: { callbackUrl: string }) {
     const [error, setError] = useState('')
     const router = useRouter()
     const dict = useDictionary()
+    const { data: session, status } = useSession()
+
+    useEffect(() => {
+        if (status === 'authenticated') {
+            router.push(callbackUrl)
+        }
+    }, [status, callbackUrl, router])
 
     const login = async (formData: FormData) => {
         setSubmitting(true)

src/app/(authentication)/login/page.tsx

@@ -5,42 +5,39 @@ import Link from 'next/link'
 import { Col, Row } from 'react-bootstrap'
 
 export default async function Page({ searchParams }: { searchParams: SearchParams }) {
-  const { callbackUrl } = searchParams
-  const dict = await getDictionary()
+    const { callbackUrl } = searchParams
+    const dict = await getDictionary()
 
-  const getCallbackUrl = () => {
-    if (!callbackUrl) {
-      return '/' // Default redirect to home page
-    }
+    const getCallbackUrl = () => {
+        if (!callbackUrl) {
+            return '/' // Default redirect to home page
+        }
 
-    return callbackUrl.toString()
-  }
+        return callbackUrl.toString()
+    }
 
-  return (
-    <Row className="justify-content-center align-items-center px-3">
-      <Col lg={8}>
-        <Row>
-          <Col md={7} className="bg-white dark:bg-dark border p-5">
-            <div>
-              <h1>{dict.login.title}</h1>
-              <p className="text-black-50 dark:text-gray-500">{dict.login.description}</p>
-              <LoginForm callbackUrl={getCallbackUrl()} />
-            </div>
-          </Col>
-          <Col
-            md={5}
-            className="bg-primary text-white d-flex align-items-center justify-content-center p-5"
-          >
-            <div className="text-center">
-              <h2>{dict.login.signup.title}</h2>
-              <p>{dict.login.signup.description}</p>
-              <Link className="btn btn-lg btn-outline-light mt-3" href="/#">
-                {dict.signup.register_now}
-              </Link>
-            </div>
-          </Col>
+    return (
+        <Row className="justify-content-center align-items-center px-3">
+            <Col lg={8}>
+                <Row>
+                    <Col md={7} className="bg-white dark:bg-dark border p-5">
+                        <div>
+                            <h1>{dict.login.title}</h1>
+                            <p className="text-black-50 dark:text-gray-500">{dict.login.description}</p>
+                            <LoginForm callbackUrl={getCallbackUrl()} />
+                        </div>
+                    </Col>
+                    <Col md={5} className="bg-primary text-white d-flex align-items-center justify-content-center p-5">
+                        <div className="text-center">
+                            <h2>{dict.login.signup.title}</h2>
+                            <p>{dict.login.signup.description}</p>
+                            <Link className="btn btn-lg btn-outline-light mt-3" href="/#">
+                                {dict.signup.register_now}
+                            </Link>
+                        </div>
+                    </Col>
+                </Row>
+            </Col>
         </Row>
-      </Col>
-    </Row>
-  )
+    )
 }