feat: generic_proxy

src/pages/cluster-management/credentials.tsx

@@ -28,7 +28,7 @@ import useCredentialColumns from './hooks/use-credential-columns';
 
 const addActions = [
   {
-    label: 'Digital Ocean',
+    label: 'DigitalOcean',
     locale: false,
     key: ProviderValueMap.DigitalOcean,
     value: ProviderValueMap.DigitalOcean,

src/pages/llmodels/config/button-actions.ts

@@ -50,6 +50,11 @@ export const ActionList: ActionItem[] = [
     key: 'chat',
     icon: icons.ExperimentOutlined
   },
+  // {
+  //   label: 'models.form.generic_proxy.button',
+  //   key: 'proxy',
+  //   icon: icons.CaptivePortal
+  // },
   {
     label: 'models.table.button.apiAccessInfo',
     key: 'api',
@@ -68,7 +73,7 @@ export const ActionList: ActionItem[] = [
   {
     label: 'models.button.accessSettings',
     key: 'accessControl',
-    icon: icons.Private
+    icon: icons.Permission
   },
   {
     label: 'common.button.delete',

src/pages/llmodels/config/types.ts

@@ -60,6 +60,7 @@ export interface FormData {
   local_path?: string;
   model_scope_model_id?: string;
   model_scope_file_path?: string;
+  generic_proxy?: boolean;
   gpu_selector?: {
     gpu_ids?: string[];
     gpu_type?: string;

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

@@ -25,7 +25,6 @@ const AdvanceConfig = () => {
   }, [backend, backendOptions]);
 
   const handleEnviromentVarsChange = (labels: Record<string, any>) => {
-    console.log('handleEnviromentVarsChange', labels);
     form.setFieldValue('env', labels);
   };
 
@@ -134,6 +133,20 @@ const AdvanceConfig = () => {
           })}
         ></CheckboxField>
       </Form.Item>
+      {/* <Form.Item<FormData>
+        name="generic_proxy"
+        valuePropName="checked"
+        style={{ marginBottom: 8 }}
+      >
+        <CheckboxField
+          description={intl.formatMessage({
+            id: 'models.form.generic_proxy.tips'
+          })}
+          label={intl.formatMessage({
+            id: 'models.form.generic_proxy'
+          })}
+        ></CheckboxField>
+      </Form.Item> */}
     </>
   );
 };

src/pages/llmodels/forms/schedule-type.tsx

@@ -220,7 +220,7 @@ const ScheduleTypeForm: React.FC = () => {
                     <InputWrapper>
                       <InputNumber
                         min={1}
-                        max={16}
+                        max={64}
                         step={1}
                         style={{ width: '100%' }}
                         defaultValue={

src/pages/llmodels/hooks/use-generic-proxy.tsx

@@ -0,0 +1,76 @@
+import ScrollerModal from '@/components/scroller-modal';
+import CommandViewer from '@/pages/_components/command-viewer';
+import { GPUSTACK_API, OPENAI_COMPATIBLE } from '@/pages/playground/apis';
+import { formatCurlArgs } from '@/pages/playground/view-code/utils';
+import { useIntl } from '@umijs/max';
+import { useState } from 'react';
+
+const langOptions = [{ label: 'Curl', value: 'bash' }];
+
+const generateCode = ({ api: url, parameters }: Record<string, any>) => {
+  const host = window.location.origin;
+  const api = url.replace(OPENAI_COMPATIBLE, GPUSTACK_API);
+
+  // ========================= Curl =========================
+  const curlCode = `
+curl ${host}${api} \\
+-H "Content-Type: application/json" \\
+-H "Authorization: Bearer $\{YOUR_GPUSTACK_API_KEY}" \\
+${formatCurlArgs(parameters, false)}`.trim();
+};
+
+const useGenericProxy = () => {
+  const intl = useIntl();
+  const [modalStatus, setModalStatus] = useState<{
+    open: boolean;
+    codeValue: string;
+  }>({ open: false, codeValue: '' });
+
+  const onCancel = () => {
+    setModalStatus({
+      open: false,
+      codeValue: ''
+    });
+  };
+
+  const openProxyModal = (data?: any) => {
+    setModalStatus({
+      open: true,
+      codeValue: data?.generic_proxy_command || ''
+    });
+  };
+
+  const GenericProxyModal = () => {
+    return (
+      <ScrollerModal
+        title={intl.formatMessage({
+          id: 'models.form.generic_title.button'
+        })}
+        open={modalStatus.open}
+        centered={true}
+        onCancel={onCancel}
+        destroyOnHidden={true}
+        closeIcon={true}
+        maskClosable={false}
+        keyboard={false}
+        width={700}
+        footer={false}
+      >
+        <CommandViewer
+          code={modalStatus.codeValue}
+          copyText={modalStatus.codeValue}
+          options={langOptions}
+          defaultValue={'bash'}
+        ></CommandViewer>
+      </ScrollerModal>
+    );
+  };
+
+  return {
+    GenericProxyModal,
+    openProxyModal,
+    setModalStatus
+  };
+};
+
+export default useGenericProxy;