chore: completions error handler

src/pages/playground/components/dynamic-params.tsx

@@ -37,7 +37,7 @@ type ParamsSettingsProps = {
   globalParams?: Record<string, any>;
   paramsConfig?: ParamsSchema[];
   initialValues?: Record<string, any>;
-  extra?: React.ReactNode[];
+  extra?: React.ReactNode;
 };
 
 const ParamsSettings: React.FC<ParamsSettingsProps> = forwardRef(

src/pages/playground/components/ground-embedding.tsx

@@ -2,6 +2,7 @@ import AlertInfo from '@/components/alert-info';
 import ScatterChart from '@/components/echarts/scatter';
 import HighlightCode from '@/components/highlight-code';
 import IconFont from '@/components/icon-font';
+import SealInputNumber from '@/components/seal-form/input-number';
 import HotKeys, { KeyMap } from '@/config/hotkeys';
 import useOverlayScroller from '@/hooks/use-overlay-scroller';
 import useRequestToken from '@/hooks/use-request-token';
@@ -13,7 +14,7 @@ import {
   SendOutlined
 } from '@ant-design/icons';
 import { useIntl, useSearchParams } from '@umijs/max';
-import { Button, Checkbox, Segmented, Spin, Tabs, Tooltip } from 'antd';
+import { Button, Checkbox, Form, Segmented, Spin, Tabs, Tooltip } from 'antd';
 import classNames from 'classnames';
 import _ from 'lodash';
 import { PCA } from 'ml-pca';
@@ -86,6 +87,7 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
   const [lessTwoInput, setLessTwoInput] = useState<boolean>(false);
   const multiplePasteEnable = useRef<boolean>(true);
   const selectionTextRef = useRef<any>(null);
+  const [metaData, setMetaData] = useState<Record<string, any>>({});
 
   const [textList, setTextList] = useState<
     { text: string; uid: number | string; name: string }[]
@@ -376,6 +378,14 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
     setOutputType(value);
   };
 
+  const handleModelChange = (value: string) => {
+    const model = modelList.find((item) => item.value === value);
+    if (model) {
+      console.log('model:', model);
+      setMetaData(model.meta || {});
+    }
+  };
+
   const outputItems = useMemo(() => {
     return [
       {
@@ -696,12 +706,25 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
         <div className="box">
           <DynamicParams
             ref={formRef}
+            onModelChange={handleModelChange}
             setParams={setParams}
             paramsConfig={paramsConfig}
             initialValues={initialValues}
             params={parameters}
             selectedModel={selectModel}
             modelList={modelList}
+            extra={
+              metaData?.n_ctx &&
+              metaData?.n_slot && (
+                <Form.Item>
+                  <SealInputNumber
+                    disabled
+                    label="Max Tokens"
+                    value={_.divide(metaData?.n_ctx, metaData?.n_slot)}
+                  ></SealInputNumber>
+                </Form.Item>
+              )
+            }
           />
         </div>
       </div>

src/pages/playground/components/ground-left.tsx

@@ -164,7 +164,6 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
         url: CHAT_API,
         signal
       });
-
       if (result?.error) {
         setTokenResult({
           error: true,
@@ -186,7 +185,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
         joinMessage(chunk);
       });
     } catch (error) {
-      // console.log('error:', error);
+      console.log('error:', error);
     } finally {
       setLoading(false);
     }

src/pages/playground/components/ground-reranker.tsx

@@ -1,4 +1,5 @@
 import AlertInfo from '@/components/alert-info';
+import SealInputNumber from '@/components/seal-form/input-number';
 import HotKeys, { KeyMap } from '@/config/hotkeys';
 import useOverlayScroller from '@/hooks/use-overlay-scroller';
 import useRequestToken from '@/hooks/use-request-token';
@@ -9,7 +10,7 @@ import {
   SendOutlined
 } from '@ant-design/icons';
 import { useIntl, useSearchParams } from '@umijs/max';
-import { Button, Checkbox, Input, Spin, Tag, Tooltip } from 'antd';
+import { Button, Checkbox, Form, Input, Spin, Tag, Tooltip } from 'antd';
 import classNames from 'classnames';
 import _ from 'lodash';
 import 'overlayscrollbars/overlayscrollbars.css';
@@ -125,6 +126,7 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
   const [sortIndexMap, setSortIndexMap] = useState<number[]>([]);
   const [queryValue, setQueryValue] = useState<string>('');
   const selectionTextRef = useRef<any>(null);
+  const [metaData, setMetaData] = useState<any>({});
 
   const { initialize, updateScrollerPosition: updateDocumentScrollerPosition } =
     useOverlayScroller();
@@ -426,6 +428,13 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
     []
   );
 
+  const handleModelChange = (value: string) => {
+    const model = modelList.find((item) => item.value === value);
+    if (model) {
+      setMetaData(model.meta || {});
+    }
+  };
+
   const handleClearDocuments = () => {
     setTextList([
       {
@@ -623,10 +632,23 @@ const GroundReranker: React.FC<MessageProps> = forwardRef((props, ref) => {
             ref={formRef}
             setParams={setParams}
             params={parameters}
+            onModelChange={handleModelChange}
             paramsConfig={paramsConfig}
             initialValues={initialValues}
             selectedModel={selectModel}
             modelList={modelList}
+            extra={
+              metaData?.n_ctx &&
+              metaData?.n_slot && (
+                <Form.Item>
+                  <SealInputNumber
+                    disabled
+                    label="Max Tokens"
+                    value={_.divide(metaData?.n_ctx, metaData?.n_slot)}
+                  ></SealInputNumber>
+                </Form.Item>
+              )
+            }
           />
         </div>
       </div>

src/pages/playground/embedding.tsx

@@ -38,7 +38,8 @@ const PlaygroundEmbedding: React.FC = () => {
         const list = _.map(res.data || [], (item: any) => {
           return {
             value: item.id,
-            label: item.id
+            label: item.id,
+            meta: item.meta
           };
         }) as Global.BaseOption<string>[];
         return list;

src/pages/playground/rerank.tsx

@@ -40,7 +40,8 @@ const PlaygroundRerank: React.FC = () => {
         const list = _.map(res.data || [], (item: any) => {
           return {
             value: item.id,
-            label: item.id
+            label: item.id,
+            meta: item.meta
           };
         }) as Global.BaseOption<string>[];
         return list;

src/request-config.ts

@@ -13,6 +13,7 @@ export const requestConfig: RequestConfig = {
     errorHandler: (error: any, opts: any) => {
       const { message: errorMessage, response } = error;
       const errMsg = response?.data?.message || errorMessage;
+
       if (!opts?.skipErrorHandler && response?.status) {
         message.error(errMsg);
       }

src/utils/fetch-chunk-data.ts

@@ -24,6 +24,21 @@ const extractJSON = (dataStr: string) => {
   return results;
 };
 
+const errorHandler = async (res: any) => {
+  try {
+    const data = await res.json();
+    return {
+      error: true,
+      data: data
+    };
+  } catch (error) {
+    return {
+      error: true,
+      message: res.statusText
+    };
+  }
+};
+
 /**
  *
  * @param params data: for post request, params: for get request
@@ -51,11 +66,11 @@ export const fetchChunkedData = async (params: {
       ...params.headers
     }
   });
-  console.log('response====', response);
+
   if (!response.ok) {
     return {
       error: true,
-      data: await response.json()
+      data: await errorHandler(response)
     };
   }
   const reader = response?.body?.getReader();
@@ -107,7 +122,7 @@ export const fetchChunkedDataPostFormData = async (params: {
   if (!response.ok) {
     return {
       error: true,
-      data: await response.json()
+      data: await errorHandler(response)
     };
   }
   const reader = response?.body?.getReader();