feat: add supports for testing llm models (#1454)

* feat: add supports for testing llm models

* fix: linter error

web/src/app/home/models/component/llm-form/LLMForm.tsx

@@ -130,6 +130,7 @@ export default function LLMForm({
   const [requesterDefaultURLList, setRequesterDefaultURLList] = useState<
     string[]
   >([]);
+  const [modelTesting, setModelTesting] = useState(false);
 
   useEffect(() => {
     initLLMModelFormComponent().then(() => {
@@ -308,6 +309,34 @@ export default function LLMForm({
     }
   }
 
+  function testLLMModelInForm() {
+    setModelTesting(true);
+    httpClient
+      .testLLMModel('_', {
+        uuid: '',
+        name: form.getValues('name'),
+        description: '',
+        requester: form.getValues('model_provider'),
+        requester_config: {
+          base_url: form.getValues('url'),
+          timeout: 120,
+        },
+        api_keys: [form.getValues('api_key')],
+        abilities: form.getValues('abilities'),
+        extra_args: form.getValues('extra_args'),
+      })
+      .then((res) => {
+        console.log(res);
+        toast.success(t('models.testSuccess'));
+      })
+      .catch(() => {
+        toast.error(t('models.testError'));
+      })
+      .finally(() => {
+        setModelTesting(false);
+      });
+  }
+
   return (
     <div>
       <Dialog
@@ -579,6 +608,15 @@ export default function LLMForm({
               {editMode ? t('common.save') : t('common.submit')}
             </Button>
 
+            <Button
+              type="button"
+              variant="outline"
+              onClick={() => testLLMModelInForm()}
+              disabled={modelTesting}
+            >
+              {t('common.test')}
+            </Button>
+
             <Button
               type="button"
               variant="outline"

web/src/app/infra/http/HttpClient.ts

@@ -271,6 +271,10 @@ class HttpClient {
     return this.put(`/api/v1/provider/models/llm/${uuid}`, model);
   }
 
+  public testLLMModel(uuid: string, model: LLMModel): Promise<object> {
+    return this.post(`/api/v1/provider/models/llm/${uuid}/test`, model);
+  }
+
   // ============ Pipeline API ============
   public getGeneralPipelineMetadata(): Promise<GetPipelineMetadataResponseData> {
     // as designed, this method will be deprecated, and only for developer to check the prefered config schema