From 08c8250ee3b37b15cf0bf836c1cae5c6ca89ca41 Mon Sep 17 00:00:00 2001 From: Pushpa Padti <99261071+ppadti@users.noreply.github.com> Date: Thu, 10 Oct 2024 03:09:44 +0530 Subject: [PATCH] Update empty state of versions list and models lists (#3277) --- .../pages/modelRegistry/screens/ModelRegistry.tsx | 6 +----- .../screens/ModelVersions/ModelVersionListView.tsx | 12 ++++++++++-- .../screens/ModelVersions/ModelVersions.tsx | 3 +-- .../RegisteredModels/RegisteredModelListView.tsx | 10 +++++++--- 4 files changed, 19 insertions(+), 12 deletions(-) diff --git a/frontend/src/pages/modelRegistry/screens/ModelRegistry.tsx b/frontend/src/pages/modelRegistry/screens/ModelRegistry.tsx index 11b93ccd45..c7bcff2df2 100644 --- a/frontend/src/pages/modelRegistry/screens/ModelRegistry.tsx +++ b/frontend/src/pages/modelRegistry/screens/ModelRegistry.tsx @@ -3,7 +3,6 @@ import ApplicationsPage from '~/pages/ApplicationsPage'; import useRegisteredModels from '~/concepts/modelRegistry/apiHooks/useRegisteredModels'; import TitleWithIcon from '~/concepts/design/TitleWithIcon'; import { ProjectObjectType } from '~/concepts/design/utils'; -import { filterLiveModels } from '~/concepts/modelRegistry/utils'; import RegisteredModelListView from './RegisteredModels/RegisteredModelListView'; import ModelRegistrySelectorNavigator from './ModelRegistrySelectorNavigator'; import { modelRegistryUrl } from './routeUtils'; @@ -39,10 +38,7 @@ const ModelRegistry: React.FC = ({ ...pageProps }) => { provideChildrenPadding removeChildrenTopPadding > - + ); }; diff --git a/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersionListView.tsx b/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersionListView.tsx index b35266881b..72577c124e 100644 --- a/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersionListView.tsx +++ b/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersionListView.tsx @@ -31,6 +31,7 @@ import { } from '~/pages/modelRegistry/screens/routeUtils'; import { asEnumMember } from '~/utilities/utils'; import { ProjectObjectType, typedEmptyImage } from '~/concepts/design/utils'; +import { filterArchiveVersions, filterLiveVersions } from '~/concepts/modelRegistry/utils'; import ModelVersionsTable from './ModelVersionsTable'; type ModelVersionListViewProps = { @@ -41,11 +42,16 @@ type ModelVersionListViewProps = { }; const ModelVersionListView: React.FC = ({ - modelVersions: unfilteredModelVersions, + modelVersions, registeredModel: rm, isArchiveModel, refresh, }) => { + const unfilteredModelVersions = isArchiveModel + ? modelVersions + : filterLiveVersions(modelVersions); + + const archiveModelVersions = filterArchiveVersions(modelVersions); const navigate = useNavigate(); const { preferredModelRegistry } = React.useContext(ModelRegistrySelectorContext); @@ -88,10 +94,12 @@ const ModelVersionListView: React.FC = ({ )} description={`${rm?.name} has no registered versions. Register a version to this model.`} primaryActionText="Register new version" - secondaryActionText="View archived versions" primaryActionOnClick={() => { navigate(registerVersionForModelUrl(rm?.id, preferredModelRegistry?.metadata.name)); }} + secondaryActionText={ + archiveModelVersions.length !== 0 ? 'View archived versions' : undefined + } secondaryActionOnClick={() => { navigate(modelVersionArchiveUrl(rm?.id, preferredModelRegistry?.metadata.name)); }} diff --git a/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersions.tsx b/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersions.tsx index 283b37957f..5761fffaa5 100644 --- a/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersions.tsx +++ b/frontend/src/pages/modelRegistry/screens/ModelVersions/ModelVersions.tsx @@ -6,7 +6,6 @@ import ApplicationsPage from '~/pages/ApplicationsPage'; import useModelVersionsByRegisteredModel from '~/concepts/modelRegistry/apiHooks/useModelVersionsByRegisteredModel'; import useRegisteredModelById from '~/concepts/modelRegistry/apiHooks/useRegisteredModelById'; import { ModelRegistrySelectorContext } from '~/concepts/modelRegistry/context/ModelRegistrySelectorContext'; -import { filterLiveVersions } from '~/concepts/modelRegistry/utils'; import { ModelState } from '~/concepts/modelRegistry/types'; import { registeredModelArchiveDetailsUrl } from '~/pages/modelRegistry/screens/routeUtils'; import ModelVersionsTabs from './ModelVersionsTabs'; @@ -65,7 +64,7 @@ const ModelVersions: React.FC = ({ tab, ...pageProps }) => { registeredModel={rm} refresh={rmRefresh} mvRefresh={mvRefresh} - modelVersions={filterLiveVersions(modelVersions.items)} + modelVersions={modelVersions.items} /> )} diff --git a/frontend/src/pages/modelRegistry/screens/RegisteredModels/RegisteredModelListView.tsx b/frontend/src/pages/modelRegistry/screens/RegisteredModels/RegisteredModelListView.tsx index d8b0fe21b6..7816348b04 100644 --- a/frontend/src/pages/modelRegistry/screens/RegisteredModels/RegisteredModelListView.tsx +++ b/frontend/src/pages/modelRegistry/screens/RegisteredModels/RegisteredModelListView.tsx @@ -14,6 +14,7 @@ import { } from '~/pages/modelRegistry/screens/routeUtils'; import { asEnumMember } from '~/utilities/utils'; import { ProjectObjectType, typedEmptyImage } from '~/concepts/design/utils'; +import { filterArchiveModels, filterLiveModels } from '~/concepts/modelRegistry/utils'; import RegisteredModelTable from './RegisteredModelTable'; import RegisteredModelsTableToolbar from './RegisteredModelsTableToolbar'; @@ -23,14 +24,15 @@ type RegisteredModelListViewProps = { }; const RegisteredModelListView: React.FC = ({ - registeredModels: unfilteredRegisteredModels, + registeredModels, refresh, }) => { const navigate = useNavigate(); const { preferredModelRegistry } = React.useContext(ModelRegistrySelectorContext); const [searchType, setSearchType] = React.useState(SearchType.KEYWORD); const [search, setSearch] = React.useState(''); - + const unfilteredRegisteredModels = filterLiveModels(registeredModels); + const archiveRegisteredModels = filterArchiveModels(registeredModels); const searchTypes = React.useMemo(() => [SearchType.KEYWORD, SearchType.OWNER], []); if (unfilteredRegisteredModels.length === 0) { @@ -46,7 +48,9 @@ const RegisteredModelListView: React.FC = ({ )} description={`${preferredModelRegistry?.metadata.name} has no active registered models. Register a model in this registry, or select a different registry.`} primaryActionText="Register model" - secondaryActionText="View archived models" + secondaryActionText={ + archiveRegisteredModels.length !== 0 ? 'View archived models' : undefined + } primaryActionOnClick={() => { navigate(registerModelUrl(preferredModelRegistry?.metadata.name)); }}