chore: set col order

src/config/settings.ts

@@ -11,8 +11,18 @@ export const GPUSTACK_API_BASE_URL = 'v2';
 export const OPENAI_COMPATIBLE = 'v1';
 
 type SortDirection = 'ascend' | 'descend' | null;
+
 export const TABLE_SORT_DIRECTIONS: SortDirection[] = [
   'ascend',
   'descend',
   null
 ];
+
+export const tableSorter = (order: number | boolean) => {
+  if (typeof order === 'number') {
+    return {
+      multiple: order
+    };
+  }
+  return order;
+};

src/pages/api-keys/hooks/use-keys-columns.tsx

@@ -2,6 +2,7 @@
 import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
 import icons from '@/components/icon-font/icons';
+import { tableSorter } from '@/config/settings';
 import { useIntl } from '@umijs/max';
 import { ColumnsType } from 'antd/lib/table';
 import dayjs from 'dayjs';
@@ -39,9 +40,7 @@ const useModelsColumns = ({
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
         key: 'name',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         render: (text: string, record: ListItem) => (
           <AutoTooltip ghost style={{ maxWidth: 400 }}>
             {text}
@@ -52,9 +51,7 @@ const useModelsColumns = ({
         title: intl.formatMessage({ id: 'apikeys.form.expiretime' }),
         dataIndex: 'expires_at',
         key: 'expires_at',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         render: (text: string, record: ListItem) => (
           <AutoTooltip ghost>
             {text
@@ -96,9 +93,7 @@ const useModelsColumns = ({
         dataIndex: 'created_at',
         key: 'created_at',
         defaultSortOrder: 'descend',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         ellipsis: {
           showTitle: false
         },

src/pages/cluster-management/hooks/use-cluster-columns.tsx

@@ -3,6 +3,7 @@ import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
 import { SealColumnProps } from '@/components/seal-table/types';
 import StatusTag from '@/components/status-tag';
+import { tableSorter } from '@/config/settings';
 import { useIntl } from '@umijs/max';
 import dayjs from 'dayjs';
 import { useMemo } from 'react';
@@ -33,9 +34,7 @@ const useClusterColumns = (
       {
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         span: 3,
         render: (text: string, record: ClusterListItem) => (
           <AutoTooltip ghost>{text}</AutoTooltip>
@@ -44,9 +43,7 @@ const useClusterColumns = (
       {
         title: intl.formatMessage({ id: 'clusters.table.provider' }),
         dataIndex: 'provider',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         span: 4,
         render: (value: string) => (
           <AutoTooltip ghost minWidth={20}>
@@ -93,9 +90,7 @@ const useClusterColumns = (
         title: intl.formatMessage({ id: 'common.table.createTime' }),
         dataIndex: 'created_at',
         defaultSortOrder: 'descend',
-        sorter: {
+        sorter: tableSorter(5),
-          multiple: 5
-        },
         span: 4,
         render: (value: string) => (
           <AutoTooltip ghost minWidth={20}>

src/pages/cluster-management/hooks/use-credential-columns.tsx

@@ -1,6 +1,7 @@
 // columns.ts
 import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
+import { tableSorter } from '@/config/settings';
 import { useIntl } from '@umijs/max';
 import { ColumnsType } from 'antd/es/table';
 import type { SortOrder } from 'antd/es/table/interface';
@@ -23,9 +24,7 @@ const useCredentialColumns = (
       {
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         render: (text: string) => (
           <AutoTooltip ghost minWidth={20}>
             {text}
@@ -43,9 +42,7 @@ const useCredentialColumns = (
         dataIndex: 'created_at',
         showSorterTooltip: false,
         defaultSortOrder: 'descend',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         ellipsis: {
           showTitle: false
         },

src/pages/llmodels/hooks/use-models-columns.tsx

@@ -2,7 +2,7 @@
 import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
 import { SealColumnProps } from '@/components/seal-table/types';
-import { OPENAI_COMPATIBLE } from '@/config/settings';
+import { OPENAI_COMPATIBLE, tableSorter } from '@/config/settings';
 import { QuestionCircleOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
 import { Tooltip } from 'antd';
@@ -53,9 +53,7 @@ const useModelsColumns = ({
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
         key: 'name',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         span: 5,
         render: (text: string, record: ListItem) => (
           <span className="flex-center" style={{ maxWidth: '100%' }}>
@@ -70,9 +68,7 @@ const useModelsColumns = ({
         title: intl.formatMessage({ id: 'clusters.title' }),
         dataIndex: 'cluster_id',
         key: 'cluster_id',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         span: 3,
         render: (text: string, record: ListItem) => (
           <span className="flex flex-column" style={{ width: '100%' }}>
@@ -87,9 +83,7 @@ const useModelsColumns = ({
         title: intl.formatMessage({ id: 'models.form.source' }),
         dataIndex: 'source',
         key: 'source',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         span: 5,
         render: (text: string, record: ListItem) => (
           <span className="flex flex-column" style={{ width: '100%' }}>
@@ -114,9 +108,7 @@ const useModelsColumns = ({
         dataIndex: 'ready_replicas',
         key: 'ready_replicas',
         align: 'center',
-        sorter: {
+        sorter: tableSorter(4),
-          multiple: 4
-        },
         span: 4,
         editable: {
           valueType: 'number',
@@ -133,9 +125,7 @@ const useModelsColumns = ({
         dataIndex: 'created_at',
         key: 'created_at',
         defaultSortOrder: 'descend',
-        sorter: {
+        sorter: tableSorter(5),
-          multiple: 5
-        },
         span: 4,
         render: (text: number) => (
           <AutoTooltip ghost>

src/pages/resources/hooks/use-files-columns.tsx

@@ -2,6 +2,7 @@ import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
 import { TooltipOverlayScroller } from '@/components/overlay-scroller';
 import StatusTag from '@/components/status-tag';
+import { tableSorter } from '@/config/settings';
 import { modelSourceMap } from '@/pages/llmodels/config';
 import { modelFileActions } from '@/pages/llmodels/config/button-actions';
 import { convertFileSize } from '@/utils';
@@ -265,9 +266,7 @@ const useFilesColumns = (props: {
       {
         title: intl.formatMessage({ id: 'models.form.source' }),
         dataIndex: 'source',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         ellipsis: {
           showTitle: false
         },
@@ -286,9 +285,7 @@ const useFilesColumns = (props: {
       {
         title: intl.formatMessage({ id: 'resources.worker' }),
         dataIndex: 'worker_id',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         width: '18%',
         ellipsis: {
           showTitle: false
@@ -312,9 +309,7 @@ const useFilesColumns = (props: {
       {
         title: intl.formatMessage({ id: 'resources.modelfiles.form.path' }),
         dataIndex: 'resolved_paths',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         width: '20%',
         ellipsis: {
           showTitle: false
@@ -344,9 +339,7 @@ const useFilesColumns = (props: {
         dataIndex: 'created_at',
         defaultSortOrder: 'descend',
         key: 'created_at',
-        sorter: {
+        sorter: tableSorter(4),
-          multiple: 4
-        },
         width: 180,
         ellipsis: {
           showTitle: false

src/pages/resources/hooks/use-gpu-columns.tsx

@@ -1,6 +1,7 @@
 import AutoTooltip from '@/components/auto-tooltip';
 import ProgressBar from '@/components/progress-bar';
 import InfoColumn from '@/components/simple-table/info-column';
+import { tableSorter } from '@/config/settings';
 import { convertFileSize } from '@/utils';
 import { useIntl } from '@umijs/max';
 import { ColumnsType } from 'antd/lib/table';
@@ -50,9 +51,7 @@ const useGPUColumns = (props: {
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
         width: 240,
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         render: (text: string, record: GPUDeviceItem) => (
           <AutoTooltip ghost maxWidth={240}>
             {text}
@@ -62,17 +61,13 @@ const useGPUColumns = (props: {
       {
         title: intl.formatMessage({ id: 'resources.table.index' }),
         dataIndex: 'index',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         render: (text: string, record: GPUDeviceItem) => <span>{text}</span>
       },
       {
         title: intl.formatMessage({ id: 'clusters.title' }),
         dataIndex: 'cluster_id',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         ellipsis: {
           showTitle: false
         },
@@ -85,9 +80,7 @@ const useGPUColumns = (props: {
       {
         title: intl.formatMessage({ id: 'resources.worker' }),
         dataIndex: 'worker_name',
-        sorter: {
+        sorter: tableSorter(4),
-          multiple: 4
-        },
         ellipsis: {
           showTitle: false
         },
@@ -98,9 +91,7 @@ const useGPUColumns = (props: {
       {
         title: intl.formatMessage({ id: 'resources.table.vender' }),
         dataIndex: 'vendor',
-        sorter: {
+        sorter: tableSorter(5)
-          multiple: 5
-        }
       },
       {
         title: `${intl.formatMessage({ id: 'resources.table.temperature' })} (°C)`,
@@ -113,9 +104,7 @@ const useGPUColumns = (props: {
         title: `${intl.formatMessage({ id: 'resources.table.utilization' })}`,
         dataIndex: 'core.utilization_rate',
         key: 'core.utilization_rate',
-        sorter: {
+        sorter: tableSorter(6),
-          multiple: 6
-        },
         render: (text: number, record: GPUDeviceItem) => {
           return (
             <>
@@ -134,9 +123,7 @@ const useGPUColumns = (props: {
         title: intl.formatMessage({ id: 'resources.table.vramutilization' }),
         dataIndex: 'memory.utilization_rate',
         key: 'memory.utilization_rate',
-        sorter: {
+        sorter: tableSorter(7),
-          multiple: 7
-        },
         render: (text: number, record: GPUDeviceItem, index: number) => {
           return (
             <ProgressBar

src/pages/resources/hooks/use-worker-columns.tsx

@@ -4,6 +4,7 @@ import LabelsCell from '@/components/label-cell';
 import ProgressBar from '@/components/progress-bar';
 import InfoColumn from '@/components/simple-table/info-column';
 import StatusTag from '@/components/status-tag';
+import { tableSorter } from '@/config/settings';
 import { convertFileSize } from '@/utils';
 import {
   DeleteOutlined,
@@ -274,9 +275,7 @@ const useWorkerColumns = ({
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
         width: 100,
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         render: (text: string) => (
           <AutoTooltip ghost maxWidth={240}>
             {text}
@@ -301,9 +300,7 @@ const useWorkerColumns = ({
       {
         title: intl.formatMessage({ id: 'common.table.status' }),
         dataIndex: 'state',
-        sorter: {
+        sorter: tableSorter(2),
-          multiple: 2
-        },
         render: (_, record) => (
           <StatusTag
             maxTooltipWidth={400}
@@ -319,9 +316,7 @@ const useWorkerColumns = ({
       {
         title: 'IP',
         dataIndex: 'ip',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         render: (text: string, record) => (
           <AutoTooltip ghost maxWidth={240}>
             {renderIP(text, record)}
@@ -331,9 +326,7 @@ const useWorkerColumns = ({
       {
         title: 'CPU',
         dataIndex: 'status.cpu.utilization_rate',
-        sorter: {
+        sorter: tableSorter(4),
-          multiple: 4
-        },
         render: (text: string, record) =>
           statusAvailable(record) ? (
             <ProgressBar
@@ -346,9 +339,7 @@ const useWorkerColumns = ({
       {
         title: intl.formatMessage({ id: 'resources.table.memory' }),
         dataIndex: 'status.memory.utilization_rate',
-        sorter: {
+        sorter: tableSorter(5),
-          multiple: 5
-        },
         render: (_, record) =>
           statusAvailable(record) ? (
             <ProgressBar

src/pages/users/hooks/use-users-columns.tsx

@@ -3,6 +3,7 @@ import AutoTooltip from '@/components/auto-tooltip';
 import DropdownButtons from '@/components/drop-down-buttons';
 import IconFont from '@/components/icon-font';
 import icons from '@/components/icon-font/icons';
+import { tableSorter } from '@/config/settings';
 import { useIntl, useModel } from '@umijs/max';
 import { useMemoizedFn } from 'ahooks';
 import { Tag } from 'antd';
@@ -71,9 +72,7 @@ const useUsersColumns = ({
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'username',
         key: 'username',
-        sorter: {
+        sorter: tableSorter(1),
-          multiple: 1
-        },
         render: (text: string, record: ListItem) => (
           <AutoTooltip ghost style={{ maxWidth: 400 }}>
             {text}
@@ -84,9 +83,7 @@ const useUsersColumns = ({
         title: intl.formatMessage({ id: 'users.table.role' }),
         dataIndex: 'is_admin',
         key: 'is_admin',
-        sorter: {
+        sorter: tableSorter(6),
-          multiple: 6
-        },
         ellipsis: {
           showTitle: false
         },
@@ -125,9 +122,7 @@ const useUsersColumns = ({
         title: intl.formatMessage({ id: 'users.form.source' }),
         dataIndex: 'source',
         key: 'source',
-        sorter: {
+        sorter: tableSorter(3),
-          multiple: 3
-        },
         ellipsis: {
           showTitle: false
         },
@@ -141,9 +136,7 @@ const useUsersColumns = ({
         title: intl.formatMessage({ id: 'users.table.status' }),
         dataIndex: 'is_active',
         key: 'is_active',
-        sorter: {
+        sorter: tableSorter(4),
-          multiple: 4
-        },
         ellipsis: {
           showTitle: false
         },
@@ -191,9 +184,7 @@ const useUsersColumns = ({
         key: 'created_at',
         defaultSortOrder: 'descend',
         showSorterTooltip: false,
-        sorter: {
+        sorter: tableSorter(5),
-          multiple: 5
-        },
         ellipsis: {
           showTitle: false
         },