chore: bump @gpustack/core-ui to v1.0.36

package.json

@@ -17,7 +17,7 @@
     "@ant-design/pro-components": "3.1.0-0",
     "@antv/g6": "^5.0.51",
     "@braintree/sanitize-url": "^7.1.1",
-    "@gpustack/core-ui": "^1.0.38",
+    "@gpustack/core-ui": "^1.0.36",
     "@huggingface/gguf": "^0.1.7",
     "@huggingface/hub": "^0.15.1",
     "@huggingface/tasks": "^0.11.6",

pnpm-lock.yaml

@@ -24,8 +24,8 @@ importers:
         specifier: ^7.1.1
         version: 7.1.2
       '@gpustack/core-ui':
-        specifier: ^1.0.38
-        version: 1.0.38(czdvzceysqw7iv6pct2ucnb23e)
+        specifier: ^1.0.36
+        version: 1.0.36(czdvzceysqw7iv6pct2ucnb23e)
       '@huggingface/gguf':
         specifier: ^0.1.7
         version: 0.1.18
@@ -1481,8 +1481,8 @@ packages:
     resolution: {integrity: sha512-KWk80UPIzPmUg+P0rKh6TqspRw0G6eux1PuJr+zz47ftMaZ9QDwbGzHZbtzWkl5hgayM/qrKRutllRC7D/vVXQ==, tarball: https://registry.npmjs.org/@formatjs/intl-utils/-/intl-utils-2.3.0.tgz}
     deprecated: the package is rather renamed to @formatjs/ecma-abstract with some changes in functionality (primarily selectUnit is removed and we don't plan to make any further changes to this package
 
-  '@gpustack/core-ui@1.0.38':
-    resolution: {integrity: sha512-7+38qgsFwubb1HyQreICkG1aWcXHM48MXoLY8D14aO6GYWYaO6G4NSkBrXHgpAnB4y3ReYfObH8l3Naq/0YgZw==, tarball: https://registry.npmjs.org/@gpustack/core-ui/-/core-ui-1.0.38.tgz}
+  '@gpustack/core-ui@1.0.36':
+    resolution: {integrity: sha512-gF8ShMZ2SKYo3+skfsI3zo+aBSsXqKGMX+jWaKv81e38bDwJw71C33TR64d+6MyV9iUoFOoSK+ht1GefyvR17g==, tarball: https://registry.npmjs.org/@gpustack/core-ui/-/core-ui-1.0.36.tgz}
     peerDependencies:
       '@ant-design/icons': ^6.1.0
       '@ant-design/pro-components': 3.1.0-0
@@ -10802,7 +10802,7 @@ snapshots:
 
   '@formatjs/intl-utils@2.3.0': {}
 
-  '@gpustack/core-ui@1.0.38(czdvzceysqw7iv6pct2ucnb23e)':
+  '@gpustack/core-ui@1.0.36(czdvzceysqw7iv6pct2ucnb23e)':
     dependencies:
       '@ant-design/icons': 6.2.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@ant-design/pro-components': 3.1.0-0(antd@6.3.7(date-fns@2.30.0)(moment@2.30.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)

src/assets/styles/table.less

@@ -9,15 +9,6 @@
   }
 }
 
-@keyframes tableEmptyFadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
 .scroll-table {
   .ant-table {
     .ant-table-container {
@@ -27,27 +18,5 @@
         scrollbar-color: var(--color-scrollbar-thumb) transparent;
       }
     }
-
-    // Reserve a stable block for the empty/loading state so the first-load
-    // spinner and the empty result occupy the same height as eventual data —
-    // this removes the layout jump when entering the page. Scoped to
-    // `.ant-table-content` so it only targets x-scroll tables (whose empty
-    // row lives here) and leaves fixed-height `scroll.y` tables untouched.
-    // Height must match the `minHeight` passed to <NoResult> in
-    // use-no-resource-result.
-    .ant-table-content {
-      .ant-table-placeholder {
-        > .ant-table-cell {
-          height: calc(100vh - 300px);
-        }
-
-        // NoResult renders nothing while loading and mounts an <Empty> only
-        // once the request settles, so this fires exactly when the empty
-        // state appears — a seamless fade-in instead of a hard pop.
-        .ant-empty {
-          animation: tableEmptyFadeIn 0.3s ease-in-out;
-        }
-      }
-    }
   }
 }

src/hooks/use-watch-list.ts

@@ -40,11 +40,6 @@ export default function useWatchList<T = Record<string, any>>(API: string) {
     }
   });
 
-  const cancelWatch = useMemoizedFn(() => {
-    chunkRequestRef.current?.current?.cancel?.();
-    listRequestTokenRef.current?.cancel?.();
-  });
-
   const queryAllDataList = async (
     params: Global.SearchParams,
     options?: any
@@ -83,15 +78,14 @@ export default function useWatchList<T = Record<string, any>>(API: string) {
   useEffect(() => {
     createWatchChunkRequest();
     return () => {
-      cancelWatch();
+      chunkRequestRef.current?.cancel?.();
+      listRequestTokenRef.current?.cancel?.();
     };
   }, []);
 
   return {
     watchDataList,
     setWatchDataList,
-    startWatch: createWatchChunkRequest,
-    cancelWatch,
     deleteItemFromCache: handleDeleteItemFromCache
   };
 }

src/pages/api-keys/index.tsx

@@ -183,7 +183,6 @@ const APIKeys: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -232,7 +231,6 @@ const APIKeys: React.FC = () => {
         ></FilterBar>
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataSource.dataList}
             rowSelection={rowSelection}

src/pages/backends/community/commnity-backends.tsx

@@ -164,7 +164,6 @@ const CommunityBackends: React.FC<{
           renderItem={renderItem}
         ></BackendCardList>
         <NoResult
-          minHeight="calc(100vh - 300px)"
           loading={dataSource.loading}
           loadend={dataSource.loadend}
           dataSource={dataSource.dataList}

src/pages/backends/index.tsx

@@ -282,7 +282,6 @@ const BackendList = () => {
           onSelect={handleOnSelect}
         ></BackendCardList>
         <NoResult
-          minHeight="calc(100vh - 300px)"
           loading={dataSource.loading}
           loadend={dataSource.loadend}
           dataSource={dataSource.dataList}

src/pages/benchmark/index.tsx

@@ -177,7 +177,6 @@ const Benchmark: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={[]}

src/pages/cluster-management/clusters.tsx

@@ -395,7 +395,6 @@ const Clusters: React.FC = () => {
         >
           <SealTable
             rowKey="id"
-            emptyMinHeight="calc(100vh - 300px)"
             loadChildren={getWorkerPoolList}
             sortDirections={TABLE_SORT_DIRECTIONS}
             expandedRowKeys={expandedRowKeys}

src/pages/cluster-management/credentials.tsx

@@ -157,7 +157,6 @@ const Credentials: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={[]}
@@ -200,7 +199,6 @@ const Credentials: React.FC = () => {
 
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             tableLayout="fixed"
             columns={columns}
             dataSource={dataSource.dataList}

src/pages/gpu-service/instances/index.tsx

@@ -271,7 +271,6 @@ const GPUService: React.FC = () => {
     if (!clusterLoading && !hasK8sCluster) {
       return (
         <NoResult
-          minHeight="calc(100vh - 300px)"
           loading={dataSource.loading || clusterLoading}
           loadend={dataSource.loadend}
           dataSource={[]}
@@ -295,7 +294,6 @@ const GPUService: React.FC = () => {
     }
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -362,7 +360,6 @@ const GPUService: React.FC = () => {
         />
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataSource.dataList}
             rowSelection={rowSelection}

src/pages/gpu-service/public-keys/index.tsx

@@ -110,7 +110,6 @@ const GPUServicePublicKeys: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -154,7 +153,6 @@ const GPUServicePublicKeys: React.FC = () => {
         />
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataSource.dataList}
             rowSelection={rowSelection}

src/pages/gpu-service/storage-types/index.tsx

@@ -104,7 +104,6 @@ const GPUServiceStorageTypes: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -150,7 +149,6 @@ const GPUServiceStorageTypes: React.FC = () => {
         />
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataSource.dataList}
             rowSelection={rowSelection}

src/pages/gpu-service/storage/index.tsx

@@ -109,7 +109,6 @@ const GPUServiceStorage: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -151,7 +150,6 @@ const GPUServiceStorage: React.FC = () => {
         />
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataSource.dataList}
             rowSelection={rowSelection}

src/pages/gpu-service/templates/index.tsx

@@ -210,7 +210,6 @@ const GPUServiceTemplates: React.FC = () => {
           onSelect={handleOnSelect}
         />
         <NoResult
-          minHeight="calc(100vh - 300px)"
           loading={dataSource.loading}
           loadend={dataSource.loadend}
           dataSource={dataSource.dataList}

src/pages/llmodels/catalog.tsx

@@ -166,7 +166,6 @@ const Catalog: React.FC = () => {
           isFirst={!dataSource.loadend}
         ></CatalogList>
         <NoResult
-          minHeight="calc(100vh - 300px)"
           loading={dataSource.loading}
           loadend={dataSource.loadend}
           dataSource={dataSource.dataList}

src/pages/llmodels/components/table-list.tsx

@@ -5,7 +5,9 @@ import { PageActionType } from '@/config/types';
 import useBodyScroll from '@/hooks/use-body-scroll';
 import useExpandedRowKeys from '@/hooks/use-expanded-row-keys';
 import useTableRowSelection from '@/hooks/use-table-row-selection';
+import useWatchList from '@/hooks/use-watch-list';
 import useNoResourceResult from '@/pages/llmodels/hooks/use-no-resource-result';
+import { MODEL_ROUTE_TARGETS } from '@/pages/model-routes/apis';
 import { TargetStatusValueMap } from '@/pages/model-routes/config';
 import useOpenPlayground from '@/pages/model-routes/hooks/use-open-playground';
 import useGranfanaLink from '@/pages/resources/hooks/use-grafana-link';
@@ -90,7 +92,6 @@ interface ModelsProps {
   loadend: boolean;
   total: number;
   filterValues?: Record<string, any>;
-  targetList?: any[];
 }
 
 const getFormattedData = (record: any, extraData = {}) => ({
@@ -128,8 +129,7 @@ const Models: React.FC<ModelsProps> = ({
   queryParams,
   loading,
   loadend,
-  total,
-  targetList = []
+  total
 }) => {
   const { generateFormValues, clusterList, workerList } =
     useDeploymentsContext();
@@ -155,6 +155,7 @@ const Models: React.FC<ModelsProps> = ({
     expandedRowKeys
   } = useExpandedRowKeys(expandAtom);
   const { handleOpenPlayGround } = useOpenPlayground();
+  const { watchDataList: targetList } = useWatchList(MODEL_ROUTE_TARGETS);
   const { openViewLogsModal, openViewLogsModalStatus, closeViewLogsModal } =
     useViewInstanceLogs();
 
@@ -613,7 +614,6 @@ const Models: React.FC<ModelsProps> = ({
         ></PageTools>
         <SealTable
           columns={columns}
-          emptyMinHeight="calc(100vh - 300px)"
           sortDirections={TABLE_SORT_DIRECTIONS}
           dataSource={dataSource}
           rowSelection={rowSelection}

src/pages/llmodels/deployments.tsx

@@ -3,8 +3,6 @@ import useSetChunkRequest from '@/hooks/use-chunk-request';
 import { usePaginationStatus } from '@/hooks/use-pagination-status';
 import { useTableMultiSort } from '@/hooks/use-table-sort';
 import useUpdateChunkedList from '@/hooks/use-update-chunk-list';
-import useWatchList from '@/hooks/use-watch-list';
-import { MODEL_ROUTE_TARGETS } from '@/pages/model-routes/apis';
 import { TableOrder, TableProvider } from '@gpustack/core-ui';
 import { useMemoizedFn } from 'ahooks';
 import _ from 'lodash';
@@ -33,11 +31,6 @@ const Models = forwardRef((props, ref) => {
   const { setChunkRequest, createAxiosToken } = useSetChunkRequest();
   const { setChunkRequest: setModelInstanceChunkRequest } =
     useSetChunkRequest();
-  const {
-    watchDataList: targetList,
-    startWatch: startTargetsWatch,
-    cancelWatch: cancelTargetsWatch
-  } = useWatchList(MODEL_ROUTE_TARGETS);
   const [modelInstances, setModelInstances] = useState<any[]>([]);
   const [dataSource, setDataSource] = useState<{
     dataList: ListItem[];
@@ -262,7 +255,6 @@ const Models = forwardRef((props, ref) => {
     cacheInsDataListRef.current = [];
     chunkInstanceRequedtRef.current?.current?.cancel?.();
     instancesToken.current?.cancel?.();
-    cancelTargetsWatch();
   });
 
   const resumeRequestsOnPageActive = useMemoizedFn(async () => {
@@ -273,7 +265,6 @@ const Models = forwardRef((props, ref) => {
     await getAllModelInstances();
     await createModelsInstanceChunkRequest();
     await createModelsChunkRequest();
-    await startTargetsWatch();
   });
 
   const handleOnCancelViewLogs = useMemoizedFn(async () => {
@@ -492,7 +483,6 @@ const Models = forwardRef((props, ref) => {
         total={dataSource.total}
         deleteIds={dataSource.deletedIds}
         filterValues={filterValues}
-        targetList={targetList}
       ></TableList>
     </TableProvider>
   );

src/pages/llmodels/hooks/use-no-resource-result.tsx

@@ -95,7 +95,6 @@ const useNoResourceResult = (props: {
 
   const noResourceResult = (
     <NoResult
-      minHeight="calc(100vh - 300px)"
       loading={loading}
       loadend={loadend}
       dataSource={dataSource}

src/pages/llmodels/instance-view/index.tsx

@@ -109,7 +109,6 @@ const InstanceView = forwardRef((props, ref) => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}

src/pages/maas-provider/index.tsx

@@ -121,7 +121,6 @@ const MaasProvider: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -159,7 +158,6 @@ const MaasProvider: React.FC = () => {
         ></FilterBar>
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             rowKey="id"
             tableLayout="fixed"
             sortDirections={TABLE_SORT_DIRECTIONS}

src/pages/model-routes/index.tsx

@@ -364,7 +364,6 @@ const ModelRoutes: React.FC = () => {
         >
           <SealTable
             rowKey="id"
-            emptyMinHeight="calc(100vh - 300px)"
             loadChildren={loadChildrenData}
             sortDirections={TABLE_SORT_DIRECTIONS}
             expandedRowKeys={expandedRowKeys}
@@ -382,7 +381,6 @@ const ModelRoutes: React.FC = () => {
             expandable={true}
             empty={
               <NoResult
-                minHeight="calc(100vh - 300px)"
                 loading={dataSource.loading}
                 loadend={dataSource.loadend}
                 dataSource={dataSource.dataList}

src/pages/resources/components/gpus.tsx

@@ -72,7 +72,6 @@ const GPUList: React.FC<GPUListProps> = ({ clusterId, source }) => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -123,14 +122,14 @@ const GPUList: React.FC<GPUListProps> = ({ clusterId, source }) => {
             columns={columns}
             sortDirections={TABLE_SORT_DIRECTIONS}
             showSorterTooltip={false}
-            scroll={{ x: 'max-content' }}
-            className={'scroll-table'}
+            tableLayout={'auto'}
             dataSource={dataSource.dataList}
             loading={{
               spinning: dataSource.loading,
               size: 'middle'
             }}
             rowKey="id"
+            scroll={{ x: 900 }}
             onChange={handleTableChange}
             pagination={{
               showSizeChanger: true,

src/pages/resources/components/model-files.tsx

@@ -233,7 +233,6 @@ const ModelFiles = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -340,7 +339,6 @@ const ModelFiles = () => {
         ></FilterBar>
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             rowKey="id"
             tableLayout="fixed"
             sortDirections={TABLE_SORT_DIRECTIONS}

src/pages/resources/components/workers.tsx

@@ -303,7 +303,7 @@ const Workers: React.FC<WorkersProps> = ({ clusterId, source }) => {
             columns={columns}
             sortDirections={TABLE_SORT_DIRECTIONS}
             showSorterTooltip={false}
-            scroll={{ x: 'max-content' }}
+            tableLayout={'auto'}
             className={'scroll-table'}
             dataSource={dataSource.dataList}
             loading={{
@@ -311,6 +311,7 @@ const Workers: React.FC<WorkersProps> = ({ clusterId, source }) => {
               size: 'middle'
             }}
             rowKey="id"
+            scroll={{ x: 900 }}
             onChange={handleTableChange}
             rowSelection={source === 'clusterDetail' ? undefined : rowSelection}
             pagination={{

src/pages/users/index.tsx

@@ -141,7 +141,6 @@ const Users: React.FC = () => {
     if (type !== 'Table') return;
     return (
       <NoResult
-        minHeight="calc(100vh - 300px)"
         loading={dataSource.loading}
         loadend={dataSource.loadend}
         dataSource={dataSource.dataList}
@@ -186,7 +185,6 @@ const Users: React.FC = () => {
         ></FilterBar>
         <ConfigProvider renderEmpty={renderEmpty}>
           <Table
-            className={'scroll-table'}
             columns={columns}
             dataSource={dataList}
             rowSelection={rowSelection}