resolve merge conflicts

src/TonalityApp.tsx

-import './App.css'
-import React from 'react'
+import "./App.css";
+import React from "react";
 import { RenderRoutes } from "@/routes/RenderRoutes.tsx";
-import {routes} from "@/routes/routes.ts";
+import { routes } from "@/routes/routes.ts";
 import AuthProvider from "@/context/AuthProvider.tsx";
 
-export const AuthContext = React.createContext(null)
+export const AuthContext = React.createContext(null);
 
-export const useAuth = () => React.useContext(AuthContext)
+export const useAuth = () => React.useContext(AuthContext);
 
-export const Routes = RenderRoutes(routes)
+export const Routes: React.ReactNode = RenderRoutes(routes);
 
 const TonalityApp = () => {
-
   return (
     <AuthProvider>
-      <Routes/>
+      <Routes />
     </AuthProvider>
-  )
-}
-export default TonalityApp
+  );
+};
+export default TonalityApp;

src/routes/ProtectedRoute.tsx

-import {Navigate, Outlet,} from 'react-router-dom';
-import {useAuth} from "@/TonalityApp.tsx";
+import { Navigate, Outlet } from "react-router-dom";
+import { useAuth } from "@/TonalityApp.tsx";
 
-const ProtectedRoute = ({isPublic}) => {
-  const isValidUser : boolean = useAuth().token === null;
-  return (isValidUser || isPublic) ? <Outlet/> : <Navigate to='/login'/>
-}
+const ProtectedRoute = ({ isPublic }) => {
+  const isValidUser: boolean = useAuth().token === null;
+  return isValidUser || isPublic ? <Outlet /> : <Navigate to="/login" />;
+};
 
-export default ProtectedRoute;
+const ProtectedRoute = ({ isPublic, isAuthorized }) => {
\ No newline at end of file
+  return isPublic || isAuthorized ? <Outlet /> : <Navigate to="/login" />;
+};
+
+export default ProtectedRoute;

src/routes/RenderRoutes.tsx

-import React from 'react';
-import {Route, Routes} from 'react-router-dom';
+import React from "react";
+import { Route, Routes } from "react-router-dom";
 import ProtectedRoute from "@/routes/ProtectedRoute.tsx";
-import {generateFlattenRoutes} from "@/lib/utils.ts";
-export const RenderRoutes  : React.FC = (mainRoutes) => {
-  return ({isAuthorized}) => {
-    const layouts = mainRoutes.map(({layout: Layout, routes}, index) => {
+import { generateFlattenRoutes } from "@/lib/utils.ts";
+
+export const RenderRoutes: React.FC = (mainRoutes) => {
+  return ({ isAuthorized }) => {
+    const layouts = mainRoutes.map(({ layout: Layout, routes }, index) => {
       const subRoutes = generateFlattenRoutes(routes);
 
-      subRoutes.map(({component: Component, path, name}) => {
-        console.log('component', Component)
-        console.log('path', path)
-        console.log('name', name)
-      })
+      subRoutes.map(({ component: Component, path, name }) => {
+        console.log("component", Component);
+        console.log("path", path);
+        console.log("name", name);
+      });
 
       return (
-        <Route key={index} element={<Layout/>}>
-          {subRoutes.map(({component: Component, path, name, isPublic}, index) => {
-            const isPublics : boolean = typeof isPublic === 'boolean' ? isPublic : false;
-            const componentFound = Component !== undefined;
-            if (!componentFound) return null;
+        <Route key={index} element={<Layout />}>
+          {subRoutes.map(
+            ({ component: Component, path, name, isPublic }, index) => {
+              const isPublics: boolean =
+                typeof isPublic === "boolean" ? isPublic : false;
+              const componentFound = Component !== undefined;
+              if (!componentFound) return null;
 
-            return (
-              (<Route key={index} element={<ProtectedRoute isPublic={isPublics} isAuthorized={isAuthorized}/>}>)
-                && Component
-                && path
-                && (<Route key={name} element={<Component/>} path={path}/>)
-                && (</Route>)
-            )
-          })}
+              return (
+                <Route
+                  key={index}
+                  element={
+                    <ProtectedRoute
+                      isPublic={isPublics}
+                      isAuthorized={isAuthorized}
+                    />
+                  }
+                >
+                  ) && Component && path && (
+                  <Route key={name} element={<Component />} path={path} />) && (
+                </Route>
+              );
+            },
+          )}
         </Route>
-      )
+      );
     });
-    console.log('layouts', layouts)
+    console.log("layouts", layouts);
     return (
       <Routes>
-        <>
-          {layouts}
-        </>
+        <>{layouts}</>
       </Routes>
     );
   };
-}
+};