fix: single sorted field, remove token

src/components/seal-table/components/header.tsx

@@ -1,16 +1,17 @@
 import { Col, Row } from 'antd';
 import React from 'react';
-import { OnSortFn, SealColumnProps } from '../types';
+import { OnSortFn, SealColumnProps, TableOrder } from '../types';
 import TableHeader from './table-header';
 
 interface HeaderProps {
   columns: SealColumnProps[];
   sortDirections?: ('ascend' | 'descend' | null)[];
+  sorterList: TableOrder | Array<TableOrder>;
   onSort?: OnSortFn;
 }
 
 const Header: React.FC<HeaderProps> = (props) => {
-  const { onSort, sortDirections } = props;
+  const { onSort, sortDirections, sorterList } = props;
 
   return (
     <Row className="row">
@@ -31,6 +32,7 @@ const Header: React.FC<HeaderProps> = (props) => {
             <TableHeader
               onSort={onSort}
               sorter={sorter}
+              sorterList={sorterList}
               dataIndex={dataIndex}
               sortOrder={sortOrder}
               sortDirections={sortDirections}

src/components/seal-table/components/table-header.tsx

@@ -1,7 +1,7 @@
 import AutoTooltip from '@/components/auto-tooltip';
 import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
-import React from 'react';
+import React, { useEffect } from 'react';
 import '../styles/header.less';
 
 import { TableHeaderProps } from '../types';
@@ -17,6 +17,7 @@ const TableHeader: React.FC<TableHeaderProps> = (props) => {
     sortDirections = ['ascend', 'descend', null],
     defaultSortOrder,
     onSort,
+    sorterList,
     sorter = false,
     width,
     dataIndex
@@ -47,6 +48,29 @@ const TableHeader: React.FC<TableHeaderProps> = (props) => {
     });
   };
 
+  useEffect(() => {
+    if (!sorterList) {
+      setCurrentSortOrder(null);
+      return;
+    }
+
+    if (Array.isArray(sorterList)) {
+      const sortItem = sorterList.find(
+        (item) => item.columnKey === dataIndex || item.field === dataIndex
+      );
+      setCurrentSortOrder(sortItem?.order || null);
+    } else {
+      if (
+        sorterList.columnKey === dataIndex ||
+        sorterList.field === dataIndex
+      ) {
+        setCurrentSortOrder(sorterList.order);
+      } else {
+        setCurrentSortOrder(null);
+      }
+    }
+  }, [sorterList]);
+
   return (
     <div
       style={{ width, ...style }}

src/components/seal-table/index.tsx

@@ -49,7 +49,7 @@ const SealTable: React.FC<SealTableProps & { pagination: PaginationProps }> = (
     loadChildren,
     loadChildrenAPI
   } = props;
-  const { handleOnTableSort } = useSorter({
+  const { handleOnTableSort, sorterList } = useSorter({
     onTableSort,
     columns
   });
@@ -166,6 +166,7 @@ const SealTable: React.FC<SealTableProps & { pagination: PaginationProps }> = (
             onSort={handleOnTableSort}
             columns={parsedColumns}
             sortDirections={sortDirections}
+            sorterList={sorterList}
           ></Header>
         </div>
         <Spin spinning={loading}>

src/components/seal-table/types.ts

@@ -43,6 +43,7 @@ export interface SealColumnProps {
 }
 
 export interface TableHeaderProps {
+  sorterList?: TableOrder | Array<TableOrder>;
   sorter?: boolean | { multiple?: number };
   sortDirections?: ('ascend' | 'descend' | null)[];
   defaultSortOrder?: 'ascend' | 'descend' | null;

src/components/seal-table/use-sorter.ts

@@ -1,5 +1,5 @@
 import { isBoolean } from 'lodash';
-import { useRef } from 'react';
+import { useRef, useState } from 'react';
 import { SealColumnProps, TableOrder } from './types';
 
 const initSorterList = (columns: SealColumnProps[]) => {
@@ -23,6 +23,9 @@ export default function useSorter(options: {
   const sorterListRef = useRef<TableOrder | Array<TableOrder>>(
     initSorterList(columns || [])
   );
+  const [sorterList, setSorterList] = useState<TableOrder | Array<TableOrder>>(
+    initSorterList(columns || [])
+  );
 
   const handleOnTableSort = (
     order: TableOrder,
@@ -39,6 +42,7 @@ export default function useSorter(options: {
     }
     // single column sort
     if (isBoolean(sorter)) {
+      setSorterList(currentOrder);
       sorterListRef.current = currentOrder;
 
       onTableSort?.(sorterListRef.current);
@@ -73,12 +77,14 @@ export default function useSorter(options: {
         }
       }
     }
+    setSorterList(sorterListRef.current);
 
     onTableSort?.(sorterListRef.current);
   };
 
   return {
     sorterListRef,
+    sorterList,
     handleOnTableSort
   };
 }