Merge pull request #2336 from avivtur/crash-tree-view

CNV-53452: VirtualMachines page crashes for nonpriv user when user hasn't created a project
kubevirt-ui · Jan 2, 2025 · eaffd1c · eaffd1c
2 parents 633009e + 0a2cc2f
commit eaffd1c
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 7 deletions.
diff --git a/src/views/virtualmachines/tree/VirtualMachineTreeView.tsx b/src/views/virtualmachines/tree/VirtualMachineTreeView.tsx
@@ -41,7 +41,8 @@ const VirtualMachineTreeView: FC<VirtualMachineTreeViewProps> = ({ children, onF
 
   const { featureEnabled: treeViewEnabled, loading } = useFeatures(TREE_VIEW);
 
-  const { loaded, loadError, selectedTreeItem, treeData, vms } = useTreeViewData(activeNamespace);
+  const { isSwitchDisabled, loaded, loadError, selectedTreeItem, treeData, vms } =
+    useTreeViewData(activeNamespace);
 
   const onSelect = useTreeViewSelect(onFilterChange, vms);
 
@@ -83,6 +84,7 @@ const VirtualMachineTreeView: FC<VirtualMachineTreeViewProps> = ({ children, onF
           >
             <TreeViewContent
               isOpen={isOpen}
+              isSwitchDisabled={isSwitchDisabled}
               loaded={loaded}
               onSelect={onSelect}
               selectedTreeItem={selectedTreeItem}

diff --git a/src/views/virtualmachines/tree/components/TreeViewContent.tsx b/src/views/virtualmachines/tree/components/TreeViewContent.tsx
@@ -19,6 +19,7 @@ import TreeViewToolbar from './TreeViewToolbar';
 
 type TreeViewContentProps = {
   isOpen: boolean;
+  isSwitchDisabled: boolean;
   loaded: boolean;
   onSelect: (_event: React.MouseEvent, treeViewItem: TreeViewDataItem) => void;
   selectedTreeItem: TreeViewDataItem;
@@ -28,6 +29,7 @@ type TreeViewContentProps = {
 
 const TreeViewContent: FC<TreeViewContentProps> = ({
   isOpen,
+  isSwitchDisabled,
   loaded,
   onSelect,
   selectedTreeItem,
@@ -37,6 +39,7 @@ const TreeViewContent: FC<TreeViewContentProps> = ({
   const { t } = useKubevirtTranslation();
   const [showAll, setShowAll] = useState<boolean>();
   const { filteredTreeData, onSearch } = UseFilteredTreeView(treeData, setShowAll);
+
   if (!isOpen) {
     return (
       <PanelToggleButton
@@ -46,6 +49,7 @@ const TreeViewContent: FC<TreeViewContentProps> = ({
       />
     );
   }
+
   return (
     <>
       <TreeViewToolbar
@@ -56,6 +60,7 @@ const TreeViewContent: FC<TreeViewContentProps> = ({
             toggleDrawer={toggleDrawer}
           />
         }
+        isSwitchDisabled={isSwitchDisabled}
         onSearch={onSearch}
       />
       <DrawerHead className="vms-tree-view__header-section">

diff --git a/src/views/virtualmachines/tree/components/TreeViewToolbar.tsx b/src/views/virtualmachines/tree/components/TreeViewToolbar.tsx
@@ -19,10 +19,15 @@ import { HIDE, SHOW, SHOW_EMPTY_PROJECTS_KEY, TREE_VIEW_SEARCH_ID } from '../uti
 
 type TreeViewToolbarProps = {
   closeComponent: ReactNode;
+  isSwitchDisabled: boolean;
   onSearch: (event: ChangeEvent<HTMLInputElement>) => void;
 };
 
-const TreeViewToolbar: FC<TreeViewToolbarProps> = ({ closeComponent, onSearch }) => {
+const TreeViewToolbar: FC<TreeViewToolbarProps> = ({
+  closeComponent,
+  isSwitchDisabled,
+  onSearch,
+}) => {
   const { t } = useKubevirtTranslation();
   const [showEmptyProjects, setShowEmptyProjects] = useLocalStorage(SHOW_EMPTY_PROJECTS_KEY, HIDE);
 
@@ -51,8 +56,9 @@ const TreeViewToolbar: FC<TreeViewToolbarProps> = ({ closeComponent, onSearch })
               </SplitItem>
               <SplitItem isFilled />
               <Switch
-                checked={showEmptyProjects === HIDE}
+                checked={!isSwitchDisabled && showEmptyProjects === HIDE}
                 className="vms-tree-view__toolbar-switch"
+                isDisabled={isSwitchDisabled}
                 isReversed
                 onChange={(_, checked) => setShowEmptyProjects(checked ? HIDE : SHOW)}
               />

diff --git a/src/views/virtualmachines/tree/hooks/useTreeViewData.ts b/src/views/virtualmachines/tree/hooks/useTreeViewData.ts
@@ -10,10 +10,10 @@ import { useK8sWatchResource, useK8sWatchResources } from '@openshift-console/dy
 import { TreeViewDataItem } from '@patternfly/react-core';
 import { OBJECTS_FETCHING_LIMIT } from '@virtualmachines/utils';
 
-import { createTreeViewData } from '../utils/utils';
+import { createTreeViewData, isSystemNamespace } from '../utils/utils';
 
 type UseTreeViewData = {
-  isAdmin: boolean;
+  isSwitchDisabled: boolean;
   loaded: boolean;
   loadError: any;
   selectedTreeItem: TreeViewDataItem;
@@ -66,8 +66,10 @@ export const useTreeViewData = (activeNamespace: string): UseTreeViewData => {
     [projectNames, memoizedVMs, activeNamespace, isAdmin, treeViewFoldersEnabled],
   );
 
+  const isSwitchDisabled = useMemo(() => projectNames.every(isSystemNamespace), [projectNames]);
+
   return {
-    isAdmin,
+    isSwitchDisabled,
     loaded:
       projectNamesLoaded &&
       (isAdmin

diff --git a/src/views/virtualmachines/tree/utils/utils.tsx b/src/views/virtualmachines/tree/utils/utils.tsx
@@ -189,7 +189,9 @@ export const createTreeViewData = (
 
   treeDataMap.value = treeViewDataMap;
 
-  return [[allNamespacesTreeItem] ?? treeViewData, getSelectedTreeItem()];
+  const tree = allNamespacesTreeItem ? [allNamespacesTreeItem] : treeViewData;
+
+  return [tree, getSelectedTreeItem()];
 };
 
 export const filterItems = (item: TreeViewDataItem, input: string) => {