feat: add text2img tool and backend frondend support

backend/app/core/db.py

@@ -74,7 +74,7 @@ def init_db(session: Session) -> None:
                 description=skill_info.description,
                 managed=True,
                 owner_id=user.id,
-                display_name=skill_info.display_name
+                display_name=skill_info.display_name,
             )
             session.add(new_skill)  # Prepare new skill for addition to the database
 
@@ -99,11 +99,7 @@ def init_modelprovider_model_db(session: Session) -> None:
         (1, 'Ollama', 'fakeurl', 'fakeapikey', 'string', 'string fake'),
         (2, 'Siliconflow', 'fakeurl', 'fakeapikey', 'string', 'siliconflow'),
         (3, 'zhipuai', 'https://open.bigmodel.cn/api/paas/v4', 'fakeapikey', 'zhipuai', '智谱AI')
-    ON CONFLICT (id) DO UPDATE
-        SET base_url = EXCLUDED.base_url,
-            api_key = EXCLUDED.api_key,
-            icon = EXCLUDED.icon,
-            description = EXCLUDED.description;
+    ON CONFLICT (id) DO NOTHING;
     """
 
     # Insert Models data

backend/app/core/tools/siliconflow/siliconflow.py

@@ -0,0 +1,51 @@
+import requests
+import json
+import requests
+from langchain.pydantic_v1 import BaseModel, Field
+from langchain.tools import StructuredTool
+
+
+class Text2ImageInput(BaseModel):
+    """Input for the text2img tool."""
+
+    prompt: str = Field(description="the prompt for generating image ")
+
+
+def text2img(
+    prompt: str,
+):
+    """
+    invoke tools
+    """
+
+    try:
+        # request URL
+        url = "https://api.siliconflow.cn/v1/image/generations"
+
+        payload = {
+            # "model": "black-forest-labs/FLUX.1-schnell",
+            "model": "stabilityai/stable-diffusion-3-medium",
+            "prompt": prompt,
+            "image_size": "1024x1024",
+        }
+        headers = {
+            "accept": "application/json",
+            "content-type": "application/json",
+            "authorization": "Bearer sk-uaxgsvfwwwpeuguzhsjpqigwopyhblsiesbptxnuxaoefqrb",
+        }
+
+        response = requests.post(url, json=payload, headers=headers)
+
+        return response.json()
+
+    except Exception as e:
+        return json.dumps(f"Openweather API Key is invalid. {e}")
+
+
+siliconflow = StructuredTool.from_function(
+    func=text2img,
+    name="Image Generation",
+    description="Image Generation is a tool that can generate images from text prompts.",
+    args_schema=Text2ImageInput,
+    return_direct=True,
+)

backend/app/initial_data.py

@@ -15,7 +15,7 @@
 def init() -> None:
     with Session(engine) as session:
         init_db(session)
-        # init_modelprovider_model_db(session)
+        init_modelprovider_model_db(session)
 
 
 def main() -> None:

web/src/components/Playground/ChatMain.tsx

@@ -359,6 +359,7 @@ const ChatMain = ({ isPlayground }: { isPlayground?: boolean }) => {
             key={index}
             message={message}
             onResume={onResumeHandler}
+            isPlayground = {isPlayground}
           />
         ))}
       </Box>

web/src/components/Playground/MessageBox.tsx

@@ -39,9 +39,10 @@ import Markdown from "../Markdown/Markdown";
 interface MessageBoxProps {
   message: ChatResponse;
   onResume: (decision: InterruptDecision, toolMessage: string | null) => void;
+  isPlayground?: boolean;
 }
 
-const MessageBox = ({ message, onResume }: MessageBoxProps) => {
+const MessageBox = ({ message, onResume, isPlayground }: MessageBoxProps) => {
   const { type, name, next, content, tool_calls, tool_output, documents } =
     message;
   const [decision, setDecision] = useState<InterruptDecision | null>(null);
@@ -89,10 +90,12 @@ const MessageBox = ({ message, onResume }: MessageBoxProps) => {
     <VStack spacing={0} my={4} onMouseEnter={onOpen} onMouseLeave={onClose}>
       <Box
         w="full"
-        ml={10}
-        mr={10}
-        pl={10}
-        pr={10}
+
+        ml={isPlayground ? "10" : "0"}
+        mr={isPlayground ? "10" : "0"}
+        pl={isPlayground ? "10" : "0"}
+        pr={isPlayground ? "10" : "0"}
+
         display="flex"
         alignItems="center"
         justifyContent={type === "human" ? "flex-end" : "flex-start"}