Skip to content

Commit 158de18

Browse files
iamfaraniamfaran
committed
[feat] replace mock data with query
1 parent be3b3ab commit 158de18

File tree

6 files changed

+101
-20
lines changed

6 files changed

+101
-20
lines changed

‎client/packages/lowcoder/src/comps/comps/chatComp/chatComp.tsx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,21 @@ import { ChatPropertyView } from "./chatPropertyView";
77

88
// Build the component
99
const ChatTmpComp = new UICompBuilder(
10-
chatChildrenMap,
11-
(props) => <ChatView {...props} chatQuery={props.chatQuery.value} />
10+
chatChildrenMap,
11+
(props, dispatch) => (
12+
<ChatView
13+
{...props}
14+
chatQuery={props.chatQuery.value}
15+
currentMessage={props.currentMessage.value}
16+
dispatch={dispatch}
17+
/>
18+
)
1219
)
1320
.setPropertyViewFn((children) => <ChatPropertyView children={children} />)
1421
.build();
1522

16-
// Export the component
23+
// Export the component with exposed variables
1724
export const ChatComp = withExposingConfigs(ChatTmpComp, [
1825
new NameConfig("text", "Chat component text"),
26+
new NameConfig("currentMessage", "Current user message"),
1927
]);

‎client/packages/lowcoder/src/comps/comps/chatComp/chatCompTypes.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
// client/packages/lowcoder/src/comps/comps/chatComp/chatCompTypes.ts
22
import { StringControl, NumberControl } from "comps/controls/codeControl";
3+
import { stringExposingStateControl } from "comps/controls/codeStateControl";
34
import { withDefault } from "comps/generators";
45
import { BoolControl } from "comps/controls/boolControl";
56
import { dropdownControl } from "comps/controls/dropdownControl";
@@ -14,6 +15,7 @@ const ModelTypeOptions = [
1415
export const chatChildrenMap = {
1516
text: withDefault(StringControl, "Chat Component Placeholder"),
1617
chatQuery: QuerySelectControl,
18+
currentMessage: stringExposingStateControl("currentMessage", ""),
1719
modelType: dropdownControl(ModelTypeOptions, "direct-llm"),
1820
streaming: BoolControl.DEFAULT_TRUE,
1921
systemPrompt: withDefault(StringControl, "You are a helpful assistant."),
@@ -24,6 +26,7 @@ export const chatChildrenMap = {
2426
export type ChatCompProps = {
2527
text: string;
2628
chatQuery: string;
29+
currentMessage: string;
2730
modelType: string;
2831
streaming: boolean;
2932
systemPrompt: string;

‎client/packages/lowcoder/src/comps/comps/chatComp/chatPropertyView.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,11 @@ export const ChatPropertyView = React.memo((props: any) => {
99
<Section name={sectionNames.basic}>
1010
{children.text.propertyView({ label: "Text" })}
1111
{children.chatQuery.propertyView({ label: "Chat Query" })}
12+
{children.currentMessage.propertyView({
13+
label: "Current Message (Dynamic)",
14+
placeholder: "Shows the current user message",
15+
disabled: true
16+
})}
1217
{children.modelType.propertyView({ label: "Model Type" })}
1318
{children.streaming.propertyView({ label: "Enable Streaming" })}
1419
{children.systemPrompt.propertyView({

‎client/packages/lowcoder/src/comps/comps/chatComp/chatView.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,20 @@
11
// client/packages/lowcoder/src/comps/comps/chatComp/chatView.tsx
22
import React from "react";
33
import { ChatCompProps } from "./chatCompTypes";
4+
import { CompAction } from "lowcoder-core";
45
import { ChatApp } from "./components/ChatApp";
56

67
import "@assistant-ui/styles/index.css";
78
import "@assistant-ui/styles/markdown.css";
89

9-
export const ChatView = React.memo((props: ChatCompProps) => {
10-
return <ChatApp />;
10+
// Extend the props we receive so we can forward the redux dispatch
11+
interface ChatViewProps extends ChatCompProps {
12+
dispatch?: (action: CompAction<any>) => void;
13+
}
14+
15+
export const ChatView = React.memo((props: ChatViewProps) => {
16+
const { chatQuery, currentMessage, dispatch } = props;
17+
return <ChatApp chatQuery={chatQuery} currentMessage={currentMessage} dispatch={dispatch} />;
1118
});
1219

1320
ChatView.displayName = 'ChatView';

‎client/packages/lowcoder/src/comps/comps/chatComp/components/ChatApp.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
import { ChatProvider } from "./context/ChatContext";
22
import { ChatMain } from "./ChatMain";
3+
import { CompAction } from "lowcoder-core";
34

4-
export function ChatApp() {
5+
interface ChatAppProps {
6+
chatQuery: string;
7+
currentMessage: string;
8+
dispatch?: (action: CompAction<any>) => void;
9+
}
10+
11+
export function ChatApp({ chatQuery, currentMessage, dispatch }: ChatAppProps) {
512
return (
613
<ChatProvider>
7-
<ChatMain />
14+
<ChatMain chatQuery={chatQuery} currentMessage={currentMessage} dispatch={dispatch} />
815
</ChatProvider>
916
);
1017
}

‎client/packages/lowcoder/src/comps/comps/chatComp/components/ChatMain.tsx

Lines changed: 64 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ import {
1616
ArchivedThreadData
1717
} from "./context/ChatContext";
1818
import styled from "styled-components";
19+
import { routeByNameAction, executeQueryAction, CompAction, changeChildAction } from "lowcoder-core";
20+
import { getPromiseAfterDispatch } from "util/promiseUtils";
1921

2022
const ChatContainer = styled.div`
2123
display: flex;
@@ -45,17 +47,57 @@ const ChatContainer = styled.div`
4547

4648
const generateId = () => Math.random().toString(36).substr(2, 9);
4749

48-
const callYourAPI = async (text: string) => {
49-
// Simulate API delay
50-
await new Promise(resolve => setTimeout(resolve, 1500));
51-
52-
// Simple responses
53-
return {
54-
content: "This is a mock response from your backend. You typed: " + text
55-
};
50+
// Helper to call the Lowcoder query system
51+
const callQuery = async (
52+
queryName: string,
53+
prompt: string,
54+
dispatch?: (action: CompAction<any>) => void
55+
) => {
56+
// If no query selected or dispatch unavailable, fallback with mock response
57+
if (!queryName || !dispatch) {
58+
await new Promise((res) => setTimeout(res, 500));
59+
return { content: "(mock) You typed: " + prompt };
60+
}
61+
62+
try {
63+
const result: any = await getPromiseAfterDispatch(
64+
dispatch,
65+
routeByNameAction(
66+
queryName,
67+
executeQueryAction({
68+
// Send the user prompt as variable named 'prompt' by default
69+
args: { prompt: { value: prompt } },
70+
})
71+
)
72+
);
73+
74+
// Extract reply text from the query result
75+
let reply: string;
76+
if (typeof result === "string") {
77+
reply = result;
78+
} else if (result && typeof result === "object") {
79+
reply =
80+
(result as any).response ??
81+
(result as any).message ??
82+
(result as any).content ??
83+
JSON.stringify(result);
84+
} else {
85+
reply = String(result);
86+
}
87+
88+
return { content: reply };
89+
} catch (e: any) {
90+
throw new Error(e?.message || "Query execution failed");
91+
}
5692
};
5793

58-
export function ChatMain() {
94+
interface ChatMainProps {
95+
chatQuery: string;
96+
currentMessage: string;
97+
dispatch?: (action: CompAction<any>) => void;
98+
}
99+
100+
export function ChatMain({ chatQuery, currentMessage, dispatch }: ChatMainProps) {
59101
const { state, actions } = useChatContext();
60102
const [isRunning, setIsRunning] = useState(false);
61103

@@ -86,13 +128,18 @@ export function ChatMain() {
86128
timestamp: Date.now(),
87129
};
88130

131+
// Update currentMessage state to expose to queries
132+
if (dispatch) {
133+
dispatch(changeChildAction("currentMessage", userMessage.text, false));
134+
}
135+
89136
// Update current thread with new user message
90137
await actions.addMessage(state.currentThreadId, userMessage);
91138
setIsRunning(true);
92139

93140
try {
94-
// Call mock API
95-
const response = await callYourAPI(userMessage.text);
141+
// Call selected query / fallback to mock
142+
const response = await callQuery(chatQuery, userMessage.text, dispatch);
96143

97144
const assistantMessage: MyMessage = {
98145
id: generateId(),
@@ -140,13 +187,17 @@ export function ChatMain() {
140187
};
141188
newMessages.push(editedMessage);
142189

190+
// Update currentMessage state to expose to queries
191+
if (dispatch) {
192+
dispatch(changeChildAction("currentMessage", editedMessage.text, false));
193+
}
194+
143195
// Update messages using the new context action
144196
await actions.updateMessages(state.currentThreadId, newMessages);
145197
setIsRunning(true);
146198

147199
try {
148-
// Generate new response
149-
const response = await callYourAPI(editedMessage.text);
200+
const response = await callQuery(chatQuery, editedMessage.text, dispatch);
150201

151202
const assistantMessage: MyMessage = {
152203
id: generateId(),

0 commit comments

Comments
 (0)