fix: login is working

ungdev · Nov 27, 2023 · a34acda · a34acda
1 parent 0caf185
commit a34acda
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 44 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -2,6 +2,7 @@ import StoreProvider from "@/store";
 import React from "react";
 import { Flip, ToastContainer } from "react-toastify";
 import "../../public/fontawesome/css/all.min.css";
+import Wrapper from "@/components/Wrapper";
 
 export const metadata = {
   charset: "utf-8",
@@ -26,7 +27,9 @@ export default function RootLayout({ children }: {
     <html lang="fr">
     <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
-    <StoreProvider>{children}</StoreProvider>
+    <StoreProvider>
+      <Wrapper>{children}</Wrapper>
+    </StoreProvider>
     <ToastContainer autoClose={3000} transition={Flip} hideProgressBar={true} pauseOnHover={true} />
     </body>
     </html>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -9,9 +9,6 @@ import Navbar from "@/components/navbar";
 import FontAwesome from "react-fontawesome";
 import { logout } from "@/reducers/login";
 import { Action } from "redux";
-import LoginRouter from "@/components/loginRouter";
-import Preparation from "./preparation/page";
-import { Route } from "react-router";
 
 moment.locale("fr");
 
@@ -24,33 +21,6 @@ const App = () => {
           <FontAwesome name="sign-out-alt" /> Déconnexion
         </div>
       </Navbar>
-      <LoginRouter>
-        <Route path="/preparation" component={Preparation} />
-        {/*<Route exact path="/" component={Index} />
-        <Route path="/sell" component={Sell} />
-        <Route path="/tv" component={Tv} />
-        <Route path="/items" component={Items} />*/}
-      </LoginRouter>
-      {/* <div id="index">
-        <div onClick={() => history.push('/sell?except=goodies')}>
-          <FontAwesome name="hamburger" /> Vente de bouffe
-        </div>
-        <div onClick={() => history.push('/sell?only=goodies')}>
-          <FontAwesome name="tshirt" /> Vente de goodies
-        </div>
-        <div onClick={() => history.push('/preparation')}>
-          <FontAwesome name="check" /> Préparation générale
-        </div>
-        <div onClick={() => history.push('/preparation?only=pizzas')}>
-          <FontAwesome name="pizza-slice" /> Préparation des pizzas
-        </div>
-        <div onClick={() => history.push('/tv')}>
-          <FontAwesome name="tv" /> TV
-        </div>
-        <div onClick={() => history.push('/items')}>
-          <FontAwesome name="receipt" /> Gestion des items
-        </div>
-      </div> */}
     </>
   );
 };

diff --git a/src/app/sell/page.tsx b/src/app/sell/page.tsx
@@ -2,7 +2,6 @@
 import "../page.scss";
 import "./page.scss";
 import React from "react";
-//import queryString from "query-string";
 import ItemsGrid from "../../components/itemsGrid";
 import Navbar from "../../components/navbar";
 import PriceToogler from "../../components/priceToogler";
@@ -12,7 +11,6 @@ import { clearBasket } from "@/reducers/basket";
 import { State } from "@/types";
 import { setNormalPrice } from "@/reducers/orgaPrice";
 import { useSearchParams } from "next/navigation";
-//import Categories from "@/reducers/categories";
 
 /**
  * /sell

diff --git a/src/components/loginRouter.tsx → src/components/Wrapper.tsx b/src/components/loginRouter.tsx → src/components/Wrapper.tsx
@@ -1,14 +1,29 @@
-import React, { ReactNode, useEffect } from 'react';
+'use client';
+import { ReactNode, useEffect } from 'react';
+import { usePathname, useRouter } from 'next/navigation';
 import { useDispatch, useSelector } from 'react-redux';
-import Page from '@/app/login/page';
-import { autoLogin } from '@/reducers/login';
 import { State } from '@/types';
+
+import { autoLogin } from '@/reducers/login';
+import Page from '@/app/login/page';
+
 import Loader from './pageLoader';
-import { Action } from "redux";
+import { type Action } from '@reduxjs/toolkit';
 
-const LoginRouter = ({ children }: { children: ReactNode }) => {
+/**
+ * Wrapper component that provides common layout and functionality for all pages.
+ */
+export default function Wrapper({
+  children,
+}: {
+  /** The child components to be rendered within the layout. */
+  children: ReactNode;
+}) {
+  // Import necessary hooks and modules
   const dispatch = useDispatch();
   const state = useSelector((state: State) => state);
+  const pathname = usePathname();
+  const router = useRouter();
 
   useEffect(() => {
     dispatch(autoLogin() as unknown as Action);
@@ -28,9 +43,12 @@ const LoginRouter = ({ children }: { children: ReactNode }) => {
 
   if (state.login.loading) return <Loader />;
 
-  if (!state.login.token) return <Page />;
+  if (!state.login.token) router.push("/login");
+  else if (pathname.match("/login")) router.push("/")
 
-  return { children };
-};
 
-export default LoginRouter;
+  // Render the layout with child components
+  return (
+    children
+  );
+}
diff --git a/src/utils/api.ts b/src/utils/api.ts
@@ -8,7 +8,7 @@ const requestAPI = <T>(method: Method, route: string, body?: { [key: string]: un
   return new Promise<AxiosResponse<T>>((resolve, reject) => {
     axios
       .request<T>({
-        baseURL: process.env.REACT_APP_API_URI,
+        baseURL: "http://localhost:3001", //TODO env
         method,
         headers: {
           Authorization: token ? `Bearer ${token}` : undefined,

diff --git a/src/utils/socket.ts b/src/utils/socket.ts
@@ -10,7 +10,7 @@ let socket: ClientSocket | undefined = undefined;
 export const Socket = {
   connect: () => async (dispatch: Dispatch) => {
     if (!socket) {
-      socket = io(process.env.REACT_APP_API_URI);
+      socket = io("http://localhost:3001"); //TODO env
 
       socket.on('connect', () => dispatch(setSocketConnected()));