Add InvalidArgoDeploymentAlert component to AppRoutes

Update link text in InvalidArgoDeploymentAlert component

frontend/src/app/AppRoutes.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Route, Routes } from 'react-router-dom';
+import { InvalidArgoDeploymentAlert } from '~/concepts/pipelines/content/InvalidArgoDeploymentAlert';
 import ApplicationsPage from '~/pages/ApplicationsPage';
 import UnauthorizedError from '~/pages/UnauthorizedError';
 import { useUser } from '~/redux/selectors';
@@ -66,6 +67,7 @@ const AppRoutes: React.FC = () => {
 
   return (
     <React.Suspense fallback={<ApplicationsPage title="" description="" loaded={false} empty />}>
+      <InvalidArgoDeploymentAlert />
       <Routes>
         <Route path="/" element={<InstalledApplications />} />
         <Route path="/explore" element={<ExploreApplications />} />

frontend/src/concepts/areas/types.ts

@@ -1,5 +1,10 @@
 import { EitherOrBoth } from '~/typeHelpers';
-import { DashboardCommonConfig } from '~/k8sTypes';
+import {
+  DashboardCommonConfig,
+  DashboardConfigKind,
+  DataScienceClusterInitializationKindStatus,
+  DataScienceClusterKindStatus,
+} from '~/k8sTypes';
 
 // TODO: clean up this definition / update the DashboardConfig to a better state
 export type FeatureFlag = keyof Omit<DashboardCommonConfig, 'modelMetricsNamespace'>;
@@ -12,6 +17,7 @@ export type IsAreaAvailableStatus = {
   reliantAreas: { [key in SupportedArea]?: boolean } | null; // only needs 1 to be true
   requiredComponents: { [key in StackComponent]?: boolean } | null;
   requiredCapabilities: { [key in StackCapability]?: boolean } | null;
+  customCondition: (conditionFunc: CustomConditionFunction) => boolean;
 };
 
 /** All areas that we need to support in some fashion or another */
@@ -72,6 +78,12 @@ export enum StackCapability {
   SERVICE_MESH_AUTHZ = 'CapabilityServiceMeshAuthorization',
 }
 
+export type CustomConditionFunction = (state: {
+  dashboardConfigSpec: DashboardConfigKind['spec'];
+  dscStatus: DataScienceClusterKindStatus | null;
+  dsciStatus: DataScienceClusterInitializationKindStatus | null;
+}) => boolean;
+
 // TODO: Support extra operators, like the pipelines operator -- maybe as a "external dependency need?"
 type SupportedComponentFlagValue = {
   /**

frontend/src/concepts/areas/utils.ts

@@ -99,5 +99,7 @@ export const isAreaAvailable = (
     featureFlags: featureFlagState,
     requiredComponents: requiredComponentsState,
     requiredCapabilities: requiredCapabilitiesState,
+    customCondition: (conditionFunc) =>
+      conditionFunc({ dashboardConfigSpec, dscStatus, dsciStatus }),
   };
 };

frontend/src/concepts/pipelines/content/InvalidArgoDeploymentAlert.tsx

@@ -0,0 +1,48 @@
+import { Alert, AlertActionCloseButton, AlertActionLink } from '@patternfly/react-core';
+import React from 'react';
+import { useBrowserStorage } from '~/components/browserStorage';
+import { useIsAreaAvailable, SupportedArea } from '~/concepts/areas';
+
+const INVALID_ARGO_DEPLOYMENT_DOCUMENTATION_URL = '';
+
+export const InvalidArgoDeploymentAlert: React.FC = () => {
+  const [invalidArgoDeploymentAlertDismissed, setInvalidArgoDeploymentAlertDismissed] =
+    useBrowserStorage('invalidArgoDeploymentAlertDismissed', false, true, true);
+
+  const showMessage =
+    useIsAreaAvailable(SupportedArea.DS_PIPELINES).customCondition(
+      ({ dscStatus }) =>
+        !!dscStatus?.conditions.some(
+          (c) => c.type === 'CapabilityDSPv2Argo' && c.status === 'False',
+        ),
+    ) && !invalidArgoDeploymentAlertDismissed;
+
+  if (!showMessage) {
+    return null;
+  }
+
+  return (
+    <Alert
+      actionLinks={
+        <AlertActionLink
+          component="a"
+          href={INVALID_ARGO_DEPLOYMENT_DOCUMENTATION_URL}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          View documentation
+        </AlertActionLink>
+      }
+      actionClose={
+        <AlertActionCloseButton onClose={() => setInvalidArgoDeploymentAlertDismissed(true)} />
+      }
+      isInline
+      variant="warning"
+      title="Data Science Pipelines enablement failed"
+    >
+      Data Science Pipelines could not be enabled because a version of Argo Workflow that is not
+      managed by Red Hat is installed on your cluster. To learn more, view the Red Hat Openshift AI
+      2.9 documentation.
+    </Alert>
+  );
+};