diff --git a/frontend/src/concepts/pipelines/NoPipelineServer.tsx b/frontend/src/concepts/pipelines/NoPipelineServer.tsx index b9c42898f2..78062103b3 100644 --- a/frontend/src/concepts/pipelines/NoPipelineServer.tsx +++ b/frontend/src/concepts/pipelines/NoPipelineServer.tsx @@ -18,8 +18,12 @@ const NoPipelineServer: React.FC = ({ return ( = ({ } /> diff --git a/frontend/src/pages/modelServing/screens/projects/EmptyMultiModelServingCard.tsx b/frontend/src/pages/modelServing/screens/projects/EmptyMultiModelServingCard.tsx index 5fbd32eba2..8232e2bd28 100644 --- a/frontend/src/pages/modelServing/screens/projects/EmptyMultiModelServingCard.tsx +++ b/frontend/src/pages/modelServing/screens/projects/EmptyMultiModelServingCard.tsx @@ -61,8 +61,9 @@ const EmptyMultiModelServingCard: React.FC = ({ allowCr - Multiple models can be deployed from a single model server. Choose this option when you - have a large number of small models to deploy that can share server resources. + Multiple models can be deployed on one shared model server. Choose this option when you + want to deploy a number of small or medium-sized models that can share the server + resources. {allowCreate ? ( diff --git a/frontend/src/pages/modelServing/screens/projects/EmptySingleModelServingCard.tsx b/frontend/src/pages/modelServing/screens/projects/EmptySingleModelServingCard.tsx index 7226e1c5a0..45076e743a 100644 --- a/frontend/src/pages/modelServing/screens/projects/EmptySingleModelServingCard.tsx +++ b/frontend/src/pages/modelServing/screens/projects/EmptySingleModelServingCard.tsx @@ -67,8 +67,8 @@ const EmptySingleModelServingCard: React.FC = - Each model is deployed from its own model server. Choose this option when you have a small - number of large models to deploy. + Each model is deployed on its own model server. Choose this option when you want to deploy + a large model such as a large language model (LLM). {allowCreate ? ( diff --git a/frontend/src/pages/modelServing/screens/projects/ModelServingPlatform.tsx b/frontend/src/pages/modelServing/screens/projects/ModelServingPlatform.tsx index 17f58759e1..f91f056746 100644 --- a/frontend/src/pages/modelServing/screens/projects/ModelServingPlatform.tsx +++ b/frontend/src/pages/modelServing/screens/projects/ModelServingPlatform.tsx @@ -92,6 +92,42 @@ const ModelServingPlatform: React.FC = () => { } }; + const renderPlatformEmptyState = () => { + if (kServeEnabled || modelMeshEnabled) { + return ( + { + setPlatformSelected( + isProjectModelMesh ? ServingRuntimePlatform.MULTI : ServingRuntimePlatform.SINGLE, + ); + }} + /> + } + icon={isProjectModelMesh ? PlusCircleIcon : undefined} + /> + ); + } + + return ( + + ); + }; + return ( <> { id={ProjectSectionID.MODEL_SERVER} title={ProjectSectionTitles[ProjectSectionID.MODEL_SERVER]} actions={ - shouldShowPlatformSelection || platformError + shouldShowPlatformSelection || platformError || emptyModelServer ? undefined : [ { } description={ shouldShowPlatformSelection && emptyModelServer - ? 'Select the type of model serving platform to be used when deploying models in this project.' + ? 'Select the model serving type to be used when deploying models from this project.' : undefined } popover={ } @@ -137,7 +173,7 @@ const ModelServingPlatform: React.FC = () => { isEmpty={shouldShowPlatformSelection} loadError={platformError || servingRuntimeError || templateError} emptyState={ - kServeEnabled || modelMeshEnabled ? ( + kServeEnabled && modelMeshEnabled ? ( { variant="info" isInline isPlain - title="Your project can only support one platform" - > -

- Choose a platform that best fits your needs. Changes cannot be made once a model - has deployed. -

- + title="The model serving type can be changed until the first model is deployed from this project. After that, if you want to use a different model serving type, you must create a new project." + />
) : ( @@ -187,10 +218,7 @@ const ModelServingPlatform: React.FC = () => { } > {emptyModelServer ? ( - + renderPlatformEmptyState() ) : isProjectModelMesh ? ( ) : ( diff --git a/frontend/src/pages/modelServing/screens/projects/ModelServingPlatformSelect.tsx b/frontend/src/pages/modelServing/screens/projects/ModelServingPlatformSelect.tsx index 2b0ec4644a..82461f06a3 100644 --- a/frontend/src/pages/modelServing/screens/projects/ModelServingPlatformSelect.tsx +++ b/frontend/src/pages/modelServing/screens/projects/ModelServingPlatformSelect.tsx @@ -31,7 +31,7 @@ const ModelServingPlatformSelect: React.FC = ({ return ( - Select the type of model serving platform to be used when deploying models in this project. + Select the model serving type to be used when deploying models from this project. @@ -47,7 +47,7 @@ const ModelServingPlatformSelect: React.FC = ({ /> } title="Single-model serving platform" - description="Each model is deployed on its own model server. This platform works well for large models or models that need dedicated resources." + description="Each model is deployed on its own model server. Choose this option when you want to deploy a large model such as a large language model (LLM)." /> @@ -62,7 +62,7 @@ const ModelServingPlatformSelect: React.FC = ({ /> } title="Multi-model serving platform" - description="Multiple models can be deployed on a single-model server. This platform works well for sharing resources amongst deployed models" + description="Multiple models can be deployed on one shared model server. Choose this option when you want to deploy a number of small or medium-sized models that can share the server resources." /> @@ -70,8 +70,8 @@ const ModelServingPlatformSelect: React.FC = ({ {alertShown && ( setAlertShown(false)} />} /> diff --git a/frontend/src/pages/projects/screens/detail/data-connections/DataConnectionsList.tsx b/frontend/src/pages/projects/screens/detail/data-connections/DataConnectionsList.tsx index 95c599c9c6..87cf0a90e0 100644 --- a/frontend/src/pages/projects/screens/detail/data-connections/DataConnectionsList.tsx +++ b/frontend/src/pages/projects/screens/detail/data-connections/DataConnectionsList.tsx @@ -38,7 +38,7 @@ const DataConnectionsList: React.FC = () => { !isDataConnectionsEmpty && ( } @@ -67,7 +67,7 @@ const DataConnectionsList: React.FC = () => { emptyState={ { !isNotebooksEmpty && ( } @@ -68,7 +68,7 @@ const NotebookList: React.FC = () => { emptyState={ { sectionType={SectionType.setup} imgSrc={typedObjectImage(ProjectObjectType.dataConnection)} title="Data connections" - description="For projects that use very large data sets, you can use data connections to link your project to an object storage bucket." + description="You can add data connections to workbenches to connect your project to data inputs and object storage buckets. You can also use data connections to specify the location of your models during deployment." isOpen={open} onClick={() => navigate( diff --git a/frontend/src/pages/projects/screens/detail/overview/serverModels/PlatformSelectSection.tsx b/frontend/src/pages/projects/screens/detail/overview/serverModels/PlatformSelectSection.tsx index 71c3354993..a94235356c 100644 --- a/frontend/src/pages/projects/screens/detail/overview/serverModels/PlatformSelectSection.tsx +++ b/frontend/src/pages/projects/screens/detail/overview/serverModels/PlatformSelectSection.tsx @@ -12,7 +12,7 @@ const PlatformSelectSection: React.FC = () => ( style={{ paddingLeft: 'var(--pf-v5-global--spacer--md)' }} > - Select the type of model serving platform to be used when deploying models in this + Select the type of model serving platform to be used when deploying models from this project. @@ -26,7 +26,7 @@ const PlatformSelectSection: React.FC = () => ( diff --git a/frontend/src/pages/projects/screens/detail/overview/trainModels/NotebooksCard.tsx b/frontend/src/pages/projects/screens/detail/overview/trainModels/NotebooksCard.tsx index 052b98eab5..0acc7eb71f 100644 --- a/frontend/src/pages/projects/screens/detail/overview/trainModels/NotebooksCard.tsx +++ b/frontend/src/pages/projects/screens/detail/overview/trainModels/NotebooksCard.tsx @@ -95,6 +95,8 @@ const NotebooksCard: React.FC = () => { objectType={ProjectObjectType.notebook} sectionType={SectionType.training} title="Workbenches" + popoverHeaderContent="About workbenches" + popoverBodyContent="A workbench is an isolated area where you can work with models in your preferred IDE, such as a Jupyter notebook. You can add accelerators and data connections, create pipelines, and add cluster storage in your workbench." > { sectionType={SectionType.training} title="Workbenches" popoverHeaderContent="About workbenches" - popoverBodyContent="Creating a workbench allows you to add a Jupyter notebook to your project." + popoverBodyContent="A workbench is an isolated area where you can work with models in your preferred IDE, such as a Jupyter notebook. You can add accelerators and data connections, create pipelines, and add cluster storage in your workbench." > { return ( <> - - - - 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. - - - {notebooksLoaded && !notebooksError && notebooks.length > 0 ? ( - - If you’ve already created pipelines in a workbench, restart the workbench after - configuring the pipeline server to view your pipelines here. - - ) : null} - + + + Pipelines are platforms for building and deploying portable and scalable + machine-learning (ML) workflows. You can import a pipeline or create one in a + workbench. Before you can work with pipelines, you must first configure a pipeline + server in your project. + + + If you've already created pipelines in a workbench, restart the workbench after + configuring the pipeline server to view your pipelines here. + + {allowCreate ? ( @@ -198,7 +191,9 @@ const PipelinesCard: React.FC = () => { - Pipelines are machine-learning workflows that you can use to train your model. + Pipelines are platforms for building and deploying portable and scalable + machine-learning (ML) workflows. You can import a pipeline or create one in a + workbench. @@ -221,8 +216,8 @@ const PipelinesCard: React.FC = () => { title="Pipelines" popoverHeaderContent={pipelinesCount ? 'About pipelines' : undefined} popoverBodyContent={ - pipelinesCount - ? 'Standardize and automate machine learning workflows to enable you to further enhance and deploy your data science models.' + !pipelinesCount + ? 'Pipelines are platforms for building and deploying portable and scalable machine-learning (ML) workflows. You can import a pipeline or create one in a workbench.' : undefined } data-testid="section-pipelines" diff --git a/frontend/src/pages/projects/screens/detail/pipelines/PipelinesSection.tsx b/frontend/src/pages/projects/screens/detail/pipelines/PipelinesSection.tsx index d5ee7b9a7e..12a70e3d70 100644 --- a/frontend/src/pages/projects/screens/detail/pipelines/PipelinesSection.tsx +++ b/frontend/src/pages/projects/screens/detail/pipelines/PipelinesSection.tsx @@ -60,7 +60,7 @@ const PipelinesSection: React.FC = () => { installed ? ( } diff --git a/frontend/src/pages/projects/screens/detail/storage/StorageList.tsx b/frontend/src/pages/projects/screens/detail/storage/StorageList.tsx index 1f8ea8ce91..44ceaf67f3 100644 --- a/frontend/src/pages/projects/screens/detail/storage/StorageList.tsx +++ b/frontend/src/pages/projects/screens/detail/storage/StorageList.tsx @@ -35,7 +35,7 @@ const StorageList: React.FC = () => { popover={ } @@ -58,7 +58,7 @@ const StorageList: React.FC = () => { emptyState={