feat(FR-17): update desired_session_count field name to replicas (#…

…2963) ### This PR resolves [#2957](#2957) issue Since Backend.AI Core version 24.12.0, the desired_session_count field has been replaced with `replicas`. **Changes:** - Added `replicas` field to service creation and update interfaces - Deprecated `desired_session_count` field for manager version >= 24.12.0 - Updated GraphQL queries to handle both `desired_session_count` and `replicas` fields - Added version-based field selection using `@deprecatedSince` and `@since` directives - Added `replicas` feature flag check in client capabilities **How to test:** - Check whether `desired_session_count` or `replicas` is used when creating or modifying a service, depending on the manager version. (From 24.12.0 onwards, replicas is used.) - Check whether desired_session_count is displayed correctly on the Service page and Detail page.
lablup · Jan 14, 2025 · a84073a · a84073a
1 parent 1efdc0c
commit a84073a
Show file tree

Hide file tree

Showing 26 changed files with 182 additions and 159 deletions.
diff --git a/.cspell.json b/.cspell.json
@@ -36,7 +36,8 @@
     "Keypairs",
     "Hyperaccel",
     "Tensorboard",
-    "Automount"
+    "Automount",
+    "Talkativot"
   ],
   "flagWords": [
     "데이터레이크",

diff --git a/react/src/components/ServiceLauncherPageContent.tsx b/react/src/components/ServiceLauncherPageContent.tsx
@@ -88,7 +88,8 @@ interface ServiceCreateConfigType {
 }
 export interface ServiceCreateType {
   name: string;
-  desired_session_count: number;
+  desired_session_count?: number;
+  replicas?: number;
   image: string;
   runtime_variant: string;
   architecture: string;
@@ -106,7 +107,7 @@ export interface ServiceCreateType {
 interface ServiceLauncherInput extends ImageEnvironmentFormInput {
   serviceName: string;
   vFolderID: string;
-  desiredRoutingCount: number;
+  replicas: number;
   openToPublic: boolean;
   modelMountDestination: string;
   modelDefinitionPath: string;
@@ -153,7 +154,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
     graphql`
       fragment ServiceLauncherPageContentFragment on Endpoint {
         endpoint_id
-        desired_session_count
+        desired_session_count @deprecatedSince(version: "24.12.0")
+        replicas @since(version: "24.12.0")
         resource_group
         resource_slots
         resource_opts
@@ -264,7 +266,7 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
   const legacyMutationToUpdateService = useTanMutation({
     mutationFn: (values: ServiceLauncherFormValue) => {
       const body = {
-        to: values.desiredRoutingCount,
+        to: values.replicas,
       };
       return baiSignedRequestWithPromise({
         method: 'POST',
@@ -289,7 +291,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
       }
       const body: ServiceCreateType = {
         name: values.serviceName,
-        desired_session_count: values.desiredRoutingCount,
+        // REST API does not support `replicas` field. To use `replicas` field, we need `create_endpoint` mutation.
+        desired_session_count: values.replicas,
         ...getImageInfoFromInputInCreating(
           checkManualImageAllowed(
             baiClient._config.allow_manual_image_name_for_session,
@@ -407,7 +410,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
         msg
         endpoint {
           endpoint_id
-          desired_session_count
+          desired_session_count @deprecatedSince(version: "24.12.0")
+          replicas @since(version: "24.12.0")
           resource_group
           resource_slots
           resource_opts
@@ -500,7 +504,11 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
                       ? 'SINGLE_NODE'
                       : 'MULTI_NODE',
                   cluster_size: values.cluster_size,
-                  desired_session_count: values.desiredRoutingCount,
+                  ...(baiClient.supports('replicas')
+                    ? { replicas: values.replicas }
+                    : {
+                        desired_session_count: values.replicas,
+                      }),
                   ...getImageInfoFromInputInEditing(
                     checkManualImageAllowed(
                       baiClient._config.allow_manual_image_name_for_session,
@@ -643,7 +651,7 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
         serviceName: endpoint?.name,
         resourceGroup: endpoint?.resource_group,
         allocationPreset: 'custom',
-        desiredRoutingCount: endpoint?.desired_session_count ?? 1,
+        replicas: endpoint?.replicas ?? endpoint?.desired_session_count ?? 1,
         // FIXME: memory doesn't applied to resource allocation
         resource: {
           cpu: parseInt(JSON.parse(endpoint?.resource_slots || '{}')?.cpu),
@@ -692,7 +700,7 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
         // TODO: set mounts alias map according to extra_mounts if possible
       }
     : {
-        desiredRoutingCount: 1,
+        replicas: 1,
         runtimeVariant: 'custom',
         ...RESOURCE_ALLOCATION_INITIAL_FORM_VALUES,
         ...(baiClient._config?.default_session_environment && {
@@ -899,8 +907,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
                     </>
                   )}
                   <Form.Item
-                    label={t('modelService.DesiredRoutingCount')}
-                    name="desiredRoutingCount"
+                    label={t('modelService.NumberOfReplicas')}
+                    name={'replicas'}
                     rules={[
                       {
                         required: true,

diff --git a/react/src/components/ServiceValidationView.tsx b/react/src/components/ServiceValidationView.tsx
@@ -53,7 +53,11 @@ const ServiceValidationView: React.FC<ServiceValidationModalProps> = ({
       const image: string = `${values.environments.image?.registry}/${values.environments.image?.name}:${values.environments.image?.tag}`;
       const body: ServiceCreateType = {
         name: values.serviceName,
-        desired_session_count: values.desiredRoutingCount,
+        ...(baiClient.supports('replicas')
+          ? { replicas: values.replicas }
+          : {
+              desired_session_count: values.replicas,
+            }),
         image: image,
         runtime_variant: values.runtimeVariant,
         architecture: values.environments.image?.architecture as string,

diff --git a/react/src/pages/EndpointDetailPage.tsx b/react/src/pages/EndpointDetailPage.tsx
@@ -18,6 +18,7 @@ import {
   useWebUINavigate,
 } from '../hooks';
 import { useCurrentUserInfo } from '../hooks/backendai';
+import { useBAIPaginationOptionState } from '../hooks/reactPaginationQueryOptions';
 import { useTanMutation } from '../hooks/reactQueryAlias';
 import { isDestroyingStatus } from './EndpointListPage';
 import {
@@ -58,7 +59,7 @@ import { BotMessageSquareIcon } from 'lucide-react';
 import React, { Suspense, useState, useTransition } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLazyLoadQuery } from 'react-relay';
-import { useNavigate, useParams } from 'react-router-dom';
+import { useParams } from 'react-router-dom';
 
 interface RoutingInfo {
   route_id: string;
@@ -68,7 +69,8 @@ interface RoutingInfo {
 export interface ModelServiceInfo {
   endpoint_id: string;
   name: string;
-  desired_session_count: number;
+  desired_session_count?: number;
+  replicas?: number;
   active_routes: RoutingInfo[];
   service_endpoint: string;
   is_public: boolean;
@@ -91,12 +93,14 @@ const dayDiff = (a: any, b: any) => {
 const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
   const { t } = useTranslation();
   const { token } = theme.useToken();
-  const baiClient = useSuspendedBackendaiClient();
-  const navigate = useNavigate();
+  const { message } = App.useApp();
+  const { baiPaginationOption } = useBAIPaginationOptionState({
+    current: 1,
+    pageSize: 100,
+  });
   const { serviceId } = useParams<{
     serviceId: string;
   }>();
-
   const [fetchKey, updateFetchKey] = useUpdatableState('initial-fetch');
   const [isPendingRefetch, startRefetchTransition] = useTransition();
   const [isPendingClearError, startClearErrorTransition] = useTransition();
@@ -107,14 +111,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
   const [openChatModal, setOpenChatModal] = useState(false);
   const [currentUser] = useCurrentUserInfo();
   // const curProject = useCurrentProjectValue();
-  const [paginationState] = useState<{
-    current: number;
-    pageSize: number;
-  }>({
-    current: 1,
-    pageSize: 100,
-  });
-  const { message } = App.useApp();
+  const baiClient = useSuspendedBackendaiClient();
   const webuiNavigate = useWebUINavigate();
   const { open } = useFolderExplorerOpener();
   const [selectedSessionId, setSelectedSessionId] = useState<string>();
@@ -151,7 +148,8 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
               size_bytes
               supported_accelerators
             }
-            desired_session_count
+            desired_session_count @deprecatedSince(version: "24.12.0")
+            replicas @since(version: "24.12.0")
             url
             open_to_public
             errors {
@@ -207,9 +205,8 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
         }
       `,
       {
-        tokenListOffset:
-          (paginationState.current - 1) * paginationState.pageSize,
-        tokenListLimit: paginationState.pageSize,
+        tokenListOffset: baiPaginationOption.offset,
+        tokenListLimit: baiPaginationOption.limit,
         endpointId: serviceId || '',
       },
       {
@@ -297,8 +294,8 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
       children: <EndpointOwnerInfo endpointFrgmt={endpoint} />,
     },
     {
-      label: t('modelService.DesiredSessionCount'),
-      children: endpoint?.desired_session_count,
+      label: t('modelService.NumberOfReplicas'),
+      children: endpoint?.replicas ?? endpoint?.desired_session_count,
     },
     {
       label: t('modelService.ServiceEndpoint'),
@@ -443,7 +440,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
             title: t('modelService.Services'),
             onClick: (e) => {
               e.preventDefault();
-              navigate('/serving');
+              webuiNavigate('/serving');
             },
             href: '/serving',
           },
@@ -481,7 +478,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
             loading={isPendingRefetch}
             icon={<ReloadOutlined />}
             disabled={isDestroyingStatus(
-              endpoint?.desired_session_count,
+              endpoint?.replicas ?? endpoint?.desired_session_count,
               endpoint?.status,
             )}
             onClick={() => {
@@ -502,7 +499,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
             icon={<SettingOutlined />}
             disabled={
               isDestroyingStatus(
-                endpoint?.desired_session_count,
+                endpoint?.replicas ?? endpoint?.desired_session_count,
                 endpoint?.status,
               ) ||
               (!!endpoint?.created_user_email &&
@@ -532,7 +529,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
             type="primary"
             icon={<PlusOutlined />}
             disabled={isDestroyingStatus(
-              endpoint?.desired_session_count,
+              endpoint?.replicas ?? endpoint?.desired_session_count,
               endpoint?.status,
             )}
             onClick={() => {
@@ -618,7 +615,7 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
               icon={<SyncOutlined />}
               loading={mutationToSyncRoutes.isPending}
               disabled={isDestroyingStatus(
-                endpoint?.desired_session_count,
+                endpoint?.replicas ?? endpoint?.desired_session_count,
                 endpoint?.status,
               )}
               onClick={() => {
@@ -674,8 +671,8 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
                 row.status && (
                   <>
                     <Tag
-                      color={applyStatusColor(row.status)}
-                      key={row.status}
+                      color={applyStatusColor(row?.status)}
+                      key={row?.status}
                       style={{ marginRight: 0 }}
                     >
                       {row.status.toUpperCase()}