fix: data loading after login fixed

src/components/Dnd/Cards/CardsDndColumn/hooks/useCardsDnd.tsx

@@ -1,27 +1,17 @@
 import { modals } from "@mantine/modals";
 import { Flex } from "@mantine/core";
 import { DropResult } from "@hello-pangea/dnd";
-import { useEffect, useState } from "react";
 import { CardGroupService, CardService, CardSummary, CardSummaryReorderRequest } from "../../../../../client";
 import { notifications } from "../../../../../shared/lib/notifications.ts";
 import { dateWithoutTimezone } from "../../../../../shared/lib/date.ts";
 
 
 type Props = {
-    summariesRaw: CardSummary[];
+    summaries: CardSummary[];
     refetchSummaries: () => void;
 }
 
-const useCardsDnd = ({
+const useCardsDnd = ({ summaries, refetchSummaries }: Props) => {
-                         summariesRaw,
-                         refetchSummaries,
-                     }: Props) => {
-    const [summaries, setSummaries] = useState(summariesRaw);
-
-    useEffect(() => {
-        setSummaries(summariesRaw);
-    }, [summariesRaw]);
-
     const recalculate = async (cardId: number) => {
         return CardService.recalculateCardPrice({
             requestBody: {
@@ -203,7 +193,6 @@ const useCardsDnd = ({
     };
 
     return {
-        summaries,
         onCardDragEnd,
     };
 };

src/features/authSlice.ts

@@ -1,5 +1,6 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 import { jwtDecode, JwtPayload as JwtPayloadBase } from "jwt-decode";
+import { OpenAPI } from "../client";
 
 interface AuthState {
     isAuthorized: boolean;
@@ -38,6 +39,7 @@ const authSlice = createSlice({
                 const { sub, role } = jwtDecode<JwtPayload>(
                     action.payload.accessToken,
                 );
+                OpenAPI.TOKEN = action.payload.accessToken;
                 state.accessToken = action.payload.accessToken;
                 state.isAuthorized = true;
                 state.role = role;

src/hooks/useProjects.tsx

@@ -1,9 +1,12 @@
 import { useEffect, useState } from "react";
 import { type FullProjectSchema, ProjectService } from "../client";
+import { useSelector } from "react-redux";
+import { RootState } from "../redux/store.ts";
 
 
 const useProjects = () => {
     const [projects, setProjects] = useState<FullProjectSchema[]>([]);
+    const authState = useSelector((state: RootState) => state.auth);
 
     const refetchProjects = () => {
         ProjectService.getProjects()
@@ -14,8 +17,10 @@ const useProjects = () => {
     };
 
     useEffect(() => {
+        if (authState.isAuthorized) {
             refetchProjects();
-    }, []);
+        }
+    }, [authState.isAuthorized]);
 
     return {
         projects,

src/pages/CardPage/ui/CardPage.tsx

@@ -1,19 +1,27 @@
 import { useParams } from "@tanstack/react-router";
 import { CardPageContextProvider, useCardPageContext } from "../../CardsPage/contexts/CardPageContext.tsx";
-import ProductAndServiceTab from "../../../modules/cardModules/cardEditorTabs/ProductAndServiceTab/ProductAndServiceTab.tsx";
+import ProductAndServiceTab
+    from "../../../modules/cardModules/cardEditorTabs/ProductAndServiceTab/ProductAndServiceTab.tsx";
 import React, { FC, useEffect } from "react";
 import { CardService } from "../../../client";
+import { useSelector } from "react-redux";
+import { RootState } from "../../../redux/store.ts";
 
 export type Props = {
     cardId: number;
 };
 const CardPageContent: FC<Props> = ({ cardId }) => {
     const { setSelectedCard } = useCardPageContext();
+    const authState = useSelector((state: RootState) => state.auth);
+
     useEffect(() => {
+        if (authState.isAuthorized) {
             CardService.getCardById({ cardId }).then(card => {
                 setSelectedCard(card);
             });
-    }, []);
+        }
+    }, [authState.isAuthorized]);
+    
     return <ProductAndServiceTab />;
 };
 

src/pages/CardsPage/contexts/DndContext.tsx

@@ -17,21 +17,20 @@ type DndContextState = {
 const DndContext = createContext<DndContextState | undefined>(undefined);
 
 type DndContextProps = {
-    summariesRaw: CardSummary[];
+    summaries: CardSummary[];
     refetchSummaries: () => void;
 }
 
 const useDndContextState = ({
-                                summariesRaw,
+                                summaries,
                                 refetchSummaries,
                             }: DndContextProps) => {
     const [dragState, setDragState] = useState<DragState>(DragState.DRAG_ENDED);
 
     const {
-        summaries,
         onCardDragEnd,
     } = useCardsDnd({
-        summariesRaw,
+        summaries,
         refetchSummaries,
     });
 

src/pages/CardsPage/ui/CardsPage.tsx

@@ -17,17 +17,22 @@ import ProjectEditDrawer from "../drawers/ProjectEditDrawer/ProjectEditDrawer.ts
 import Boards from "../../../components/Dnd/Boards/Boards/Boards.tsx";
 import { DndContextProvider } from "../contexts/DndContext.tsx";
 import useCardSummaries from "../hooks/useCardSummaries.tsx";
+import { useSelector } from "react-redux";
+import { RootState } from "../../../redux/store.ts";
 
 export const CardsPage: FC = () => {
     const { form } = useCardsTableForm();
     const { dealId } = useParams({ strict: false });
     const { summaries, fetchSummaries } = useCardSummaries({ full: false });
+    const authState = useSelector((state: RootState) => state.auth);
 
     const [displayMode, setDisplayMode] = useState<DisplayMode>(DisplayMode.BOARD);
 
     useEffect(() => {
+        if (authState.isAuthorized) {
             fetchSummaries();
-    }, []);
+        }
+    }, [authState.isAuthorized]);
 
     const tableBody = useMemo(() => {
         return (
@@ -38,7 +43,7 @@ export const CardsPage: FC = () => {
     const boardsBody = useMemo(() => {
         return (
             <DndContextProvider
-                summariesRaw={summaries}
+                summaries={summaries}
                 refetchSummaries={fetchSummaries}
             >
                 <Boards />