Merge pull request #2683 from jeff-phillips-18/RHOAIENG-4856

[RHOAIENG-4856] update warning in the project overview page
opendatahub-io · Apr 5, 2024 · 4d16058 · 4d16058
2 parents 7458216 + 77d23eb
commit 4d16058
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 50 deletions.
diff --git a/frontend/src/pages/projects/screens/detail/overview/serverModels/SelectMultiModelCard.tsx b/frontend/src/pages/projects/screens/detail/overview/serverModels/SelectMultiModelCard.tsx
@@ -18,7 +18,7 @@ const SelectMultiModelCard: React.FC = () => {
     <OverviewCard
       objectType={ProjectObjectType.modelServer}
       sectionType={SectionType.serving}
-      title="Mult-model serving platform"
+      title="Multi-model serving platform"
       data-testid="multi-serving-platform-card"
     >
       <CardBody>

diff --git a/frontend/src/pages/projects/screens/detail/overview/trainModels/PipelinesCard.tsx b/frontend/src/pages/projects/screens/detail/overview/trainModels/PipelinesCard.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import {
+  Alert,
   ButtonVariant,
   CardBody,
   CardFooter,
@@ -8,6 +9,7 @@ import {
   EmptyStateHeader,
   EmptyStateIcon,
   Spinner,
+  Stack,
   Text,
   TextContent,
 } from '@patternfly/react-core';
@@ -32,7 +34,10 @@ import MetricsContents from './MetricsContents';
 
 const PipelinesCard: React.FC = () => {
   const { pipelinesServer } = usePipelinesAPI();
-  const { currentProject } = React.useContext(ProjectDetailsContext);
+  const {
+    currentProject,
+    notebooks: { data: notebooks, loaded: notebooksLoaded, error: notebooksError },
+  } = React.useContext(ProjectDetailsContext);
   const [allowCreate] = useAccessReview({
     ...AccessReviewResource,
     namespace: currentProject.metadata.name,
@@ -134,12 +139,25 @@ const PipelinesCard: React.FC = () => {
       return (
         <>
           <CardBody>
-            <TextContent>
-              <Text component="small">
-                Pipelines are machine-learning workflows that you can use to train your model. To
-                create or import pipelines, you must first configure a pipeline server.
-              </Text>
-            </TextContent>
+            <Stack hasGutter>
+              <TextContent>
+                <Text component="small">
+                  Pipelines are machine-learning workflows that you can use to train your model. To
+                  create or import pipelines, you must first configure a pipeline server.
+                </Text>
+              </TextContent>
+              {notebooksLoaded && !notebooksError && notebooks.length > 0 ? (
+                <Alert
+                  isInline
+                  isPlain
+                  variant="warning"
+                  title="Restart running workbenches after configuring the pipeline server"
+                >
+                  If you’ve already created pipelines in a workbench, restart the workbench after
+                  configuring the pipeline server to view your pipelines here.
+                </Alert>
+              ) : null}
+            </Stack>
           </CardBody>
           <CardFooter>
             {allowCreate ? (

diff --git a/frontend/src/pages/projects/screens/detail/overview/trainModels/TrainModelsSection.tsx b/frontend/src/pages/projects/screens/detail/overview/trainModels/TrainModelsSection.tsx
@@ -1,56 +1,15 @@
 import * as React from 'react';
-import { Alert, AlertActionCloseButton, ButtonVariant, Gallery } from '@patternfly/react-core';
-import { CreatePipelineServerButton, usePipelinesAPI } from '~/concepts/pipelines/context';
-import { ProjectDetailsContext } from '~/pages/projects/ProjectDetailsContext';
-import { useAccessReview } from '~/api';
-import { AccessReviewResource } from '~/pages/projects/screens/detail/const';
+import { Gallery } from '@patternfly/react-core';
 import CollapsibleSection from '~/concepts/design/CollapsibleSection';
 import { SupportedArea, useIsAreaAvailable } from '~/concepts/areas';
 import PipelinesCard from './PipelinesCard';
 import NotebooksCard from './NotebooksCard';
 
 const TrainModelsSection: React.FC = () => {
   const pipelinesEnabled = useIsAreaAvailable(SupportedArea.DS_PIPELINES).status;
-  const { pipelinesServer } = usePipelinesAPI();
-  const { currentProject } = React.useContext(ProjectDetailsContext);
-  const [allowCreate] = useAccessReview({
-    ...AccessReviewResource,
-    namespace: currentProject.metadata.name,
-  });
-  const [alertClosed, setAlertClosed] = React.useState<boolean>(false);
-
-  const alert = React.useMemo(() => {
-    if (!pipelinesEnabled || pipelinesServer.initializing || pipelinesServer.installed) {
-      return null;
-    }
-    return (
-      <Alert
-        isInline
-        variant="warning"
-        title="Optional: Configure a pipeline server"
-        actionClose={<AlertActionCloseButton onClose={() => setAlertClosed(true)} />}
-        actionLinks={
-          allowCreate ? (
-            <CreatePipelineServerButton
-              variant={ButtonVariant.link}
-              isInline
-              title="Configure pipeline server"
-            />
-          ) : undefined
-        }
-        style={{ marginBottom: 'var(--pf-v5-global--spacer--md)' }}
-      >
-        <p>
-          If you plan to use pipelines in your workbench, you must configure the pipeline server
-          before you start the workbench.
-        </p>
-      </Alert>
-    );
-  }, [pipelinesEnabled, pipelinesServer.initializing, pipelinesServer.installed, allowCreate]);
 
   return (
     <CollapsibleSection title="Train models">
-      {!pipelinesServer.installed && !alertClosed ? alert : null}
       <Gallery
         hasGutter
         minWidths={{ default: '100%', lg: pipelinesEnabled ? 'calc(50% - 1rem / 2)' : '100%' }}