refactor: custom post loading and add AppAuthenticatedPage (#3632)

* Added post loading hook to appInitPage

* Removed custom post loading

* Changed custom post loading to cusotm post auth

* Adds AppAuthenticatedPage

* Uses AppAuthenticatedPage inside protected route

src/frontend/src/customization/hooks/use-custom-post-auth.ts

@@ -0,0 +1,16 @@
+import { UseRequestProcessor } from "@/controllers/API/services/request-processor";
+import { useQueryFunctionType } from "@/types/api";
+
+export const useCustomPostAuth: useQueryFunctionType<undefined, null> = (
+  options,
+) => {
+  const { query } = UseRequestProcessor();
+
+  const getPostAuthFn = async () => {
+    return null;
+  };
+
+  const queryResult = query(["usePostAuth"], getPostAuthFn, options);
+
+  return queryResult;
+};

src/frontend/src/pages/AppAuthenticatedPage/index.tsx

@@ -0,0 +1,8 @@
+import { useCustomPostAuth } from "@/customization/hooks/use-custom-post-auth";
+import { Outlet } from "react-router-dom";
+
+export function AppAuthenticatedPage() {
+  useCustomPostAuth();
+
+  return <Outlet />;
+}

src/frontend/src/routes.tsx

@@ -14,6 +14,7 @@ import ContextWrapper from "./contexts";
 import { CustomNavigate } from "./customization/components/custom-navigate";
 import { BASENAME } from "./customization/config-constants";
 import { ENABLE_CUSTOM_PARAM } from "./customization/feature-flags";
+import { AppAuthenticatedPage } from "./pages/AppAuthenticatedPage";
 import { AppInitPage } from "./pages/AppInitPage";
 import { AppWrapperPage } from "./pages/AppWrapperPage";
 import { DashboardWrapperPage } from "./pages/DashboardWrapperPage";
@@ -57,102 +58,112 @@ const router = createBrowserRouter(
               </ProtectedRoute>
             }
           >
-            <Route path="" element={<DashboardWrapperPage />}>
+            <Route path="" element={<AppAuthenticatedPage />}>
-              <Route path="" element={<HomePage />}>
+              <Route path="" element={<DashboardWrapperPage />}>
-                <Route index element={<CustomNavigate replace to={"all"} />} />
+                <Route path="" element={<HomePage />}>
-                <Route
-                  path="flows/"
-                  element={<MyCollectionComponent key="flows" type="flow" />}
-                >
                   <Route
-                    path="folder/:folderId"
+                    index
-                    element={<MyCollectionComponent key="flows" type="flow" />}
+                    element={<CustomNavigate replace to={"all"} />}
                   />
-                </Route>
-                <Route
-                  path="components/"
-                  element={
-                    <MyCollectionComponent key="components" type="component" />
-                  }
-                >
                   <Route
-                    path="folder/:folderId"
+                    path="flows/"
+                    element={<MyCollectionComponent key="flows" type="flow" />}
+                  >
+                    <Route
+                      path="folder/:folderId"
+                      element={
+                        <MyCollectionComponent key="flows" type="flow" />
+                      }
+                    />
+                  </Route>
+                  <Route
+                    path="components/"
                     element={
                       <MyCollectionComponent
                         key="components"
                         type="component"
                       />
                     }
-                  />
+                  >
-                </Route>
+                    <Route
-                <Route
+                      path="folder/:folderId"
-                  path="all/"
+                      element={
-                  element={<MyCollectionComponent key="all" type="all" />}
+                        <MyCollectionComponent
-                >
+                          key="components"
+                          type="component"
+                        />
+                      }
+                    />
+                  </Route>
                   <Route
-                    path="folder/:folderId"
+                    path="all/"
                     element={<MyCollectionComponent key="all" type="all" />}
-                  />
+                  >
+                    <Route
+                      path="folder/:folderId"
+                      element={<MyCollectionComponent key="all" type="all" />}
+                    />
+                  </Route>
+                </Route>
+                <Route path="settings" element={<SettingsPage />}>
+                  <Route
+                    index
+                    element={<CustomNavigate replace to={"general"} />}
+                  />
+                  <Route
+                    path="global-variables"
+                    element={<GlobalVariablesPage />}
+                  />
+                  <Route path="api-keys" element={<ApiKeysPage />} />
+                  <Route
+                    path="general/:scrollId?"
+                    element={
+                      <AuthSettingsGuard>
+                        <GeneralPage />
+                      </AuthSettingsGuard>
+                    }
+                  />
+                  <Route path="shortcuts" element={<ShortcutsPage />} />
+                  <Route path="messages" element={<MessagesPage />} />
                 </Route>
-              </Route>
-              <Route path="settings" element={<SettingsPage />}>
                 <Route
-                  index
+                  path="store"
-                  element={<CustomNavigate replace to={"general"} />}
-                />
-                <Route
-                  path="global-variables"
-                  element={<GlobalVariablesPage />}
-                />
-                <Route path="api-keys" element={<ApiKeysPage />} />
-                <Route
-                  path="general/:scrollId?"
                   element={
-                    <AuthSettingsGuard>
+                    <StoreGuard>
-                      <GeneralPage />
+                      <StorePage />
-                    </AuthSettingsGuard>
+                    </StoreGuard>
+                  }
+                />
+                <Route
+                  path="store/:id/"
+                  element={
+                    <StoreGuard>
+                      <StorePage />
+                    </StoreGuard>
+                  }
+                />
+                <Route path="account">
+                  <Route path="delete" element={<DeleteAccountPage />}></Route>
+                </Route>
+                <Route
+                  path="admin"
+                  element={
+                    <ProtectedAdminRoute>
+                      <AdminPage />
+                    </ProtectedAdminRoute>
                   }
                 />
-                <Route path="shortcuts" element={<ShortcutsPage />} />
-                <Route path="messages" element={<MessagesPage />} />
               </Route>
-              <Route
+              <Route path="flow/:id/">
-                path="store"
+                <Route path="" element={<DashboardWrapperPage />}>
-                element={
+                  <Route path="folder/:folderId/" element={<FlowPage />} />
-                  <StoreGuard>
+                  <Route path="" element={<FlowPage />} />
-                    <StorePage />
+                </Route>
-                  </StoreGuard>
+                <Route path="view" element={<ViewPage />} />
-                }
-              />
-              <Route
-                path="store/:id/"
-                element={
-                  <StoreGuard>
-                    <StorePage />
-                  </StoreGuard>
-                }
-              />
-              <Route path="account">
-                <Route path="delete" element={<DeleteAccountPage />}></Route>
               </Route>
-              <Route
+              <Route path="playground/:id/">
-                path="admin"
+                <Route path="" element={<PlaygroundPage />} />
-                element={
-                  <ProtectedAdminRoute>
-                    <AdminPage />
-                  </ProtectedAdminRoute>
-                }
-              />
-            </Route>
-            <Route path="flow/:id/">
-              <Route path="" element={<DashboardWrapperPage />}>
-                <Route path="folder/:folderId/" element={<FlowPage />} />
-                <Route path="" element={<FlowPage />} />
               </Route>
-              <Route path="view" element={<ViewPage />} />
-            </Route>
-            <Route path="playground/:id/">
-              <Route path="" element={<PlaygroundPage />} />
             </Route>
           </Route>
           <Route