add properties for chat component

iamfaran · iamfaran · commit 11c98fd1119c · 2025-07-01T15:36:12.000+05:00
diff --git a/client/packages/lowcoder/src/comps/comps/chatComp/chatCompTypes.ts b/client/packages/lowcoder/src/comps/comps/chatComp/chatCompTypes.ts
@@ -1,11 +1,31 @@
 // client/packages/lowcoder/src/comps/comps/chatComp/chatCompTypes.ts
-import { StringControl } from "comps/controls/codeControl";
+import { StringControl, NumberControl } from "comps/controls/codeControl";
 import { withDefault } from "comps/generators";
+import { BoolControl } from "comps/controls/boolControl";
+import { dropdownControl } from "comps/controls/dropdownControl";
+
+// Model type dropdown options
+const ModelTypeOptions = [
+  { label: "Direct LLM", value: "direct-llm" },
+  { label: "n8n Workflow", value: "n8n" },
+] as const;
 
 export const chatChildrenMap = {
   text: withDefault(StringControl, "Chat Component Placeholder"),
+  modelHost: withDefault(StringControl, "http://localhost:11434"),
+  modelType: dropdownControl(ModelTypeOptions, "direct-llm"),
+  streaming: BoolControl.DEFAULT_TRUE,
+  systemPrompt: withDefault(StringControl, "You are a helpful assistant."),
+  agent: BoolControl,
+  maxInteractions: withDefault(NumberControl, 10),
 };
 
 export type ChatCompProps = {
   text: string;
+  modelHost: string;
+  modelType: "direct-llm" | "n8n";
+  streaming: boolean;
+  systemPrompt: string;
+  agent: boolean;
+  maxInteractions: number;
 };
diff --git a/client/packages/lowcoder/src/comps/comps/chatComp/chatPropertyView.tsx b/client/packages/lowcoder/src/comps/comps/chatComp/chatPropertyView.tsx
@@ -3,11 +3,17 @@ import React from "react";
 import { Section, sectionNames } from "lowcoder-design";
 
 export const ChatPropertyView = React.memo((props: any) => {
+  const { children } = props;
+
   return (
     <Section name={sectionNames.basic}>
-      {props.children.text.propertyView({ 
-        label: "Text" 
-      })}
+      {children.text.propertyView({ label: "Text" })}
+      {children.modelHost.propertyView({ label: "Model Host URL" })}
+      {children.modelType.propertyView({ label: "Model Type" })}
+      {children.streaming.propertyView({ label: "Streaming Responses" })}
+      {children.systemPrompt.propertyView({ label: "System Prompt" })}
+      {children.agent.propertyView({ label: "Agent Mode" })}
+      {children.maxInteractions.propertyView({ label: "Max Interactions" })}
     </Section>
   );
 });
diff --git a/client/packages/lowcoder/src/comps/comps/chatComp/chatView.tsx b/client/packages/lowcoder/src/comps/comps/chatComp/chatView.tsx
@@ -14,8 +14,13 @@ import "@assistant-ui/styles/markdown.css";
 export const ChatView = React.memo((props: ChatCompProps) => {
   // Create proper runtime using useChatRuntime
   const runtime = useChatRuntime({
-    api: "/api/chat", // We'll create this endpoint later
-  });
+    api: props.modelHost,
+    stream: props.streaming,
+    modelType: props.modelType as any,
+    systemPrompt: props.systemPrompt,
+    agent: props.agent,
+    maxTurns: props.maxInteractions,
+  } as any);
 
   return (
     <AssistantRuntimeProvider runtime={runtime}>
