update sign-in page

src/containers/Modals/LoginModal/index.tsx

@@ -1,22 +1,20 @@
 import React from "react";
-import { altogic } from "src/api/altogic";
+import Link from "next/link";
 import { Button } from "src/components/Button";
 import { Modal, ModalProps } from "src/components/Modal";
 
 export const LoginModal: React.FC<ModalProps> = ({ setVisible, visible }) => {
-  const onSignIn = () => {
-    altogic.auth.signInWithProvider("google");
-  };
-
   return (
     <Modal visible={visible} setVisible={setVisible}>
       <Modal.Header>Login</Modal.Header>
       <Modal.Content>
         <h2>Welcome Back!</h2>
         <p>Login to unlock full potential of JSON Crack!</p>
-        <Button onClick={onSignIn} status="SECONDARY" block>
-          Sign In
-        </Button>
+        <Link href="/sign-in">
+          <Button onClick={() => setVisible(false)} status="SECONDARY" block>
+            Sign In
+          </Button>
+        </Link>
       </Modal.Content>
       <Modal.Controls setVisible={setVisible} />
     </Modal>

src/pages/sign-in.tsx

@@ -31,13 +31,13 @@ const StyledLoginButtons = styled.div`
 
 const SignIn = () => {
   const { isReady, replace } = useRouter();
-  const tokenAuth = useUser(state => state.tokenAuth);
+  const checkSession = useUser(state => state.checkSession);
   const isAuthenticated = useUser(state => state.isAuthenticated);
 
   React.useEffect(() => {
-    if (isAuthenticated) replace("/editor");
-    if (isReady) tokenAuth();
-  }, [tokenAuth, isReady, isAuthenticated, replace]);
+      if (!isReady) checkSession();
+      if (isAuthenticated) replace("/editor");
+  }, [isReady, isAuthenticated, replace, checkSession]);
 
   const handleLoginClick = (provider: "github" | "google") => {
     altogic.auth.signInWithProvider(provider);