block signed in user to enter /login and /register routes

NethermindEth · Oct 9, 2024 · bba85ca · bba85ca
1 parent 34add53
commit bba85ca
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 4 deletions.
diff --git a/src/onboarding/Login.jsx b/src/onboarding/Login.jsx
@@ -1,9 +1,9 @@
 import { Button, Input } from '@nextui-org/react';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, Navigate, useNavigate } from 'react-router-dom';
+import { useSignIn, useUser } from '@clerk/clerk-react';
 import { reduceState } from '../shared/helpers';
 import { useForm } from 'react-hook-form';
 import { useMutativeReducer } from 'use-mutative';
-import { useSignIn } from '@clerk/clerk-react';
 
 export default function Login() {
   const {
@@ -14,6 +14,7 @@ export default function Login() {
   } = useForm();
 
   const { isLoaded: isClerkLoaded, signIn, setActive } = useSignIn();
+  const { isSignedIn } = useUser();
   const [state, dispatch] = useMutativeReducer(reduceState, {
     isLoading: false
   });
@@ -62,6 +63,10 @@ export default function Login() {
   //   });
   // };
 
+  if (isSignedIn) {
+    return <Navigate to={'/'} />;
+  }
+
   return (
     <div className="flex h-full flex-col items-center justify-center gap-y-9">
       <div className="flex flex-col gap-y-4 text-center">

diff --git a/src/onboarding/Register.jsx b/src/onboarding/Register.jsx
@@ -1,10 +1,10 @@
 import { Button, Checkbox, cn, Input } from '@nextui-org/react';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, Navigate, useNavigate } from 'react-router-dom';
+import { useSignUp, useUser } from '@clerk/clerk-react';
 import { OTPInput } from 'input-otp';
 import { reduceState } from '../shared/helpers';
 import { useForm } from 'react-hook-form';
 import { useMutativeReducer } from 'use-mutative';
-import { useSignUp } from '@clerk/clerk-react';
 
 export default function Register() {
   const {
@@ -17,6 +17,7 @@ export default function Register() {
     formState: { errors }
   } = useForm();
   const { isLoaded: isClerkLoaded, signUp, setActive } = useSignUp();
+  const { isSignedIn } = useUser();
   const [state, dispatch] = useMutativeReducer(reduceState, {
     isLoading: false,
     verifying: false,
@@ -107,6 +108,10 @@ export default function Register() {
   //   });
   // };
 
+  if (isSignedIn) {
+    return <Navigate to={'/'} />;
+  }
+
   if (state.verifying) {
     return (
       <div className="flex h-full flex-col items-center justify-center gap-y-9">