[ACM-15258] Update VM page error message (stolostron#4147)

* [ACM-15258] Update VM page error message

Signed-off-by: zlayne <zlayne@redhat.com>

* update string

Signed-off-by: zlayne <zlayne@redhat.com>

* re-add strings

Signed-off-by: zlayne <zlayne@redhat.com>

* update test

Signed-off-by: zlayne <zlayne@redhat.com>

---------

Signed-off-by: zlayne <zlayne@redhat.com>

Author: zlayne

frontend/public/locales/en/translation.json

@@ -1273,7 +1273,6 @@
   "Enable Observability to see more metrics": "Enable Observability to see more metrics",
   "Enable policies": "Enable policies",
   "Enable search to display application statuses properly.": "Enable search to display application statuses properly.",
-  "Enable search to view all managed VirtualMachines.": "Enable search to view all managed VirtualMachines.",
   "Enable this option to instruct Submariner not to access any external servers for public IP resolution.": "Enable this option to instruct Submariner not to access any external servers for public IP resolution.",
   "Enable this option to use a custom Submariner subscription.": "Enable this option to use a custom Submariner subscription.",
   "enabled": "Enabled",
@@ -2959,6 +2958,7 @@
   "To run automation manually, select \"Disabled\" and check the \"Manual run\" checkbox.)": "To run automation manually, select \"Disabled\" and check the \"Manual run\" checkbox.)",
   "To search for a keyword, type the word in the search box.": "To search for a keyword, type the word in the search box.",
   "To search for resources with a given property value, type or select the property name from the autocomplete list. Then type or select the value for the selected property filter.": "To search for resources with a given property value, type or select the property name from the autocomplete list. Then type or select the value for the selected property filter.",
+  "To view managed virtual machines, you must enable Search for Red Hat Advanced Cluster Management.": "To view managed virtual machines, you must enable Search for Red Hat Advanced Cluster Management.",
   "Toggle details": "Toggle details",
   "Tolerations": "Tolerations",
   "tolerations.count": "{{count}} toleration",
@@ -3065,7 +3065,7 @@
   "Unable to communicate with the server because the network connection was reset.": "Unable to communicate with the server because the network connection was reset.",
   "Unable to communicate with the server because the service is unavailable.": "Unable to communicate with the server because the service is unavailable.",
   "Unable to communicate with the server due to a gateway timeout.": "Unable to communicate with the server due to a gateway timeout.",
-  "Unable to display VirtualMachines": "Unable to display VirtualMachines",
+  "Unable to display virtual machines": "Unable to display virtual machines",
   "Unable to update the resource because of a resource conflict.": "Unable to update the resource because of a resource conflict.",
   "Unauthorized": "Unauthorized",
   "Unauthorized to execute this action.": "Unauthorized to execute this action.",

frontend/src/routes/Infrastructure/VirtualMachines/VirtualMachinesPage.test.tsx

@@ -233,8 +233,14 @@ describe('VirtualMachinesPage Page', () => {
     // This wait pauses till apollo query is returning data
     await wait()
     // Test that the component has rendered errors correctly
-    await waitFor(() => expect(screen.queryByText('Unable to display VirtualMachines')).toBeTruthy())
-    await waitFor(() => expect(screen.queryByText('Enable search to view all managed VirtualMachines.')).toBeTruthy())
+    await waitFor(() => expect(screen.queryByText('Unable to display virtual machines')).toBeTruthy())
+    await waitFor(() =>
+      expect(
+        screen.queryByText(
+          'To view managed virtual machines, you must enable Search for Red Hat Advanced Cluster Management.'
+        )
+      ).toBeTruthy()
+    )
   })
 
   it('should render page with errors', async () => {

frontend/src/routes/Infrastructure/VirtualMachines/VirtualMachinesPage.tsx

@@ -4,12 +4,12 @@ import { getCurrentClusterVersion, getMajorMinorVersion } from '@openshift-assis
 import {
   EmptyState,
   EmptyStateBody,
+  EmptyStateHeader,
   EmptyStateIcon,
   PageSection,
   Stack,
   StackItem,
   TextVariants,
-  EmptyStateHeader,
   Title,
 } from '@patternfly/react-core'
 import { ExclamationCircleIcon, ExternalLinkAltIcon } from '@patternfly/react-icons'
@@ -18,6 +18,7 @@ import { useNavigate } from 'react-router-dom-v5-compat'
 import { Pages, usePageVisitMetricHandler } from '../../../hooks/console-metrics'
 import { useTranslation } from '../../../lib/acm-i18next'
 import { OCP_DOC } from '../../../lib/doc-util'
+import { PluginContext } from '../../../lib/PluginContext'
 import { useRecoilValue, useSharedAtoms } from '../../../shared-recoil'
 import {
   AcmButton,
@@ -47,7 +48,6 @@ import { useSearchDefinitions } from '../../Search/searchDefinitions'
 import { ISearchResult } from '../../Search/SearchResults/utils'
 import { useAllClusters } from '../Clusters/ManagedClusters/components/useAllClusters'
 import { getVirtualMachineRowActions } from './utils'
-import { PluginContext } from '../../../lib/PluginContext'
 
 function VirtualMachineTable() {
   const { t } = useTranslation()
@@ -93,7 +93,7 @@ function VirtualMachineTable() {
     if (error) {
       return []
     } else if (loading) {
-      return undefined
+      return undefined // undefined items triggers loading state table
     }
     // combine VMI node & ip address data in VM object
     const reducedVMAndVMI = data?.searchResult?.[0]?.items?.reduce((acc, curr) => {
@@ -144,11 +144,13 @@ function VirtualMachineTable() {
         <EmptyState>
           <EmptyStateIcon icon={ExclamationCircleIcon} color={'var(--pf-global--danger-color--100)'} />
           <Title size="lg" headingLevel="h4">
-            {t('Unable to display VirtualMachines')}
+            {t('Unable to display virtual machines')}
           </Title>
           <EmptyStateBody>
             <Stack>
-              <StackItem>{t('Enable search to view all managed VirtualMachines.')}</StackItem>
+              <StackItem>
+                {t('To view managed virtual machines, you must enable Search for Red Hat Advanced Cluster Management.')}
+              </StackItem>
             </Stack>
           </EmptyStateBody>
         </EmptyState>