(CONTROL_LOGIN_STATE);
const { login, isAuthenticated, setUserData } = useContext(AuthContext);
+ const setLoading = useAlertStore((state) => state.setLoading);
const { password, username } = inputState;
const setErrorData = useAlertStore((state) => state.setErrorData);
@@ -35,6 +36,10 @@ export default function LoginAdminPage() {
};
onLogin(user)
.then((user) => {
+ console.log("admin page");
+
+ setLoading(true);
+
login(user.access_token);
navigate("/admin/");
})
diff --git a/src/frontend/src/pages/LoginPage/index.tsx b/src/frontend/src/pages/LoginPage/index.tsx
index 826b2a931..d25d1c2e1 100644
--- a/src/frontend/src/pages/LoginPage/index.tsx
+++ b/src/frontend/src/pages/LoginPage/index.tsx
@@ -9,6 +9,7 @@ import { CONTROL_LOGIN_STATE } from "../../constants/constants";
import { AuthContext } from "../../contexts/authContext";
import { onLogin } from "../../controllers/API";
import useAlertStore from "../../stores/alertStore";
+import useFlowsManagerStore from "../../stores/flowsManagerStore";
import { LoginType } from "../../types/api";
import {
inputHandlerEventType,
@@ -23,6 +24,7 @@ export default function LoginPage(): JSX.Element {
const { login } = useContext(AuthContext);
const navigate = useNavigate();
const setErrorData = useAlertStore((state) => state.setErrorData);
+ const setLoading = useFlowsManagerStore((state) => state.setIsLoading);
function handleInput({
target: { name, value },
@@ -37,6 +39,9 @@ export default function LoginPage(): JSX.Element {
};
onLogin(user)
.then((user) => {
+ console.log("login page");
+
+ setLoading(true);
login(user.access_token);
navigate("/");
})
diff --git a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
index 17916f05b..b023216ab 100644
--- a/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/myCollectionComponent/components/headerTabsSearchComponent/index.tsx
@@ -1,39 +1,19 @@
import { useState } from "react";
-import { useLocation } from "react-router-dom";
-import useAlertStore from "../../../../../../stores/alertStore";
import useFlowsManagerStore from "../../../../../../stores/flowsManagerStore";
-import { useFolderStore } from "../../../../../../stores/foldersStore";
-import { handleDownloadFolderFn } from "../../../../utils/handle-download-folder";
import InputSearchComponent from "../inputSearchComponent";
import TabsSearchComponent from "../tabsComponent";
type HeaderTabsSearchComponentProps = {};
const HeaderTabsSearchComponent = ({}: HeaderTabsSearchComponentProps) => {
- const location = useLocation();
- const myCollectionId = useFolderStore((state) => state.myCollectionId);
- const folderId = location?.state?.folderId || myCollectionId;
const isLoading = useFlowsManagerStore((state) => state.isLoading);
const [tabActive, setTabActive] = useState("Flows");
- const setErrorData = useAlertStore((state) => state.setErrorData);
- const allFlows = useFlowsManagerStore((state) => state.allFlows);
const [inputValue, setInputValue] = useState("");
const setSearchFlowsComponents = useFlowsManagerStore(
(state) => state.setSearchFlowsComponents
);
- const handleDownloadFolder = () => {
- if (allFlows.length === 0) {
- setErrorData({
- title: "Folder is empty",
- list: [],
- });
- return;
- }
- handleDownloadFolderFn(folderId);
- };
-
return (
<>
diff --git a/src/frontend/src/pages/MainPage/hooks/use-delete-folder.tsx b/src/frontend/src/pages/MainPage/hooks/use-delete-folder.tsx
index 257f1b6d2..0d093bc32 100644
--- a/src/frontend/src/pages/MainPage/hooks/use-delete-folder.tsx
+++ b/src/frontend/src/pages/MainPage/hooks/use-delete-folder.tsx
@@ -2,11 +2,12 @@ import useAlertStore from "../../../stores/alertStore";
import { useFolderStore } from "../../../stores/foldersStore";
import { deleteFolder, getFolderById } from "../services";
-const useDeleteFolder = ({ navigate, getFoldersApi }) => {
+const useDeleteFolder = ({ navigate }) => {
const setSuccessData = useAlertStore((state) => state.setSuccessData);
const setErrorData = useAlertStore((state) => state.setErrorData);
const folderToEdit = useFolderStore((state) => state.folderToEdit);
const myCollectionId = useFolderStore((state) => state.myCollectionId);
+ const getFoldersApi = useFolderStore((state) => state.getFoldersApi);
const handleDeleteFolder = () => {
deleteFolder(folderToEdit?.id!)
diff --git a/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx b/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
index 0daa61257..39add5211 100644
--- a/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/pages/mainPage/index.tsx
@@ -25,16 +25,9 @@ export default function HomePage(): JSX.Element {
const [openFolderModal, setOpenFolderModal] = useState(false);
const [openDeleteFolderModal, setOpenDeleteFolderModal] = useState(false);
const is_component = pathname === "/components";
- const getFoldersApi = useFolderStore((state) => state.getFoldersApi);
const setFolderToEdit = useFolderStore((state) => state.setFolderToEdit);
const navigate = useNavigate();
- useEffect(() => {
- setTimeout(() => {
- getFoldersApi();
- }, 300);
- }, []);
-
useEffect(() => {
setCurrentFlowId("");
}, [pathname]);
@@ -45,7 +38,7 @@ export default function HomePage(): JSX.Element {
is_component,
});
- const { handleDeleteFolder } = useDeleteFolder({ navigate, getFoldersApi });
+ const { handleDeleteFolder } = useDeleteFolder({ navigate });
return (
<>
diff --git a/src/frontend/src/stores/foldersStore.tsx b/src/frontend/src/stores/foldersStore.tsx
index ce858c3be..8e42026b4 100644
--- a/src/frontend/src/stores/foldersStore.tsx
+++ b/src/frontend/src/stores/foldersStore.tsx
@@ -7,64 +7,100 @@ import {
} from "../pages/MainPage/services";
import { FoldersStoreType } from "../types/zustand/folders";
import useFlowsManagerStore from "./flowsManagerStore";
+import { useTypesStore } from "./typesStore";
export const useFolderStore = create((set, get) => ({
folders: [],
- getFoldersApi: (refetch = false) => {
+ getFoldersApi: (refetch = false, startupApplication: boolean = false) => {
return new Promise((resolve, reject) => {
if (get()?.folders.length === 0 || refetch === true) {
- get().setLoading(true);
+ get().setIsLoadingFolders(true);
getFolders().then(
- (res) => {
+ async (res) => {
const foldersWithoutStarterProjects = res?.filter(
- (folder) => folder.name !== STARTER_FOLDER_NAME,
+ (folder) => folder.name !== STARTER_FOLDER_NAME
);
const starterProjects = res?.find(
- (folder) => folder.name === STARTER_FOLDER_NAME,
+ (folder) => folder.name === STARTER_FOLDER_NAME
);
set({ starterProjectId: starterProjects!.id ?? "" });
set({ folders: foldersWithoutStarterProjects });
const myCollectionId = res?.find(
- (f) => f.name === DEFAULT_FOLDER,
+ (f) => f.name === DEFAULT_FOLDER
)?.id;
set({ myCollectionId });
- if (refetch === true) {
- useFlowsManagerStore.getState().refreshFlows();
- useFlowsManagerStore.getState().setAllFlows;
- }
+ const { refreshFlows } = useFlowsManagerStore.getState();
+ const { getTypes } = useTypesStore.getState();
+ const { setIsLoadingFolders } = get();
+
+ if (refetch) {
+ if (startupApplication) {
+ await refreshFlows();
+ await getTypes();
+ } else {
+ refreshFlows();
+ getTypes();
+ }
+ }
+ setIsLoadingFolders(false);
- get().setLoading(false);
resolve();
},
(error) => {
set({ folders: [] });
- get().setLoading(false);
+ get().setIsLoadingFolders(false);
reject(error);
- },
+ }
);
}
});
},
+ refreshFolders: () => {
+ return new Promise((resolve, reject) => {
+ getFolders().then(
+ async (res) => {
+ const foldersWithoutStarterProjects = res?.filter(
+ (folder) => folder.name !== STARTER_FOLDER_NAME
+ );
+
+ const starterProjects = res?.find(
+ (folder) => folder.name === STARTER_FOLDER_NAME
+ );
+
+ set({ starterProjectId: starterProjects!.id ?? "" });
+ set({ folders: foldersWithoutStarterProjects });
+
+ const myCollectionId = res?.find(
+ (f) => f.name === DEFAULT_FOLDER
+ )?.id;
+
+ set({ myCollectionId });
+
+ resolve();
+ },
+ (error) => {
+ set({ folders: [] });
+ get().setIsLoadingFolders(false);
+ reject(error);
+ }
+ );
+ });
+ },
setFolders: (folders) => set(() => ({ folders: folders })),
- loading: false,
- setLoading: (loading) => set(() => ({ loading: loading })),
+ isLoadingFolders: false,
+ setIsLoadingFolders: (isLoadingFolders) => set(() => ({ isLoadingFolders })),
getFolderById: (id) => {
if (id) {
- getFolderById(id).then(
- (res) => {
- const setAllFlows = useFlowsManagerStore.getState().setAllFlows;
- setAllFlows(res.flows);
- set({ selectedFolder: res });
- },
- () => {
- get().getFoldersApi(true);
- },
- );
+ getFolderById(id).then((res) => {
+ const setAllFlows = useFlowsManagerStore.getState().setAllFlows;
+ setAllFlows(res.flows);
+ set({ selectedFolder: res });
+ });
}
},
selectedFolder: null,
diff --git a/src/frontend/src/types/zustand/folders/index.ts b/src/frontend/src/types/zustand/folders/index.ts
index 5e41677b2..45c1e0bd9 100644
--- a/src/frontend/src/types/zustand/folders/index.ts
+++ b/src/frontend/src/types/zustand/folders/index.ts
@@ -2,10 +2,13 @@ import { FolderType } from "../../../pages/MainPage/entities";
export type FoldersStoreType = {
folders: FolderType[];
- getFoldersApi: (refetch?: boolean) => Promise;
+ getFoldersApi: (
+ refetch?: boolean,
+ startupApplication?: boolean
+ ) => Promise;
setFolders: (folders: FolderType[]) => void;
- loading: boolean;
- setLoading: (loading: boolean) => void;
+ isLoadingFolders: boolean;
+ setIsLoadingFolders: (isLoadingFolders: boolean) => void;
selectedFolder: FolderType | null;
getFolderById: (id: string) => void;
getMyCollectionFolder: () => void;
@@ -23,4 +26,5 @@ export type FoldersStoreType = {
setFolderIdDragging: (id: string) => void;
starterProjectId: string;
setStarterProjectId: (id: string) => void;
+ refreshFolders: () => void;
};