chore: provider form test

src/pages/maas-provider/hooks/use-create-provider.ts

@@ -1,7 +1,6 @@
 import { PageAction } from '@/config';
 import { PageActionType } from '@/config/types';
 import { useState } from 'react';
-import { maasProviderType } from '../config';
 import { MaasProviderItem as ListItem } from '../config/types';
 
 const useCreateProvider = (options: { refresh: () => void }) => {
@@ -10,13 +9,11 @@ const useCreateProvider = (options: { refresh: () => void }) => {
     action: PageActionType;
     currentData?: ListItem;
     title: string;
-    provider: maasProviderType | null;
   }>({
     open: false,
     action: PageAction.CREATE,
     currentData: undefined,
-    title: '',
-    provider: null
+    title: ''
   });
 
   const openModal = (action: PageActionType, title: string, row?: ListItem) => {
@@ -25,8 +22,7 @@ const useCreateProvider = (options: { refresh: () => void }) => {
       open: true,
       title: title,
       action,
-      currentData: row,
-      provider: row ? row.provider : null
+      currentData: row
     });
   };
 
@@ -35,8 +31,7 @@ const useCreateProvider = (options: { refresh: () => void }) => {
       open: false,
       action: PageAction.CREATE,
       currentData: undefined,
-      title: '',
-      provider: null
+      title: ''
     });
   };
 

src/pages/maas-provider/hooks/use-provider-columns.tsx

@@ -10,7 +10,7 @@ import { useMemo } from 'react';
 import ProviderLogo from '../components/provider-logo';
 import ProviderModels from '../components/provider-models';
 import { maasProviderLabelMap, rowActionList } from '../config';
-import { MaasProviderItem } from '../config/types';
+import { MaasProviderItem, ProviderModel } from '../config/types';
 
 const useProviderColumns = (
   handleSelect: (val: string, record: MaasProviderItem) => void,
@@ -41,7 +41,7 @@ const useProviderColumns = (
       },
       {
         title: intl.formatMessage({ id: 'providers.table.providerName' }),
-        dataIndex: 'provider',
+        dataIndex: ['config', 'type'],
         sorter: tableSorter(2),
         span: 4,
         minWidth: 160,
@@ -61,8 +61,9 @@ const useProviderColumns = (
         dataIndex: 'models',
         span: 3,
         minWidth: 200,
-        sorter: tableSorter(3),
-        render: (value: number) => <ProviderModels></ProviderModels>
+        render: (value: ProviderModel[]) => (
+          <ProviderModels dataList={value || []}></ProviderModels>
+        )
       },
       {
         title: intl.formatMessage({ id: 'common.table.createTime' }),

src/pages/maas-provider/hooks/use-query-provider-models.ts

@@ -0,0 +1,102 @@
+import { createAxiosToken } from '@/hooks/use-chunk-request';
+import { useRequest } from 'ahooks';
+import { message } from 'antd';
+import { CancelTokenSource } from 'axios';
+import { useEffect, useRef, useState } from 'react';
+import { queryProviderModels, testProviderModel } from '../apis';
+
+/**
+ *
+ * @returns loading, fetch, dataList
+ */
+export const useQueryProviderModels = () => {
+  const axiosTokenRef = useRef<CancelTokenSource | null>(null);
+  const [providerModelList, setProviderModelList] = useState<any[]>([]);
+
+  const {
+    run: fetchProviderModels,
+    loading,
+    cancel
+  } = useRequest(
+    async (params: {
+      data: { api_token: string; config: { type: string } };
+    }) => {
+      axiosTokenRef.current?.cancel();
+      axiosTokenRef.current = createAxiosToken();
+      return await queryProviderModels(params, {
+        token: axiosTokenRef.current.token
+      });
+    },
+    {
+      manual: true,
+      onSuccess: (response) => {
+        setProviderModelList(
+          response.data?.map((item: any) => ({
+            label: item.id,
+            value: item.id
+          })) || []
+        );
+      },
+      onError: () => {
+        setProviderModelList([]);
+      }
+    }
+  );
+
+  useEffect(() => {
+    return () => {
+      cancel();
+      axiosTokenRef.current?.cancel();
+    };
+  }, []);
+
+  return {
+    loading,
+    providerModelList,
+    fetchProviderModels
+  };
+};
+
+export const useTestProviderModel = () => {
+  const axiosTokenRef = useRef<CancelTokenSource | null>(null);
+
+  const {
+    runAsync: runTestModel,
+    loading,
+    cancel
+  } = useRequest(
+    async (params: {
+      data: { api_token: string; config: { type: string }; model_name: string };
+    }) => {
+      axiosTokenRef.current?.cancel();
+      axiosTokenRef.current = createAxiosToken();
+      const response = await testProviderModel(params, {
+        token: axiosTokenRef.current.token
+      });
+      return response;
+    },
+    {
+      manual: true,
+      onSuccess: (response) => {
+        if (!response?.accessible) {
+          message.error(response?.error_message || 'Test model failed');
+        }
+      },
+      onError: (error) => {
+        message.error(error?.message || 'Test model failed');
+      }
+    }
+  );
+
+  useEffect(() => {
+    return () => {
+      cancel();
+      axiosTokenRef.current?.cancel();
+    };
+  }, []);
+
+  return {
+    loading,
+    runTestModel
+  };
+};