[ACM-16080] Dynamic VM actions in search results and details page (stolostron#4145)

zlayne · web-flow · commit 3c8a1778f878 · 2024-12-16T23:52:22.000Z
* [ACM-16080] Dynamic VM actions in search results and details page

Signed-off-by: zlayne &lt;zlayne@redhat.com&gt;

* add test for detailspage

Signed-off-by: zlayne &lt;zlayne@redhat.com&gt;

---------

Signed-off-by: zlayne &lt;zlayne@redhat.com&gt;
diff --git a/frontend/src/routes/Search/Details/DetailsPage.test.tsx b/frontend/src/routes/Search/Details/DetailsPage.test.tsx
@@ -5,41 +5,13 @@
 import { render, screen, waitFor } from '@testing-library/react'
 import { MemoryRouter, Route, Routes } from 'react-router-dom-v5-compat'
 import { RecoilRoot } from 'recoil'
+import { settingsState } from '../../../atoms'
 import { nockGet, nockIgnoreApiPaths, nockIgnoreRBAC, nockPostRequest } from '../../../lib/nock-util'
 import { waitForNocks } from '../../../lib/test-util'
 import { NavigationPath } from '../../../NavigationPath'
 import Search from '../Search'
 import { getResourceParams } from './DetailsPage'
 
-jest.mock('react-router-dom-v5-compat', () => {
-  const originalModule = jest.requireActual('react-router-dom-v5-compat')
-  return {
-    __esModule: true,
-    ...originalModule,
-    useLocation: () => ({
-      pathname: '/multicloud/search/resources',
-      search:
-        '?cluster=local-cluster&kind=Pod&apiversion=v1&namespace=testNamespace&name=testLocalPod&_hubClusterResource=true',
-      state: {
-        from: '/multicloud/search',
-        fromSearch: '?filters={%22textsearch%22:%22kind%3APod%22}',
-      },
-    }),
-    useNavigate: () => jest.fn(),
-  }
-})
-Object.defineProperty(window, 'location', {
-  value: {
-    pathname: '/multicloud/search/resources',
-    search:
-      '?cluster=local-cluster&kind=Pod&apiversion=v1&namespace=testNamespace&name=testLocalPod&_hubClusterResource=true',
-    state: {
-      from: '/multicloud/search',
-      fromSearch: '?filters={%22textsearch%22:%22kind%3APod%2',
-    },
-  },
-})
-
 const mockLocalClusterPod = {
   kind: 'Pod',
   apiVersion: 'v1',
@@ -91,12 +63,47 @@ const mockLocalClusterPod = {
 
 describe('DetailsPage', () => {
   beforeEach(async () => {
+    // jest.resetAllMocks()
     nockIgnoreRBAC()
     nockIgnoreApiPaths()
   })
+  afterEach(() => {
+    jest.resetAllMocks()
+    // Object.defineProperty(window, 'location', {
+    //   value: {},
+    // })
+  })
   const metricNock = nockPostRequest('/metrics?search-details', {})
 
   it('should render local-cluster resource details correctly', async () => {
+    jest.mock('react-router-dom-v5-compat', () => {
+      const originalModule = jest.requireActual('react-router-dom-v5-compat')
+      return {
+        __esModule: true,
+        ...originalModule,
+        useLocation: () => ({
+          pathname: '/multicloud/search/resources',
+          search:
+            '?cluster=local-cluster&kind=Pod&apiversion=v1&namespace=testNamespace&name=testLocalPod&_hubClusterResource=true',
+          state: {
+            from: '/multicloud/search',
+            fromSearch: '?filters={%22textsearch%22:%22kind%3APod%22}',
+          },
+        }),
+        useNavigate: () => jest.fn(),
+      }
+    })
+    Object.defineProperty(window, 'location', {
+      value: {
+        pathname: '/multicloud/search/resources',
+        search:
+          '?cluster=local-cluster&kind=Pod&apiversion=v1&namespace=testNamespace&name=testLocalPod&_hubClusterResource=true',
+        state: {
+          from: '/multicloud/search',
+          fromSearch: '?filters={%22textsearch%22:%22kind%3APod%2',
+        },
+      },
+    })
     render(
       <RecoilRoot>
         <MemoryRouter initialEntries={[NavigationPath.resources]}>
@@ -148,4 +155,88 @@ describe('DetailsPage', () => {
     const res = getResourceParams()
     expect(res).toMatchSnapshot()
   })
+
+  it('should render VirtualMachine resource details correctly', async () => {
+    jest.mock('react-router-dom-v5-compat', () => {
+      const originalModule = jest.requireActual('react-router-dom-v5-compat')
+      return {
+        __esModule: true,
+        ...originalModule,
+        useLocation: () => ({
+          pathname: '/multicloud/search/resources',
+          search:
+            '?cluster=local-cluster&kind=VirtualMachine&apiversion=kubevirt.io/v1&namespace=openshift-cnv&name=test-vm&_hubClusterResource=true',
+          state: {
+            from: '/multicloud/search',
+            fromSearch: '?filters={%22textsearch%22:%22kind%3AVirtualMachine%22}',
+          },
+        }),
+        useNavigate: () => jest.fn(),
+      }
+    })
+    Object.defineProperty(window, 'location', {
+      value: {
+        pathname: '/multicloud/search/resources',
+        search:
+          '?cluster=local-cluster&kind=VirtualMachine&apiversion=kubevirt.io/v1&namespace=openshift-cnv&name=test-vm&_hubClusterResource=true',
+        state: {
+          from: '/multicloud/search',
+          fromSearch: '?filters={%22textsearch%22:%22kind%3AVirtualMachine%2',
+        },
+      },
+    })
+    render(
+      <RecoilRoot
+        initializeState={(snapshot) => {
+          snapshot.set(settingsState, { VIRTUAL_MACHINE_ACTIONS: 'enabled' })
+        }}
+      >
+        <MemoryRouter initialEntries={[NavigationPath.resources]}>
+          <Routes>
+            <Route path={`${NavigationPath.search}/*`} element={<Search />} />
+          </Routes>
+        </MemoryRouter>
+      </RecoilRoot>
+    )
+
+    // Wait for delete resource requests to finish
+    await waitForNocks([
+      metricNock,
+      nockGet({
+        apiVersion: 'kubevirt.io/v1',
+        kind: 'VirtualMachine',
+        metadata: {
+          creationTimestamp: '2024-10-02T20:02:14Z',
+          name: 'test-vm',
+          namespace: 'openshift-cnv',
+        },
+        spec: {
+          running: true,
+          template: {
+            metadata: {
+              creationTimestamp: null,
+            },
+            spec: {},
+          },
+          status: {
+            created: true,
+            desiredGeneration: 9,
+            observedGeneration: 9,
+            printableStatus: 'Running',
+            ready: true,
+            runStrategy: 'Always',
+          },
+        },
+      }),
+    ])
+
+    // Test that the component has rendered correctly with data
+    await waitFor(() =>
+      expect(
+        screen.getByRole('heading', {
+          name: /test-vm/i,
+        })
+      ).toBeTruthy()
+    )
+  })
 })
diff --git a/frontend/src/routes/Search/Details/DetailsPage.tsx b/frontend/src/routes/Search/Details/DetailsPage.tsx
@@ -167,33 +167,51 @@ export default function DetailsPage() {
       </DropdownItem>,
     ]
     if (vmActionsEnabled && kind.toLowerCase() === 'virtualmachine') {
+      const printableStatus = resource?.status?.printableStatus ?? ''
       actions.unshift(
         ...[
-          {
-            action: 'Start',
-            hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachines/${name}/start`,
-            managedPath: '/virtualmachines/start',
-          },
-          {
-            action: 'Stop',
-            hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachines/${name}/stop`,
-            managedPath: '/virtualmachines/stop',
-          },
+          printableStatus === 'Stopped'
+            ? {
+                action: 'Start',
+                hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachines/${name}/start`,
+                managedPath: '/virtualmachines/start',
+                isDisabled: [
+                  'Migrating',
+                  'Provisioning',
+                  'Running',
+                  'Starting',
+                  'Stopping',
+                  'Terminating',
+                  'Unknown',
+                ].includes(printableStatus),
+              }
+            : {
+                action: 'Stop',
+                hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachines/${name}/stop`,
+                managedPath: '/virtualmachines/stop',
+                isDisabled: ['Provisioning', 'Stopped', 'Stopping', 'Terminating', 'Unknown'].includes(printableStatus),
+              },
           {
             action: 'Restart',
             hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachines/${name}/restart`,
             managedPath: '/virtualmachines/restart',
+            isDisabled: ['Migrating', 'Provisioning', 'Stopped', 'Stopping', 'Terminating', 'Unknown'].includes(
+              printableStatus
+            ),
           },
-          {
-            action: 'Pause',
-            hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachineinstances/${name}/pause`,
-            managedPath: '/virtualmachineinstances/pause',
-          },
-          {
-            action: 'Unpause',
-            hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachineinstances/${name}/unpause`,
-            managedPath: '/virtualmachineinstances/unpause',
-          },
+          printableStatus === 'Paused'
+            ? {
+                action: 'Unpause',
+                hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachineinstances/${name}/unpause`,
+                managedPath: '/virtualmachineinstances/unpause',
+                isDisabled: printableStatus !== 'Paused',
+              }
+            : {
+                action: 'Pause',
+                hubPath: `/apis/subresources.kubevirt.io/v1/namespaces/${namespace}/virtualmachineinstances/${name}/pause`,
+                managedPath: '/virtualmachineinstances/pause',
+                isDisabled: printableStatus !== 'Running',
+              },
         ].map((action) => (
           <DropdownItem
             key={`${action.action}-vm-resource`}
@@ -208,6 +226,7 @@ export default function DetailsPage() {
                 t
               )
             }
+            isDisabled={action.isDisabled}
           >
             {t(`{{action}} {{resourceKind}}`, { action: action.action, resourceKind: kind })}
           </DropdownItem>
@@ -216,7 +235,7 @@ export default function DetailsPage() {
       )
     }
     return actions
-  }, [cluster, kind, name, namespace, isHubClusterResource, vmActionsEnabled, navigate, toast, t])
+  }, [resource, cluster, kind, name, namespace, isHubClusterResource, vmActionsEnabled, navigate, toast, t])
 
   return (
     <AcmPage
diff --git a/frontend/src/routes/Search/SearchResults/RelatedResults.tsx b/frontend/src/routes/Search/SearchResults/RelatedResults.tsx
@@ -10,10 +10,13 @@ import {
   StackItem,
 } from '@patternfly/react-core'
 import _ from 'lodash'
-import { useMemo } from 'react'
+import { useContext, useMemo } from 'react'
+import { useNavigate } from 'react-router-dom-v5-compat'
 import { useTranslation } from '../../../lib/acm-i18next'
 import { useRecoilValue, useSharedAtoms } from '../../../shared-recoil'
-import { AcmLoadingPage, AcmTable, compareStrings } from '../../../ui-components'
+import { AcmLoadingPage, AcmTable, AcmToastContext, compareStrings } from '../../../ui-components'
+import { useAllClusters } from '../../Infrastructure/Clusters/ManagedClusters/components/useAllClusters'
+import { getVirtualMachineRowActions } from '../../Infrastructure/VirtualMachines/utils'
 import { IDeleteExternalResourceModalProps } from '../components/Modals/DeleteExternalResourceModal'
 import { IDeleteModalProps } from '../components/Modals/DeleteResourceModal'
 import { convertStringToQuery, federatedErrorText } from '../search-helper'
@@ -33,6 +36,11 @@ export function RenderItemContent(
 ) {
   const { currentQuery, relatedKind, setDeleteResource, setDeleteExternalResource, hasFederatedError } = props
   const { t } = useTranslation()
+  const navigate = useNavigate()
+  const toast = useContext(AcmToastContext)
+  const allClusters = useAllClusters(true)
+  const { settingsState } = useSharedAtoms()
+  const vmActionsEnabled = useRecoilValue(settingsState)?.VIRTUAL_MACHINE_ACTIONS === 'enabled'
   const { useSearchResultLimit } = useSharedAtoms()
   const searchResultLimit = useSearchResultLimit()
   const rowActions = useGetRowActions(relatedKind, currentQuery, false, setDeleteResource, setDeleteExternalResource)
@@ -71,7 +79,23 @@ export function RenderItemContent(
       emptyState={undefined} // table only shown for kinds with related resources
       columns={colDefs}
       keyFn={(item: any) => item?._uid.toString() ?? `${item.name}-${item.namespace}-${item.cluster}`}
-      rowActions={rowActions}
+      rowActions={relatedKind.toLowerCase() !== 'virtualmachine' ? rowActions : undefined}
+      rowActionResolver={
+        // use the row action resolvers so we can dynamically display/enabled certain actions based on the resource status.
+        relatedKind.toLowerCase() === 'virtualmachine'
+          ? (item: any) =>
+              getVirtualMachineRowActions(
+                item,
+                allClusters,
+                setDeleteResource,
+                setDeleteExternalResource,
+                vmActionsEnabled,
+                toast,
+                navigate,
+                t
+              )
+          : undefined
+      }
     />
   )
 }
diff --git a/frontend/src/routes/Search/SearchResults/SearchResults.tsx b/frontend/src/routes/Search/SearchResults/SearchResults.tsx
