refactor: size unit convert functions (#2859)

Refactors binary and decimal size unit conversion functions

This PR renames `iSizeToSize` to `convertBinarySizeUnit` and adds a new `convertDecimalSizeUnit` function to clearly distinguish between binary (1024-based) and decimal (1000-based) size unit conversions. The changes improve code readability and maintainability by:

- Renaming `iSizeToSize` to the more descriptive `convertBinarySizeUnit`
- Adding `convertDecimalSizeUnit` for 1000-based conversions
- Introducing a shared internal `convertSizeUnit` function
- Adding comprehensive unit tests for both conversion methods
- Adding support for automatic unit selection with 'auto' parameter
- Adding proper TypeScript exports for size unit types

**Checklist:**

- [ ] Test cases added to demonstrate binary vs decimal conversions
- [ ] Unit tests verify correct handling of edge cases and automatic unit selection
- [ ] All existing functionality maintained with renamed function

react/src/components/AgentDetailModal.tsx

@@ -1,4 +1,4 @@
-import { iSizeToSize } from '../helper';
+import { convertBinarySizeUnit } from '../helper';
 import { useResourceSlotsDetails } from '../hooks/backendai';
 import BAIModal, { BAIModalProps } from './BAIModal';
 import BAIProgressWithLabel from './BAIProgressWithLabel';
@@ -93,16 +93,18 @@ const AgentDetailModal: React.FC<AgentDetailModalProps> = ({
                 </Typography.Title>
                 <BAIProgressWithLabel
                   percent={
-                    ((iSizeToSize(_.toString(agent?.mem_cur_bytes), 'g')
-                      ?.number ?? 0) /
-                      (iSizeToSize(parsedAvailableSlots?.mem, 'g')?.number ??
-                        0)) *
+                    ((convertBinarySizeUnit(
+                      _.toString(agent?.mem_cur_bytes),
+                      'g',
+                    )?.number ?? 0) /
+                      (convertBinarySizeUnit(parsedAvailableSlots?.mem, 'g')
+                        ?.number ?? 0)) *
                       100 ?? 0
                   }
                   valueLabel={`${
-                    iSizeToSize(_.toString(agent?.mem_cur_bytes), 'g')
+                    convertBinarySizeUnit(_.toString(agent?.mem_cur_bytes), 'g')
                       ?.numberUnit
-                  }iB / ${iSizeToSize(parsedAvailableSlots?.mem, 'g')?.numberUnit}iB`}
+                  }iB / ${convertBinarySizeUnit(parsedAvailableSlots?.mem, 'g')?.numberUnit}iB`}
                 />
               </Flex>
             ) : null}
@@ -115,8 +117,11 @@ const AgentDetailModal: React.FC<AgentDetailModalProps> = ({
                   <Typography.Text>TX:</Typography.Text>
                   <Typography.Text>
                     {
-                      iSizeToSize(parsedLiveStat?.node?.net_tx?.current, 'm', 1)
-                        ?.numberUnit
+                      convertBinarySizeUnit(
+                        parsedLiveStat?.node?.net_tx?.current,
+                        'm',
+                        1,
+                      )?.numberUnit
                     }
                     iB
                   </Typography.Text>
@@ -125,8 +130,11 @@ const AgentDetailModal: React.FC<AgentDetailModalProps> = ({
                   <Typography.Text>RX:</Typography.Text>
                   <Typography.Text>
                     {
-                      iSizeToSize(parsedLiveStat?.node?.net_rx?.current, 'm', 1)
-                        ?.numberUnit
+                      convertBinarySizeUnit(
+                        parsedLiveStat?.node?.net_rx?.current,
+                        'm',
+                        1,
+                      )?.numberUnit
                     }
                     iB
                   </Typography.Text>

react/src/components/AgentList.tsx

@@ -1,6 +1,6 @@
 import {
   bytesToGB,
-  iSizeToSize,
+  convertBinarySizeUnit,
   toFixedFloorWithoutTrailingZeros,
   transformSorterToOrderString,
 } from '../helper';
@@ -340,11 +340,17 @@ const AgentList: React.FC<AgentListProps> = ({
                       <Flex gap="xxs">
                         <ResourceTypeIcon type={'mem'} />
                         <Typography.Text>
-                          {iSizeToSize(parsedOccupiedSlots.mem, 'g', 0)
-                            ?.numberFixed ?? 0}
+                          {convertBinarySizeUnit(
+                            parsedOccupiedSlots.mem,
+                            'g',
+                            0,
+                          )?.numberFixed ?? 0}
                           /
-                          {iSizeToSize(parsedAvailableSlots.mem, 'g', 0)
-                            ?.numberFixed ?? 0}
+                          {convertBinarySizeUnit(
+                            parsedAvailableSlots.mem,
+                            'g',
+                            0,
+                          )?.numberFixed ?? 0}
                         </Typography.Text>
                         <Typography.Text
                           type="secondary"
@@ -501,11 +507,15 @@ const AgentList: React.FC<AgentListProps> = ({
                   percent={liveStat.mem_util.ratio}
                   width={120}
                   valueLabel={
-                    iSizeToSize(_.toString(liveStat.mem_util.current), 'g')
-                      ?.numberFixed +
+                    convertBinarySizeUnit(
+                      _.toString(liveStat.mem_util.current),
+                      'g',
+                    )?.numberFixed +
                     '/' +
-                    iSizeToSize(_.toString(liveStat.mem_util.capacity), 'g')
-                      ?.numberFixed +
+                    convertBinarySizeUnit(
+                      _.toString(liveStat.mem_util.capacity),
+                      'g',
+                    )?.numberFixed +
                     ' GiB'
                   }
                 />
@@ -568,15 +578,15 @@ const AgentList: React.FC<AgentListProps> = ({
                             100 || 0
                         }
                         valueLabel={
-                          iSizeToSize(
+                          convertBinarySizeUnit(
                             _.toString(
                               liveStat[statKey as keyof typeof liveStat]
                                 .current,
                             ),
                             'g',
                           )?.numberFixed +
                           '/' +
-                          iSizeToSize(
+                          convertBinarySizeUnit(
                             _.toString(
                               liveStat[statKey as keyof typeof liveStat]
                                 .capacity,

react/src/components/AvailableResourcesCard.tsx

@@ -1,4 +1,4 @@
-import { iSizeToSize } from '../helper';
+import { convertBinarySizeUnit } from '../helper';
 import { useCurrentProjectValue } from '../hooks/useCurrentProject';
 import { useResourceLimitAndRemaining } from '../hooks/useResourceLimitAndRemaining';
 import BAIProgressWithLabel from './BAIProgressWithLabel';
@@ -58,12 +58,14 @@ const AvailableResourcesCard = () => {
         <BAIProgressWithLabel
           title="MEM"
           percent={
-            ((iSizeToSize(remaining.mem + '', 'm')?.number || 0) /
-              (iSizeToSize(resourceLimits.mem?.max + '', 'm')?.number || 1)) *
+            ((convertBinarySizeUnit(remaining.mem + '', 'm')?.number || 0) /
+              (convertBinarySizeUnit(resourceLimits.mem?.max + '', 'm')
+                ?.number || 1)) *
             100
           }
           valueLabel={
-            iSizeToSize(remaining.mem + '', 'g', 2)?.numberFixed + ' GiB'
+            convertBinarySizeUnit(remaining.mem + '', 'g', 2)?.numberFixed +
+            ' GiB'
           }
         />
       </Flex>

react/src/components/DynamicUnitInputNumber.tsx

@@ -1,4 +1,4 @@
-import { iSizeToSize, parseUnit } from '../helper';
+import { convertBinarySizeUnit, parseUnit, SizeUnit } from '../helper';
 import useControllableState from '../hooks/useControllableState';
 import { usePrevious } from 'ahooks';
 import { InputNumber, InputNumberProps, Select, Typography } from 'antd';
@@ -99,13 +99,16 @@ const DynamicUnitInputNumber: React.FC<DynamicUnitInputNumberProps> = ({
       }}
       //TODO: When min and max have different units, they should be calculated and put in.
       // 입력의 초소단위 확인 0.4g 가 되는지 확인
-      // @ts-ignore
-      max={maxUnit === unit ? maxNumValue : iSizeToSize(max, unit).number}
+      max={
+        maxUnit === unit
+          ? maxNumValue
+          : convertBinarySizeUnit(max, unit as SizeUnit)?.number
+      }
       min={
         minUnit === unit
           ? minNumValue
           : // @ts-ignore
-            iSizeToSize(min, unit).number
+            convertBinarySizeUnit(min, unit).number
       }
       addonAfter={
         <Select

react/src/components/DynamicUnitInputNumberWithSlider.tsx

@@ -1,4 +1,4 @@
-import { compareNumberWithUnits, iSizeToSize } from '../helper';
+import { compareNumberWithUnits, convertBinarySizeUnit } from '../helper';
 import { useUpdatableState } from '../hooks';
 import useControllableState from '../hooks/useControllableState';
 import DynamicUnitInputNumber, {
@@ -36,9 +36,12 @@ const DynamicUnitInputNumberWithSlider: React.FC<
     },
   );
   const { token } = theme.useToken();
-  const minGiB = useMemo(() => iSizeToSize(min, 'g', 2), [min]);
-  const maxGiB = useMemo(() => iSizeToSize(max, 'g', 2), [max]);
-  const valueGiB = useMemo(() => iSizeToSize(value || '0g', 'g', 2), [value]);
+  const minGiB = useMemo(() => convertBinarySizeUnit(min, 'g', 2), [min]);
+  const maxGiB = useMemo(() => convertBinarySizeUnit(max, 'g', 2), [max]);
+  const valueGiB = useMemo(
+    () => convertBinarySizeUnit(value || '0g', 'g', 2),
+    [value],
+  );
 
   // const warnPercent = useMemo(() => {
   //   return warn

react/src/components/KeypairResourcePolicySettingModal.tsx

@@ -1,4 +1,4 @@
-import { iSizeToSize } from '../helper';
+import { convertBinarySizeUnit } from '../helper';
 import {
   UNLIMITED_MAX_CONCURRENT_SESSIONS,
   UNLIMITED_MAX_CONTAINERS_PER_SESSIONS,
@@ -125,7 +125,7 @@ const KeypairResourcePolicySettingModal: React.FC<
     );
 
     if (parsedTotalResourceSlots?.mem) {
-      parsedTotalResourceSlots.mem = iSizeToSize(
+      parsedTotalResourceSlots.mem = convertBinarySizeUnit(
         parsedTotalResourceSlots?.mem + 'b',
         'g',
         2,
@@ -167,7 +167,7 @@ const KeypairResourcePolicySettingModal: React.FC<
           values?.parsedTotalResourceSlots,
           (value, key) => {
             if (_.includes(key, 'mem')) {
-              return iSizeToSize(value, 'b', 0)?.numberFixed;
+              return convertBinarySizeUnit(value, 'b', 0)?.numberFixed;
             }
             return value;
           },
@@ -353,9 +353,9 @@ const KeypairResourcePolicySettingModal: React.FC<
                                 _.includes(resourceSlotKey, 'mem') &&
                                 value &&
                                 // @ts-ignore
-                                iSizeToSize(value, 'p').number >
+                                convertBinarySizeUnit(value, 'p').number >
                                   // @ts-ignore
-                                  iSizeToSize('300p', 'p').number
+                                  convertBinarySizeUnit('300p', 'p').number
                               ) {
                                 return Promise.reject(
                                   new Error(

react/src/components/ResourceAllocationFormItems.tsx

@@ -1,7 +1,7 @@
 import {
   addNumberWithUnits,
   compareNumberWithUnits,
-  iSizeToSize,
+  convertBinarySizeUnit,
 } from '../helper';
 import { useSuspendedBackendaiClient, useUpdatableState } from '../hooks';
 import { useResourceSlotsDetails } from '../hooks/backendai';
@@ -239,9 +239,9 @@ const ResourceAllocationFormItems: React.FC<
     const minimumResources: Partial<ResourceAllocationFormValue['resource']> = {
       cpu: resourceLimits.cpu?.min,
       mem:
-        iSizeToSize(
-          (iSizeToSize(resourceLimits.shmem?.min, 'm')?.number || 0) +
-            (iSizeToSize(resourceLimits.mem?.min, 'm')?.number || 0) +
+        convertBinarySizeUnit(
+          (convertBinarySizeUnit(resourceLimits.shmem?.min, 'm')?.number || 0) +
+            (convertBinarySizeUnit(resourceLimits.mem?.min, 'm')?.number || 0) +
             'm',
           'g',
         )?.number + 'g', //to prevent loosing precision
@@ -345,7 +345,11 @@ const ResourceAllocationFormItems: React.FC<
       (preset) => preset.name === name,
     );
     const slots = _.pick(preset?.resource_slots, _.keys(resourceSlots));
-    const mem = iSizeToSize((slots?.mem || 0) + 'b', 'g', 2)?.numberUnit;
+    const mem = convertBinarySizeUnit(
+      (slots?.mem || 0) + 'b',
+      'g',
+      2,
+    )?.numberUnit;
     const acceleratorObj = _.omit(slots, ['cpu', 'mem', 'shmem']);
 
     // Select the first matched AI accelerator type and value
@@ -372,7 +376,7 @@ const ResourceAllocationFormItems: React.FC<
         ...acceleratorSetting,
         // transform to GB based on preset values
         mem,
-        shmem: iSizeToSize((preset?.shared_memory || 0) + 'b', 'g', 2)
+        shmem: convertBinarySizeUnit((preset?.shared_memory || 0) + 'b', 'g', 2)
           ?.numberUnit,
         cpu: parseInt(slots?.cpu || '0') || 0,
       },
@@ -766,8 +770,11 @@ const ResourceAllocationFormItems: React.FC<
                                 ...(remaining.mem
                                   ? {
                                       //@ts-ignore
-                                      [iSizeToSize(remaining.mem + 'b', 'g', 3)
-                                        ?.numberFixed]: {
+                                      [convertBinarySizeUnit(
+                                        remaining.mem + 'b',
+                                        'g',
+                                        3,
+                                      )?.numberFixed]: {
                                         label: <RemainingMark />,
                                       },
                                     }

react/src/components/ResourceNumber.tsx

@@ -1,4 +1,4 @@
-import { iSizeToSize } from '../helper';
+import { convertBinarySizeUnit } from '../helper';
 import {
   BaseResourceSlotName,
   KnownAcceleratorResourceSlotName,
@@ -45,7 +45,9 @@ const ResourceNumber: React.FC<ResourceNumberProps> = ({
 
   const formatAmount = (amount: string) => {
     return mergedResourceSlots?.[type]?.number_format.binary
-      ? Number(iSizeToSize(amount, 'g', 3, true)?.numberFixed).toString()
+      ? Number(
+          convertBinarySizeUnit(amount, 'g', 3, true)?.numberFixed,
+        ).toString()
       : (mergedResourceSlots?.[type]?.number_format.round_length || 0) > 0
         ? parseFloat(amount).toFixed(2)
         : amount;
@@ -75,7 +77,8 @@ const ResourceNumber: React.FC<ResourceNumberProps> = ({
           type="secondary"
           style={{ fontSize: token.fontSizeSM }}
         >
-          (SHM: {iSizeToSize(opts.shmem + 'b', 'g', 2, true)?.numberFixed}
+          (SHM:{' '}
+          {convertBinarySizeUnit(opts.shmem + 'b', 'g', 2, true)?.numberFixed}
           GiB)
         </Typography.Text>
       ) : null}

react/src/components/ResourcePresetList.tsx

@@ -1,4 +1,8 @@
-import { filterNonNullItems, iSizeToSize, localeCompare } from '../helper';
+import {
+  filterNonNullItems,
+  convertBinarySizeUnit,
+  localeCompare,
+} from '../helper';
 import { useUpdatableState } from '../hooks';
 import Flex from './Flex';
 import ResourceNumber from './ResourceNumber';
@@ -131,7 +135,7 @@ const ResourcePresetList: React.FC<ResourcePresetListProps> = () => {
             title: t('resourcePreset.SharedMemory'),
             dataIndex: 'shared_memory',
             render: (text) =>
-              text ? iSizeToSize(text + '', 'g')?.number : '-',
+              text ? convertBinarySizeUnit(text + '', 'g')?.number : '-',
             sorter: (a, b) => a.shared_memory - b.shared_memory,
           },
           {