fix: fetch list page more than total page

src/hooks/use-table-fetch.ts

@@ -35,11 +35,13 @@ export default function useTableFetch<ListItem>(options: {
     loading: boolean;
     loadend: boolean;
     total: number;
+    totalPage: number;
   }>({
     dataList: [...defaultData],
     loading: false,
     loadend: false,
-    total: 0
+    total: 0,
+    totalPage: 0
   });
   const [queryParams, setQueryParams] = useState<any>({
     page: 1,
@@ -55,6 +57,7 @@ export default function useTableFetch<ListItem>(options: {
       setDataSource((pre) => {
         return {
           total: pre.total,
+          totalPage: pre.totalPage,
           loading: false,
           loadend: true,
           dataList: list,
@@ -97,11 +100,32 @@ export default function useTableFetch<ListItem>(options: {
       };
       const res = await fetchAPI(params);
 
+      if (
+        !res.items.length &&
+        params.page > res.pagination.totalPage &&
+        res.pagination.totalPage > 0
+      ) {
+        const newParams = {
+          ...params,
+          page: res.pagination.totalPage
+        };
+        const newRes = await fetchAPI(newParams);
+        setDataSource({
+          dataList: newRes.items || [],
+          loading: false,
+          loadend: true,
+          total: newRes.pagination.total,
+          totalPage: newRes.pagination.totalPage
+        });
+        return;
+      }
+
       setDataSource({
         dataList: res.items || [],
         loading: false,
         loadend: true,
-        total: res.pagination.total
+        total: res.pagination.total,
+        totalPage: res.pagination.totalPage
       });
     } catch (error) {
       console.log('error', error);
@@ -109,7 +133,8 @@ export default function useTableFetch<ListItem>(options: {
         dataList: [],
         loading: false,
         loadend: true,
-        total: dataSource.total
+        total: dataSource.total,
+        totalPage: dataSource.totalPage
       });
     }
   };

src/pages/llmodels/components/advance-config.tsx

@@ -170,13 +170,13 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
     onValuesChange?.({}, form.getFieldsValue());
   };
 
-  const onSelectorChange = (field: string) => {
+  const onSelectorChange = (field: string, allowEmpty?: boolean) => {
     const workerSelector = form.getFieldValue(field);
     // check if all keys have values
     const hasEmptyValue = _.some(_.keys(workerSelector), (k: string) => {
       return !workerSelector[k];
     });
-    if (!hasEmptyValue) {
+    if (!hasEmptyValue || allowEmpty) {
       onValuesChange?.({}, form.getFieldsValue());
     }
   };
@@ -190,7 +190,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
   };
 
   const handleEnvSelectorOnBlur = () => {
-    onSelectorChange('env');
+    onSelectorChange('env', true);
   };
 
   const handleDeleteEnvSelector = (index: number) => {
@@ -428,32 +428,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             }
           ></ListInput>
         </Form.Item>
-        <Form.Item<FormData>
-          name="env"
-          rules={[
-            () => ({
-              validator(rule, value) {
-                if (_.keys(value).length > 0) {
-                  if (_.some(_.keys(value), (k: string) => !value[k])) {
-                    return Promise.reject(
-                      intl.formatMessage(
-                        {
-                          id: 'common.validate.value'
-                        },
-                        {
-                          name: intl.formatMessage({
-                            id: 'common.text.variable'
-                          })
-                        }
-                      )
-                    );
-                  }
-                }
-                return Promise.resolve();
-              }
-            })
-          ]}
-        >
+        <Form.Item<FormData> name="env">
           <LabelSelector
             label={intl.formatMessage({
               id: 'models.form.env'

src/pages/llmodels/index.tsx

@@ -123,6 +123,29 @@ const Models: React.FC = () => {
         const res: any = await queryModelsList(params, {
           cancelToken: axiosToken.token
         });
+
+        if (
+          !res.items.length &&
+          params.page > res.pagination.totalPage &&
+          res.pagination.totalPage > 0
+        ) {
+          const newParams = {
+            ...params,
+            page: res.pagination.totalPage
+          };
+          const newRes: any = await queryModelsList(newParams, {
+            cancelToken: axiosToken.token
+          });
+          setDataSource({
+            dataList: newRes.items || [],
+            loading: false,
+            loadend: true,
+            total: newRes.pagination.total,
+            deletedIds: []
+          });
+          return;
+        }
+
         setDataSource({
           dataList: res.items || [],
           loading: false,