chore: show llm code with common component

src/pages/playground/view-code/llm.ts

@@ -0,0 +1,54 @@
+import { GPUSTACK_API, OPENAI_COMPATIBLE } from '../apis';
+import { fomatNodeJsParams, formatCurlArgs, formatPyParams } from './utils';
+
+export const generateLLMCode = ({
+  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();
+
+  // ========================= Python =========================
+  const pythonCode = `
+from openai import OpenAI\n
+client = OpenAI(
+  base_url="${host}/${GPUSTACK_API}", 
+  api_key="YOUR_GPUSTACK_API_KEY"
+)
+
+response = client.chat.completions.create((\n${formatPyParams({ ...parameters })})\n
+print(response.choices[0].message.content)`.trim();
+
+  // ========================= Node.js =========================
+  const params = fomatNodeJsParams({
+    ...parameters
+  });
+
+  const nodeJsCode = `
+const OpenAI = require("openai");
+
+const openai = new OpenAI({
+  "apiKey": "YOUR_GPUSTACK_API_KEY",
+  "baseURL": "${host}/${GPUSTACK_API}"
+});
+
+async function main() {
+  const params = ${params}; 
+  const response = await openai.chat.completions.create(params);
+  console.log(response.choices[0].message.content);
+}
+main();`.trim();
+
+  return {
+    curlCode,
+    pythonCode,
+    nodeJsCode
+  };
+};

src/pages/playground/view-code/utils.ts

@@ -22,10 +22,14 @@ export const formatPyParams = (parameters: Record<string, any>) => {
     if (parameters[key] === null || parameters[key] === undefined) {
       return acc;
     }
+    const vauleType = typeof parameters[key];
     const value =
-      typeof parameters[key] === 'object'
+      vauleType === 'object'
         ? JSON.stringify(parameters[key], null, 2)
-        : `"${parameters[key]}"`;
+        : vauleType === 'string'
+          ? `"${parameters[key]}"`
+          : parameters[key];
+
     return acc + `  ${key}=${value},\n`;
   }, '');
 };