feat: table list sorter

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

@@ -33,6 +33,9 @@ const useClusterColumns = (
       {
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
+        sorter: {
+          multiple: 1
+        },
         span: 3,
         render: (text: string, record: ClusterListItem) => (
           <AutoTooltip ghost>{text}</AutoTooltip>
@@ -41,6 +44,9 @@ const useClusterColumns = (
       {
         title: intl.formatMessage({ id: 'clusters.table.provider' }),
         dataIndex: 'provider',
+        sorter: {
+          multiple: 2
+        },
         span: 4,
         render: (value: string) => (
           <AutoTooltip ghost minWidth={20}>
@@ -86,6 +92,10 @@ const useClusterColumns = (
       {
         title: intl.formatMessage({ id: 'common.table.createTime' }),
         dataIndex: 'created_at',
+        defaultSortOrder: 'descend',
+        sorter: {
+          multiple: 5
+        },
         span: 4,
         render: (value: string) => (
           <AutoTooltip ghost minWidth={20}>

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

@@ -23,6 +23,9 @@ const useCredentialColumns = (
       {
         title: intl.formatMessage({ id: 'common.table.name' }),
         dataIndex: 'name',
+        sorter: {
+          multiple: 1
+        },
         render: (text: string) => (
           <AutoTooltip ghost minWidth={20}>
             {text}
@@ -32,6 +35,7 @@ const useCredentialColumns = (
       {
         title: intl.formatMessage({ id: 'clusters.table.provider' }),
         dataIndex: 'provider',
+        sorter: false,
         render: (value: string) => <span>{ProviderLabelMap[value]}</span>
       },
       {
@@ -39,11 +43,9 @@ const useCredentialColumns = (
         dataIndex: 'created_at',
         showSorterTooltip: false,
         defaultSortOrder: 'descend',
-        sortOrder:
-          sortOrder.order && sortOrder.columnKey === 'created_at'
-            ? sortOrder.order
-            : null,
-        sorter: false,
+        sorter: {
+          multiple: 3
+        },
         ellipsis: {
           showTitle: false
         },