refactor: pull types call out of the main page (#7116)

* add compression and pull types call out of the main page

* fix enabled conditions

* [autofix.ci] apply automated fixes

* remove gzip

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

src/frontend/src/pages/AppInitPage/index.tsx

@@ -24,15 +24,10 @@ export function AppInitPage() {
   const { isFetched } = useGetAutoLogin({ enabled: isLoaded });
   useGetVersionQuery({ enabled: isFetched });
   useGetConfig({ enabled: isFetched });
-  const { isFetched: typesLoaded } = useGetTypes({ enabled: isFetched });
+  useGetGlobalVariables({ enabled: isFetched });
-  useGetGlobalVariables({ enabled: typesLoaded });
+  useGetTagsQuery({ enabled: isFetched });
-  useGetTagsQuery({ enabled: typesLoaded });
+  useGetFoldersQuery({ enabled: isFetched });
-  useGetFoldersQuery({
+  const { isFetched: isExamplesFetched } = useGetBasicExamplesQuery();
-    enabled: typesLoaded,
-  });
-  const { isFetched: isExamplesFetched } = useGetBasicExamplesQuery({
-    enabled: typesLoaded,
-  });
 
   useEffect(() => {
     if (isFetched) {
@@ -44,13 +39,13 @@ export function AppInitPage() {
     //need parent component with width and height
     <>
       {isLoaded ? (
-        (isLoading || !isFetched || !isExamplesFetched || !typesLoaded) && (
+        (isLoading || !isFetched || !isExamplesFetched) && (
           <LoadingPage overlay />
         )
       ) : (
         <CustomLoadingPage />
       )}
-      {isFetched && isExamplesFetched && typesLoaded && <Outlet />}
+      {isFetched && isExamplesFetched && <Outlet />}
     </>
   );
 }

src/frontend/src/pages/FlowPage/index.tsx

@@ -1,10 +1,12 @@
 import { SidebarProvider } from "@/components/ui/sidebar";
 import { useGetFlow } from "@/controllers/API/queries/flows/use-get-flow";
+import { useGetTypes } from "@/controllers/API/queries/flows/use-get-types";
 import { useCustomNavigate } from "@/customization/hooks/use-custom-navigate";
 import useSaveFlow from "@/hooks/flows/use-save-flow";
 import { useIsMobile } from "@/hooks/use-mobile";
 import { SaveChangesModal } from "@/modals/saveChangesModal";
 import useAlertStore from "@/stores/alertStore";
+import { useTypesStore } from "@/stores/typesStore";
 import { customStringify } from "@/utils/reactflowUtils";
 import { useEffect, useState } from "react";
 import { useBlocker, useParams } from "react-router-dom";
@@ -14,6 +16,11 @@ import Page from "./components/PageComponent";
 import { FlowSidebarComponent } from "./components/flowSidebarComponent";
 
 export default function FlowPage({ view }: { view?: boolean }): JSX.Element {
+  const types = useTypesStore((state) => state.types);
+
+  const { isFetched: typesLoaded } = useGetTypes({
+    enabled: Object.keys(types).length <= 0,
+  });
   const setCurrentFlow = useFlowsManagerStore((state) => state.setCurrentFlow);
   const currentFlow = useFlowStore((state) => state.currentFlow);
   const currentSavedFlow = useFlowsManagerStore((state) => state.currentFlow);