fix: handle current resource group using initial values in launchers

lablup · Oct 24, 2024 · 803b29d · 803b29d
1 parent 3e45cde
commit 803b29d
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 20 deletions.
diff --git a/react/src/components/ResourceAllocationFormItems.tsx b/react/src/components/ResourceAllocationFormItems.tsx
@@ -23,7 +23,7 @@ import {
   ImageEnvironmentFormInput,
 } from './ImageEnvironmentSelectFormItems';
 import InputNumberWithSlider from './InputNumberWithSlider';
-import ResourceGroupSelectForCurrentProject from './ResourceGroupSelectForCurrentProject';
+import ResourceGroupSelect from './ResourceGroupSelect';
 import ResourcePresetSelect from './ResourcePresetSelect';
 import { CaretDownOutlined } from '@ant-design/icons';
 import {
@@ -42,18 +42,19 @@ import React, { useEffect, useMemo } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 
 export const AUTOMATIC_DEFAULT_SHMEM = '64m';
-export const RESOURCE_ALLOCATION_INITIAL_FORM_VALUES = {
-  resource: {
-    cpu: 0,
-    mem: '0g',
-    shmem: '0g',
-    accelerator: 0,
-  },
-  num_of_sessions: 1,
-  cluster_mode: 'single-node',
-  cluster_size: 1,
-  enabledAutomaticShmem: true,
-};
+export const RESOURCE_ALLOCATION_INITIAL_FORM_VALUES: DeepPartial<ResourceAllocationFormValue> =
+  {
+    resource: {
+      cpu: 0,
+      mem: '0g',
+      shmem: '0g',
+      accelerator: 0,
+    },
+    num_of_sessions: 1,
+    cluster_mode: 'single-node',
+    cluster_size: 1,
+    enabledAutomaticShmem: true,
+  };
 
 export const isMinOversMaxValue = (min: number, max: number) => {
   return min >= max;
@@ -408,8 +409,8 @@ const ResourceAllocationFormItems: React.FC<
           },
         ]}
       >
-        {/* WARN: ResourceGroupSelectForCurrentProject component can not be controlled (no `value` props).  It uses global state */}
-        <ResourceGroupSelectForCurrentProject showSearch />
+        <ResourceGroupSelect projectName={currentProject.name} showSearch />
+        {/* <ResourceGroupSelectForCurrentProject showSearch /> */}
       </Form.Item>
 
       {enableResourcePresets ? (

diff --git a/react/src/components/ServiceLauncherPageContent.tsx b/react/src/components/ServiceLauncherPageContent.tsx
@@ -11,6 +11,7 @@ import {
 } from '../hooks';
 import { KnownAcceleratorResourceSlotName } from '../hooks/backendai';
 import { useSuspenseTanQuery, useTanMutation } from '../hooks/reactQueryAlias';
+import { useCurrentResourceGroupState } from '../hooks/useCurrentProject';
 import BAIModal, { DEFAULT_BAI_MODAL_Z_INDEX } from './BAIModal';
 import EnvVarFormList, { EnvVarFormListValue } from './EnvVarFormList';
 import Flex from './Flex';
@@ -145,6 +146,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
 
   const [form] = Form.useForm<ServiceLauncherFormValue>();
   const [wantToChangeResource, setWantToChangeResource] = useState(false);
+  const [currentGlobalResourceGroup, setCurrentGlobalResourceGroup] =
+    useCurrentResourceGroupState();
 
   const endpoint = useFragment(
     graphql`
@@ -578,6 +581,8 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
           // create service
           mutationToCreateService.mutate(values, {
             onSuccess: () => {
+              // After creating service, navigate to serving page and set current resource group
+              setCurrentGlobalResourceGroup(values.resourceGroup);
               // FIXME: temporally refer to mutate input to message
               message.success(
                 t('modelService.ServiceCreated', { name: values.serviceName }),
@@ -693,6 +698,7 @@ const ServiceLauncherPageContent: React.FC<ServiceLauncherPageContentProps> = ({
           },
         }),
         vFolderID: model ? model : undefined,
+        resourceGroup: currentGlobalResourceGroup,
       };
 
   return (

diff --git a/react/src/pages/SessionLauncherPage.tsx b/react/src/pages/SessionLauncherPage.tsx
@@ -48,7 +48,10 @@ import {
 } from '../hooks';
 import { useCurrentUserRole } from '../hooks/backendai';
 import { useSetBAINotification } from '../hooks/useBAINotification';
-import { useCurrentProjectValue } from '../hooks/useCurrentProject';
+import {
+  useCurrentProjectValue,
+  useCurrentResourceGroupState,
+} from '../hooks/useCurrentProject';
 import { useRecentSessionHistory } from '../hooks/useRecentSessionHistory';
 import { useThemeMode } from '../hooks/useThemeMode';
 // @ts-ignore
@@ -179,9 +182,11 @@ const SessionLauncherPage = () => {
   const mainContentDivRef = useAtomValue(mainContentDivRefState);
   const baiClient = useSuspendedBackendaiClient();
   const currentUserRole = useCurrentUserRole();
+  const [currentGlobalResourceGroup, setCurrentGlobalResourceGroup] =
+    useCurrentResourceGroupState();
 
   const [isStartingSession, setIsStartingSession] = useState(false);
-  const INITIAL_FORM_VALUES: SessionLauncherValue = useMemo(
+  const INITIAL_FORM_VALUES: DeepPartial<SessionLauncherFormValue> = useMemo(
     () => ({
       sessionType: 'interactive',
       // If you set `allocationPreset` to 'custom', `allocationPreset` is not changed automatically any more.
@@ -204,8 +209,12 @@ const SessionLauncherPage = () => {
         },
       }),
       ...RESOURCE_ALLOCATION_INITIAL_FORM_VALUES,
+      resourceGroup: currentGlobalResourceGroup || undefined,
     }),
-    [baiClient._config?.default_session_environment],
+    [
+      baiClient._config?.default_session_environment,
+      currentGlobalResourceGroup,
+    ],
   );
   const StepParam = withDefault(NumberParam, 0);
   const FormValuesParam = withDefault(JsonParam, INITIAL_FORM_VALUES);
@@ -525,8 +534,8 @@ const SessionLauncherPage = () => {
               });
           },
         );
-        // console.log('##', values.mounts);
-        // console.log(sessionInfo);
+        // After sending a create request, navigate to job page and set current resource group
+        setCurrentGlobalResourceGroup(values.resourceGroup);
         const backupTo = window.location.pathname + window.location.search;
         webuiNavigate(redirectTo || '/job');
         upsertNotification({