formatting

src/views/home/auth/Login.tsx

@@ -1,113 +1,133 @@
-import { useState, useEffect } from "react";
-import { PrimaryButton } from "../../../components/button/PrimaryButton";
-import { Input } from "../../../components/input/Input";
-import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
-import { Link, useNavigate } from "react-router-dom";
-import { loginUser } from "../../../redux/slices/auth";
+import { useState, useEffect } from 'react';
+import { PrimaryButton } from '../../../components/button/PrimaryButton';
+import { Input } from '../../../components/input/Input';
+import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
+import { Link, useNavigate } from 'react-router-dom';
+import { loginUser } from '../../../redux/slices/auth';
 // import { cn } from "../../../lib/cn";
-import { setMenuActivePage } from "../../../redux/slices/store";
-import { Balloon } from "../../../assets/icons/auth";
-import { SecondaryButton } from "../../../components/button/SecondaryButton";
-import { googleLogo } from "../../../assets/icons/input";
+import { setMenuActivePage } from '../../../redux/slices/store';
+import { Balloon } from '../../../assets/icons/auth';
+import { SecondaryButton } from '../../../components/button/SecondaryButton';
+import { googleLogo } from '../../../assets/icons/input';
 
 const Login = () => {
-  const dispatch = useAppDispatch();
-  const navigate = useNavigate();
+    const dispatch = useAppDispatch();
+    const navigate = useNavigate();
 
-  const [username, setUsername] = useState<string>("");
-  const [password, setPassword] = useState<string>("");
-  const [submitClicked, setSubmitClicked] = useState<boolean>(false);
+    const [username, setUsername] = useState<string>('');
+    const [password, setPassword] = useState<string>('');
+    const [submitClicked, setSubmitClicked] = useState<boolean>(false);
 
-  const { status, jwt } = useAppSelector((state) => state.auth);
+    const { status, jwt } = useAppSelector((state) => state.auth);
 
+    // const [err, setErr] = useState<string>("");
 
-  // const [err, setErr] = useState<string>("");
+    // После успешного логина
+    useEffect(() => {
+        dispatch(setMenuActivePage('account'));
+        console.log(submitClicked);
+    }, []);
 
-  // После успешного логина
-  useEffect(() => {
-    dispatch(setMenuActivePage("account"))
-    console.log(submitClicked);
-  }, []);
+    useEffect(() => {
+        if (jwt) {
+            navigate('/home/offices'); // или другая страница после входа
+        }
+    }, [jwt]);
 
-  useEffect(() => {
-    if (jwt) {
-      navigate("/home/offices"); // или другая страница после входа
-    }
-  }, [jwt]);
+    const handleLogin = () => {
+        // setErr(err == "" ? "Неверная почта и/или пароль" : "");
+        setSubmitClicked(true);
 
-  const handleLogin = () => {
-    // setErr(err == "" ? "Неверная почта и/или пароль" : "");
-    setSubmitClicked(true);
+        if (!username || !password) return;
 
-    if (!username || !password) return;
+        dispatch(loginUser({ username, password }));
+    };
 
-    dispatch(loginUser({ username, password }));
-  };
+    return (
+        <div className="h-svh w-svw fixed pointer-events-none top-0 left-0 flex items-center justify-center">
+            <div className="grid gap-[80px] grid-cols-[400px,384px]  box-border relative ">
+                <div className="flex items-center justify-center ">
+                    <img src={Balloon} />
+                </div>
+                <div className=" relative pointer-events-auto">
+                    <div>
+                        <div className="text-[40px] text-liquid-white font-bold h-[50px]">
+                            С возвращением
+                        </div>
+                        <div className="text-[18px] text-liquid-light font-bold h-[23px]">
+                            Вход в аккаунт
+                        </div>
+                    </div>
 
-  return (
-    <div className="h-svh w-svw fixed pointer-events-none top-0 left-0 flex items-center justify-center">
-      <div className="grid gap-[80px] grid-cols-[400px,384px]  box-border relative ">
-        <div className="flex items-center justify-center ">
-          <img src={Balloon} />
-        </div>
-        <div className=" relative pointer-events-auto">
-          <div>
-            <div className="text-[40px] text-liquid-white font-bold h-[50px]">
-              С возвращением
+                    <Input
+                        name="login"
+                        autocomplete="login"
+                        className="mt-[10px]"
+                        type="text"
+                        label="Логин"
+                        onChange={(v) => {
+                            setUsername(v);
+                        }}
+                        placeholder="login"
+                    />
+                    <Input
+                        name="password"
+                        autocomplete="password"
+                        className="mt-[10px]"
+                        type="password"
+                        label="Пароль"
+                        onChange={(v) => {
+                            setPassword(v);
+                        }}
+                        placeholder="abCD1234"
+                    />
+
+                    <div className="flex justify-end mt-[10px]">
+                        <Link
+                            to={''}
+                            className={
+                                'text-liquid-brightmain text-[16px] h-[20px] transition-all hover:underline '
+                            }
+                        >
+                            Забыли пароль?
+                        </Link>
+                    </div>
+
+                    <div className="mt-[10px]">
+                        <PrimaryButton
+                            className="w-full mb-[8px]"
+                            onClick={handleLogin}
+                            text={status === 'loading' ? 'Вход...' : 'Вход'}
+                            disabled={status === 'loading'}
+                        />
+                        <SecondaryButton className="w-full" onClick={() => {}}>
+                            <div className="flex items-center">
+                                <img
+                                    src={googleLogo}
+                                    className="h-[24px] w-[24px] mr-[15px]"
+                                />
+                                Вход с Google
+                            </div>
+                        </SecondaryButton>
+                    </div>
+
+                    <div className="flex justify-center mt-[10px]">
+                        <span>
+                            Нет аккаунта?{' '}
+                            <Link
+                                to={'/home/register'}
+                                className={
+                                    'text-liquid-brightmain text-[16px] h-[20px] transition-all hover:underline '
+                                }
+                            >
+                                Регистрация
+                            </Link>
+                        </span>
+                    </div>
+                </div>
             </div>
-            <div className="text-[18px] text-liquid-light font-bold h-[23px]">
-              Вход в аккаунт
-            </div>
-          </div>
-
-
-          <Input name="login" autocomplete="login" className="mt-[10px]" type="text" label="Логин" onChange={(v) => { setUsername(v) }} placeholder="login" />
-          <Input name="password" autocomplete="password" className="mt-[10px]" type="password" label="Пароль" onChange={(v) => { setPassword(v) }} placeholder="abCD1234" />
-
-          <div className="flex justify-end mt-[10px]">
-            <Link
-              to={""}
-              className={"text-liquid-brightmain text-[16px] h-[20px] transition-all hover:underline "}>
-              Забыли пароль?
-            </Link>
-          </div>
-
-
-          <div className="mt-[10px]">
-            <PrimaryButton
-              className="w-full mb-[8px]"
-              onClick={handleLogin}
-              text={status === "loading" ? "Вход..." : "Вход"}
-              disabled={status === "loading"}
-            />
-            <SecondaryButton
-              className="w-full"
-              onClick={() => { }}
-            >
-              <div className="flex items-center">
-                <img src={googleLogo} className="h-[24px] w-[24px] mr-[15px]" />
-                Вход с Google
-              </div>
-            </SecondaryButton>
-          </div>
-
-
-
-          <div className="flex justify-center mt-[10px]">
-            <span>
-              Нет аккаунта? <Link
-                to={"/home/register"}
-                className={"text-liquid-brightmain text-[16px] h-[20px] transition-all hover:underline "}>
-                Регистрация
-              </Link>
-            </span>
-
-          </div>
         </div>
-
-      </div>
-    </div>
-  );
+    );
 };
 
 export default Login;