From c8662317309c9606b7756983e69c14adf2294606 Mon Sep 17 00:00:00 2001 From: AlexSserb Date: Fri, 4 Jul 2025 21:12:01 +0400 Subject: [PATCH] fix: data loading after login fixed --- .../Cards/CardsDndColumn/hooks/useCardsDnd.tsx | 15 ++------------- src/features/authSlice.ts | 2 ++ src/hooks/useProjects.tsx | 9 +++++++-- src/pages/CardPage/ui/CardPage.tsx | 18 +++++++++++++----- src/pages/CardsPage/contexts/DndContext.tsx | 7 +++---- src/pages/CardsPage/ui/CardsPage.tsx | 11 ++++++++--- 6 files changed, 35 insertions(+), 27 deletions(-) diff --git a/src/components/Dnd/Cards/CardsDndColumn/hooks/useCardsDnd.tsx b/src/components/Dnd/Cards/CardsDndColumn/hooks/useCardsDnd.tsx index b53dac1..cf96f02 100644 --- a/src/components/Dnd/Cards/CardsDndColumn/hooks/useCardsDnd.tsx +++ b/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 = ({ - summariesRaw, - refetchSummaries, - }: Props) => { - const [summaries, setSummaries] = useState(summariesRaw); - - useEffect(() => { - setSummaries(summariesRaw); - }, [summariesRaw]); - +const useCardsDnd = ({ summaries, refetchSummaries }: Props) => { const recalculate = async (cardId: number) => { return CardService.recalculateCardPrice({ requestBody: { @@ -203,7 +193,6 @@ const useCardsDnd = ({ }; return { - summaries, onCardDragEnd, }; }; diff --git a/src/features/authSlice.ts b/src/features/authSlice.ts index 5dedbf2..adb391b 100644 --- a/src/features/authSlice.ts +++ b/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( action.payload.accessToken, ); + OpenAPI.TOKEN = action.payload.accessToken; state.accessToken = action.payload.accessToken; state.isAuthorized = true; state.role = role; diff --git a/src/hooks/useProjects.tsx b/src/hooks/useProjects.tsx index 0fe0dc8..e6c9f6d 100644 --- a/src/hooks/useProjects.tsx +++ b/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([]); + const authState = useSelector((state: RootState) => state.auth); const refetchProjects = () => { ProjectService.getProjects() @@ -14,8 +17,10 @@ const useProjects = () => { }; useEffect(() => { - refetchProjects(); - }, []); + if (authState.isAuthorized) { + refetchProjects(); + } + }, [authState.isAuthorized]); return { projects, diff --git a/src/pages/CardPage/ui/CardPage.tsx b/src/pages/CardPage/ui/CardPage.tsx index b89c566..c91a75d 100644 --- a/src/pages/CardPage/ui/CardPage.tsx +++ b/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 = ({ cardId }) => { const { setSelectedCard } = useCardPageContext(); + const authState = useSelector((state: RootState) => state.auth); + useEffect(() => { - CardService.getCardById({ cardId }).then(card => { - setSelectedCard(card); - }); - }, []); + if (authState.isAuthorized) { + CardService.getCardById({ cardId }).then(card => { + setSelectedCard(card); + }); + } + }, [authState.isAuthorized]); + return ; }; diff --git a/src/pages/CardsPage/contexts/DndContext.tsx b/src/pages/CardsPage/contexts/DndContext.tsx index cb8ff92..6e7e15a 100644 --- a/src/pages/CardsPage/contexts/DndContext.tsx +++ b/src/pages/CardsPage/contexts/DndContext.tsx @@ -17,21 +17,20 @@ type DndContextState = { const DndContext = createContext(undefined); type DndContextProps = { - summariesRaw: CardSummary[]; + summaries: CardSummary[]; refetchSummaries: () => void; } const useDndContextState = ({ - summariesRaw, + summaries, refetchSummaries, }: DndContextProps) => { const [dragState, setDragState] = useState(DragState.DRAG_ENDED); const { - summaries, onCardDragEnd, } = useCardsDnd({ - summariesRaw, + summaries, refetchSummaries, }); diff --git a/src/pages/CardsPage/ui/CardsPage.tsx b/src/pages/CardsPage/ui/CardsPage.tsx index 1b3ba0e..c27f955 100644 --- a/src/pages/CardsPage/ui/CardsPage.tsx +++ b/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.BOARD); useEffect(() => { - fetchSummaries(); - }, []); + if (authState.isAuthorized) { + fetchSummaries(); + } + }, [authState.isAuthorized]); const tableBody = useMemo(() => { return ( @@ -38,7 +43,7 @@ export const CardsPage: FC = () => { const boardsBody = useMemo(() => { return (