From 40d46a14020682f20de221a8e7bd30573a4b017b Mon Sep 17 00:00:00 2001
From: Alexander Petcoglo <mail@rckt.cc>
Date: Fri, 10 May 2024 19:12:02 +0300
Subject: [PATCH] add region and hardware title getters, fix pagination

---
 .../src/ui-helpers/getModelHardwareToolkit.ts        | 12 ++++++++++++
 .../src/ui-helpers/getModelRegionToolkit.ts          |  6 ++++++
 packages/design-system/src/ui-helpers/index.ts       |  2 ++
 .../toolkit/src/components/card-model/CardModel.tsx  |  7 +++----
 packages/toolkit/src/lib/generateRegionTitle.ts      |  3 ---
 .../src/view/model/ModelHubListPageMainView.tsx      |  6 +++---
 .../toolkit/src/view/model/ModelsListPagination.tsx  |  2 +-
 7 files changed, 27 insertions(+), 11 deletions(-)
 create mode 100644 packages/design-system/src/ui-helpers/getModelHardwareToolkit.ts
 create mode 100644 packages/design-system/src/ui-helpers/getModelRegionToolkit.ts
 delete mode 100644 packages/toolkit/src/lib/generateRegionTitle.ts

diff --git a/packages/design-system/src/ui-helpers/getModelHardwareToolkit.ts b/packages/design-system/src/ui-helpers/getModelHardwareToolkit.ts
new file mode 100644
index 000000000..da0f0dd63
--- /dev/null
+++ b/packages/design-system/src/ui-helpers/getModelHardwareToolkit.ts
@@ -0,0 +1,12 @@
+export const getModelHardwareToolkit = (hardwareName: string) => {
+  switch (hardwareName) {
+    case 'CPU':
+      return 'CPU';
+    case 'NVIDIA_TESLA_T4':
+      return 'Nvidia Tesla T4';
+    case 'NVIDIA_L4':
+      return 'Nvidia L4';
+    case 'NVIDIA_A100':
+      return 'Nvidia A100';
+  }
+}
\ No newline at end of file
diff --git a/packages/design-system/src/ui-helpers/getModelRegionToolkit.ts b/packages/design-system/src/ui-helpers/getModelRegionToolkit.ts
new file mode 100644
index 000000000..1d3077c63
--- /dev/null
+++ b/packages/design-system/src/ui-helpers/getModelRegionToolkit.ts
@@ -0,0 +1,6 @@
+export const getModelRegionToolkit = (regionName: string) => {
+  switch (regionName) {
+    case 'REGION_GCP_EUROPE_WEST4':
+      return 'GCP Europe-West4'
+  }
+}
\ No newline at end of file
diff --git a/packages/design-system/src/ui-helpers/index.ts b/packages/design-system/src/ui-helpers/index.ts
index 6e7dac445..756b282da 100644
--- a/packages/design-system/src/ui-helpers/index.ts
+++ b/packages/design-system/src/ui-helpers/index.ts
@@ -1,3 +1,5 @@
 export { getModelInstanceTaskToolkit } from "./getModelInstanceTaskToolkit";
 export { getModelDefinitionToolkit } from "./getModelDefinitionToolkit";
 export { getPipelineModeToolkit } from "./getPipelineModeToolkit";
+export { getModelRegionToolkit } from './getModelRegionToolkit';
+export { getModelHardwareToolkit } from './getModelHardwareToolkit';
\ No newline at end of file
diff --git a/packages/toolkit/src/components/card-model/CardModel.tsx b/packages/toolkit/src/components/card-model/CardModel.tsx
index b257dd4f5..0592c956b 100644
--- a/packages/toolkit/src/components/card-model/CardModel.tsx
+++ b/packages/toolkit/src/components/card-model/CardModel.tsx
@@ -5,9 +5,8 @@ import { Menu } from "./Menu";
 import { Tags } from "./Tags";
 import { Stats } from "./Stats";
 import { Model, Nullable, sendAmplitudeData, useAmplitudeCtx, useDeleteModel } from "../../lib";
-import { generateRegionTitle } from "../../lib/generateRegionTitle";
 import React from "react";
-import { useToast } from "@instill-ai/design-system";
+import { useToast, getModelHardwareToolkit, getModelRegionToolkit } from "@instill-ai/design-system";
 import axios from "axios";
 import { useParams } from "next/navigation";
 
@@ -91,8 +90,8 @@ export const CardModel = (props: CardModelProps) => {
           <a href={`/${entity}/models/${model.id}`} className="break-all text-semantic-accent-default hover:!underline font-medium">{model.id}</a>
           <Tags
             isPrivate={model.visibility === 'VISIBILITY_PRIVATE'}
-            region={generateRegionTitle(model.region)}
-            hardware={model.hardware}
+            region={getModelRegionToolkit(model.region)}
+            hardware={getModelHardwareToolkit(model.hardware)}
           />
           <Menu handleDeleteModel={handleDeleteModel} model={model} />
         </div>
diff --git a/packages/toolkit/src/lib/generateRegionTitle.ts b/packages/toolkit/src/lib/generateRegionTitle.ts
deleted file mode 100644
index 15e0ceacd..000000000
--- a/packages/toolkit/src/lib/generateRegionTitle.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export function generateRegionTitle(regionName: string) {
-  return regionName.slice(11).replaceAll('_', '-');
-}
\ No newline at end of file
diff --git a/packages/toolkit/src/view/model/ModelHubListPageMainView.tsx b/packages/toolkit/src/view/model/ModelHubListPageMainView.tsx
index 004e19e70..cf813e0bf 100644
--- a/packages/toolkit/src/view/model/ModelHubListPageMainView.tsx
+++ b/packages/toolkit/src/view/model/ModelHubListPageMainView.tsx
@@ -99,9 +99,9 @@ export const ModelHubListPageMainView = (
             </Select.Trigger>
             <Select.Content>
               <Select.Group>
-                <Select.Item value="VISIBILITY_UNSPECIFIED">All</Select.Item>
-                <Select.Item value="VISIBILITY_PUBLIC">Public</Select.Item>
-                <Select.Item value="VISIBILITY_PRIVATE">Private</Select.Item>
+                <Select.Item value="VISIBILITY_UNSPECIFIED" label="All" />
+                <Select.Item value="VISIBILITY_PUBLIC" label="Public" />
+                <Select.Item value="VISIBILITY_PRIVATE" label="Private" />
               </Select.Group>
             </Select.Content>
           </Select.Root>
diff --git a/packages/toolkit/src/view/model/ModelsListPagination.tsx b/packages/toolkit/src/view/model/ModelsListPagination.tsx
index 7064bb4e9..91bd5219e 100644
--- a/packages/toolkit/src/view/model/ModelsListPagination.tsx
+++ b/packages/toolkit/src/view/model/ModelsListPagination.tsx
@@ -40,7 +40,7 @@ export const ModelsListPagination = ({ models, pageNumber, setPageNumber }: Mode
     }
   }, [models, pageNumber])
 
-  if (!models.data || paginationProps.totalPages === 0) {
+  if (!models.data || paginationProps.totalPages <= 1) {
     return null;
   }