refactor: auth context

src/contexts/AuthContext/AuthContext.tsx

-import React, { createContext, useContext, useState } from "react";
-import { TG_USER_ID } from "../../constants/constants";
+import { createContext } from "react";
+import type { AuthContextType } from "./AuthContext.types";
 
-interface AuthContextType {
-  isAuthenticated: boolean;
-  setAuthenticated: (auth: boolean) => void;
-}
-
-const AuthContext = createContext<AuthContextType>({
-  isAuthenticated: false,
-  setAuthenticated: () => {},
-});
-
-export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({
-  children,
-}) => {
-  const [isAuthenticated, setAuthenticated] = useState<boolean>(() => {
-    return !!localStorage.getItem(`token-${TG_USER_ID}`);
-  });
-
-  return (
-    <AuthContext.Provider value={{ isAuthenticated, setAuthenticated }}>
-      {children}
-    </AuthContext.Provider>
-  );
-};
-
-export const useAuth = () => useContext(AuthContext);
+export const AuthContext = createContext<AuthContextType | undefined>(
+  undefined
+);

src/contexts/AuthContext/AuthContext.types.ts

+export interface AuthContextType {
+  isAuthenticated: boolean;
+  setAuthenticated: (auth: boolean) => void;
+}

src/contexts/AuthContext/AuthProvider.tsx

+import { useState } from "react";
+import { AuthContext } from "./AuthContext";
+
+export const AuthProvider: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => {
+  const [isAuthenticated, setAuthenticated] = useState<boolean>(() => {
+    return !!localStorage.getItem(`<token-1>TG_USER_ID</token-1>`);
+  });
+
+  return (
+    <AuthContext.Provider value={{ isAuthenticated, setAuthenticated }}>
+      {children}
+    </AuthContext.Provider>
+  );
+};

src/contexts/AuthContext/useAuth.ts

+import { useContext } from "react";
+import { AuthContext } from "./AuthContext";
+
+export const useAuth = () => {
+  const context = useContext(AuthContext);
+
+  if (!context) {
+    throw new Error("useAuth must be used within an AuthProvider");
+  }
+
+  return context;
+};

src/main.tsx

@@ -6,7 +6,7 @@ import { store } from "./stores/store.ts";
 import "./locales/i18n.ts";
 import { ThemeProvider } from "./contexts/ThemeContext/ThemeProvider.tsx";
 import { LanguageProvider } from "./contexts/LanguageContext/LanguageProvider.tsx";
-import { AuthProvider } from "./contexts/AuthContext/AuthContext.tsx";
+import { AuthProvider } from "./contexts/AuthContext/AuthProvider.tsx";
 
 createRoot(document.getElementById("root")!).render(
   <Provider store={store}>

src/pages/Auth/Login/Login.tsx

@@ -12,8 +12,8 @@ import {
   useAppSelector,
   type RootState,
 } from "../../../stores/store";
-import { useAuth } from "../../../contexts/AuthContext/AuthContext";
 import { TG_USER_ID } from "../../../constants/constants";
+import { useAuth } from "../../../contexts/AuthContext/useAuth";
 
 interface ILoginFormData {
   login: string;
@@ -36,7 +36,6 @@ const Login: React.FC = () => {
   const onSubmit = async (data: ILoginFormData) => {
     try {
       const result = await dispatch(authLogin(data));
-      
       if (authLogin.fulfilled.match(result)) {
         const token = result.payload.token;
         localStorage.setItem(`token-${TG_USER_ID}`, token);

src/pages/Auth/Recover/Recover.tsx

@@ -42,7 +42,7 @@ const Recover: React.FC = () => {
 
   return (
     <div className="wrapper recover">
-      <AuthHeader back onBack={() => navigate("/auth/login")} />
+      <AuthHeader back onBack={() => navigate("/")} />
 
       <h2>{t("auth.passwordRecovery")}</h2>
 

src/pages/Auth/Register/Register.tsx

@@ -10,7 +10,7 @@ import { useSelector } from "react-redux";
 import { useAppDispatch, type RootState } from "../../../stores/store";
 import { authRegister } from "../../../stores/slices/authSlice";
 import { TG_USER_ID } from "../../../constants/constants";
-import { useAuth } from "../../../contexts/AuthContext/AuthContext";
+import { useAuth } from "../../../contexts/AuthContext/useAuth";
 
 interface IRegisterFormData {
   login: string;
@@ -50,7 +50,7 @@ const Register: React.FC = () => {
 
   return (
     <div className="wrapper">
-      <AuthHeader back onBack={() => navigate("/auth/login")} />
+      <AuthHeader back onBack={() => navigate("/")} />
 
       <h2>{t("auth.register")}</h2>
 

src/routes/ProtectedRoute.tsx

@@ -12,17 +12,13 @@ const ProtectedRoute: React.FC<ProtectedRouteProps> = ({
   redirectTo,
 }) => {
   const isAuthenticated = !!localStorage.getItem(`token-${TG_USER_ID}`);
-  const hasPincode = !!sessionStorage.getItem(`pincode-${TG_USER_ID}`);
+  const pincode = !!sessionStorage.getItem(`pincode-${TG_USER_ID}`);
 
-  if (!isAuthenticated) {
-    return <Navigate to={redirectTo} />;
-  }
-
-  if (!hasPincode) {
+  if (isAuthenticated && !pincode) {
     return <Navigate to="/pincode" />;
   }
 
-  return element;
+  return isAuthenticated ? element : <Navigate to={redirectTo} />;
 };
 
 export default ProtectedRoute;

src/routes/Router.tsx

@@ -26,7 +26,7 @@ const Router: React.FC = () => {
       element: isAuthenticated && <Navigate to={"/home"} />,
       children: [
         {
-          path: "/auth/login",
+          index: true,
           element: <Login />,
         },
         {