menu

frontend/app/src/entities/branches/ui/branches-provider.tsx

@@ -6,15 +6,15 @@ import { findSelectedBranch } from "@/entities/branches/utils";
 import ErrorScreen from "@/shared/components/errors/error-screen";
 import { InfrahubLoading } from "@/shared/components/loading/infrahub-loading";
 import { ALERT_TYPES, Alert } from "@/shared/components/ui/alert";
-import { useSetAtom } from "jotai";
+import { useAtom } from "jotai";
 import React, { useEffect } from "react";
 import { useNavigate } from "react-router";
 import { toast } from "react-toastify";
 import { StringParam, useQueryParam } from "use-query-params";
 
 export const BranchesProvider = ({ children }: { children?: React.ReactNode }) => {
   const { data: branches, isPending, error } = useGetBranches();
-  const setCurrentBranch = useSetAtom(currentBranchAtom);
+  const [currentBranch, setCurrentBranch] = useAtom(currentBranchAtom);
   const [branchInQueryString] = useQueryParam(QSP.BRANCH, StringParam);
   const navigate = useNavigate();
 
@@ -42,7 +42,7 @@ export const BranchesProvider = ({ children }: { children?: React.ReactNode }) =
     setCurrentBranch(selectedBranch);
   }, [branches, branchInQueryString]);
 
-  if (isPending) {
+  if (isPending || !currentBranch) {
     return <InfrahubLoading>loading branches...</InfrahubLoading>;
   }
 

frontend/app/src/entities/tasks/domain/is-task-running-on-branch.query.ts

@@ -3,7 +3,7 @@ import { queryOptions } from "@tanstack/react-query";
 
 export const isTaskRunningOnBranchQueryOptions = (branch: string) => {
   return queryOptions({
-    queryKey: ["is-task-running", branch],
+    queryKey: [branch, "is-task-running"],
     queryFn: () => isTaskRunningOnBranch(branch),
   });
 };

frontend/app/src/shared/components/layout/menu-navigation/domain/get-menu.query.ts

@@ -0,0 +1,18 @@
+import { DEFAULT_BRANCH_NAME } from "@/config/constants";
+import { currentBranchAtom } from "@/entities/branches/stores";
+import { getMenu } from "@/shared/components/layout/menu-navigation/domain/get-menu";
+import { queryOptions, useQuery } from "@tanstack/react-query";
+import { useAtomValue } from "jotai";
+
+export function menuQueryOptions({ branchName }: { branchName: string }) {
+  return queryOptions({
+    queryKey: [branchName, "menu"],
+    queryFn: () => getMenu({ branchName }),
+  });
+}
+
+export function useMenu() {
+  const currentBranch = useAtomValue(currentBranchAtom);
+
+  return useQuery(menuQueryOptions({ branchName: currentBranch?.name ?? DEFAULT_BRANCH_NAME }));
+}

frontend/app/src/shared/components/layout/menu-navigation/domain/get-menu.ts

@@ -0,0 +1,18 @@
+import { apiClient } from "@/shared/api/rest/client";
+import { MenuData } from "@/shared/components/layout/menu-navigation/types";
+
+type GetMenu = ({ branchName }: { branchName: string }) => Promise<MenuData>;
+
+export const getMenu: GetMenu = async ({ branchName }) => {
+  const { data, error } = await apiClient.GET("/api/menu", {
+    params: {
+      query: {
+        branch: branchName,
+      },
+    },
+  });
+
+  if (error) throw error;
+
+  return data as MenuData;
+};

frontend/app/src/shared/components/layout/menu-navigation/menu-navigation.tsx

@@ -1,18 +1,17 @@
 import ErrorScreen from "@/shared/components/errors/error-screen";
 import { MenuSectionInternal } from "@/shared/components/layout/menu-navigation/components/menu-section-internal";
 import { MenuSectionObject } from "@/shared/components/layout/menu-navigation/components/menu-section-object";
-import { menuQueryOptions } from "@/shared/components/layout/menu-navigation/get-menu";
+import { useMenu } from "@/shared/components/layout/menu-navigation/domain/get-menu.query";
 import { Divider } from "@/shared/components/ui/divider";
 import { ScrollArea } from "@/shared/components/ui/scroll-area";
 import { Spinner } from "@/shared/components/ui/spinner";
-import { useQuery } from "@tanstack/react-query";
 
 export interface MenuNavigationProps {
   isCollapsed?: boolean;
 }
 
 export default function MenuNavigation({ isCollapsed }: MenuNavigationProps) {
-  const { data: menu, isPending, error } = useQuery(menuQueryOptions());
+  const { data: menu, isPending, error } = useMenu();
 
   if (isPending) return <Spinner className="grow mx-auto p-4" />;
   if (error) return <ErrorScreen message="Something went wrong when fetching the menu" />;

frontend/app/src/shared/components/search/search-actions.tsx

@@ -1,12 +1,11 @@
 import { IModelSchema, genericsState, schemaState } from "@/entities/schema/stores/schema.atom";
 import { constructPath } from "@/shared/api/rest/fetch";
-import { menuQueryOptions } from "@/shared/components/layout/menu-navigation/get-menu";
+import { useMenu } from "@/shared/components/layout/menu-navigation/domain/get-menu.query";
 import { MenuItem } from "@/shared/components/layout/menu-navigation/types";
 import { SearchAnywhereGroup } from "@/shared/components/search/search-anywhere-group";
 import { SearchAnywhereItem } from "@/shared/components/search/search-anywhere-item";
 import { Badge } from "@/shared/components/ui/badge";
 import { Icon } from "@iconify-icon/react";
-import { useQuery } from "@tanstack/react-query";
 import { useCommandState } from "cmdk";
 import { useAtomValue } from "jotai";
 import { useMemo } from "react";
@@ -17,7 +16,7 @@ export const SearchActions = () => {
   const generics = useAtomValue(genericsState);
   const models: IModelSchema[] = [...nodes, ...generics];
 
-  const { data: menuData, isPending, isError } = useQuery(menuQueryOptions());
+  const { data: menuData, isPending, isError } = useMenu();
 
   const menuItems = useMemo(() => {
     if (!menuData) return [];