Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 51c22a3

Browse files
committed
Merge branch 'bot_ui_states' into 'master'
Bot UI: Display state messages See merge request postgres-ai/database-lab!885
2 parents a7024c7 + 337adee commit 51c22a3

File tree

4 files changed

+43
-22
lines changed

4 files changed

+43
-22
lines changed

‎ui/packages/platform/src/pages/Bot/Messages/Message/Message.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@ import cn from "classnames";
33
import ReactMarkdown, { Components } from "react-markdown";
44
import rehypeRaw from "rehype-raw";
55
import remarkGfm from "remark-gfm";
6-
import { Badge,makeStyles } from "@material-ui/core";
6+
import { makeStyles } from "@material-ui/core";
77
import { colors } from "@postgres.ai/shared/styles/colors";
88
import { icons } from "@postgres.ai/shared/styles/icons";
99
import { DebugDialog } from "../../DebugDialog/DebugDialog";
1010
import { CodeBlock } from "./CodeBlock";
1111
import { disallowedHtmlTagsForMarkdown, permalinkLinkBuilder } from "../../utils";
12-
import { BotMessage,DebugMessage } from "../../../../types/api/entities/bot";
13-
import{getDebugMessages}from"../../../../api/bot/getDebugMessages";
12+
import { StateMessage } from "../../../../types/api/entities/bot";
13+
1414

1515
type BaseMessageProps = {
1616
id: string | null;
@@ -20,6 +20,7 @@ type BaseMessageProps = {
2020
isLoading?: boolean;
2121
formattedTime?: string;
2222
aiModel?: string
23+
stateMessage?: StateMessage | null
2324
}
2425

2526
type AiMessageProps = BaseMessageProps & {
@@ -38,6 +39,7 @@ type LoadingMessageProps = BaseMessageProps & {
3839
isLoading: true;
3940
isAi: true;
4041
content?: undefined
42+
stateMessage: StateMessage | null
4143
}
4244

4345
type MessageProps = AiMessageProps | HumanMessageProps | LoadingMessageProps;
@@ -241,7 +243,8 @@ export const Message = React.memo((props: MessageProps) => {
241243
name,
242244
created_at,
243245
isLoading,
244-
aiModel
246+
aiModel,
247+
stateMessage
245248
} = props;
246249

247250
const [isDebugVisible, setDebugVisible] = useState(false);
@@ -335,8 +338,8 @@ export const Message = React.memo((props: MessageProps) => {
335338
{isLoading
336339
? <div className={classes.markdown}>
337340
<div className={classes.loading}>
338-
Thinking
339-
</div>
341+
{stateMessage&&stateMessage.state ? stateMessage.state : 'Thinking'}
342+
</div>
340343
</div>
341344
: <ReactMarkdown
342345
className={classes.markdown}

‎ui/packages/platform/src/pages/Bot/Messages/Messages.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -127,7 +127,7 @@ type FormattedTime = {
127127
}
128128

129129
export const Messages = React.memo(() => {
130-
const { messages, loading: isLoading, wsLoading: isWaitingForAnswer } = useAiBot();
130+
const { messages, loading: isLoading, wsLoading: isWaitingForAnswer, stateMessage } = useAiBot();
131131

132132
const rootRef = useRef<HTMLDivElement>(null);
133133
const wrapperRef = useRef<HTMLDivElement>(null);
@@ -276,7 +276,7 @@ export const Messages = React.memo(() => {
276276
)
277277
})}
278278
{isWaitingForAnswer &&
279-
<Message id={null} isLoading isAi={true} />
279+
<Message id={null} isLoading isAi={true} stateMessage={stateMessage}/>
280280
}
281281
</div>
282282
</div>

‎ui/packages/platform/src/pages/Bot/hooks.tsx

Lines changed: 25 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
import React, { createContext, useCallback, useContext, useEffect, useState } from "react";
99
import useWebSocket, {ReadyState} from "react-use-websocket";
1010
import { useLocation } from "react-router-dom";
11-
import { BotMessage, DebugMessage, AiModel } from "../../types/api/entities/bot";
11+
import { BotMessage, DebugMessage, AiModel,StateMessage } from "../../types/api/entities/bot";
1212
import {getChatsWithWholeThreads} from "../../api/bot/getChatsWithWholeThreads";
1313
import {getChats} from "api/bot/getChats";
1414
import {useAlertSnackbar} from "@postgres.ai/shared/components/AlertSnackbar/useAlertSnackbar";
@@ -45,18 +45,19 @@ type UseAiBotReturnType = {
4545
wsReadyState: ReadyState;
4646
changeChatVisibility: (threadId: string, isPublic: boolean) => void;
4747
isChangeVisibilityLoading: boolean;
48-
unsubscribe: (threadId: string) => void
49-
chatVisibility: 'public' | 'private'
50-
debugMessages: DebugMessage[] | null
51-
getDebugMessagesForWholeThread: () => void
48+
unsubscribe: (threadId: string) => void;
49+
chatVisibility: 'public' | 'private';
50+
debugMessages: DebugMessage[] | null;
51+
getDebugMessagesForWholeThread: () => void;
5252
chatsList: UseBotChatsListHook['chatsList'];
5353
chatsListLoading: UseBotChatsListHook['loading'];
54-
getChatsList: UseBotChatsListHook['getChatsList']
55-
aiModel: UseAiModelsList['aiModel'],
56-
setAiModel: UseAiModelsList['setAiModel']
57-
aiModels: UseAiModelsList['aiModels']
58-
aiModelsLoading: UseAiModelsList['loading']
54+
getChatsList: UseBotChatsListHook['getChatsList'];
55+
aiModel: UseAiModelsList['aiModel'];
56+
setAiModel: UseAiModelsList['setAiModel'];
57+
aiModels: UseAiModelsList['aiModels'];
58+
aiModelsLoading: UseAiModelsList['loading'];
5959
debugMessagesLoading: boolean;
60+
stateMessage: StateMessage | null;
6061
}
6162

6263
type UseAiBotArgs = {
@@ -88,6 +89,7 @@ export const useAiBotProviderValue = (args: UseAiBotArgs): UseAiBotReturnType =>
8889
const [error, setError] = useState<ErrorType | null>(null);
8990
const [wsLoading, setWsLoading] = useState<boolean>(false);
9091
const [chatVisibility, setChatVisibility] = useState<UseAiBotReturnType['chatVisibility']>('public');
92+
const [stateMessage, setStateMessage] = useState<StateMessage | null>(null)
9193

9294
const [isChangeVisibilityLoading, setIsChangeVisibilityLoading] = useState<boolean>(false);
9395

@@ -100,16 +102,25 @@ export const useAiBotProviderValue = (args: UseAiBotArgs): UseAiBotReturnType =>
100102

101103
const onWebSocketMessage = (event: WebSocketEventMap['message']) => {
102104
if (event.data) {
103-
const messageData: BotMessage | DebugMessage = JSON.parse(event.data);
105+
const messageData: BotMessage | DebugMessage |StateMessage= JSON.parse(event.data);
104106
if (messageData) {
105107
const isThreadMatching = threadId && threadId === messageData.thread_id;
106108
const isParentMatching = !threadId && 'parent_id' in messageData && messageData.parent_id && messages;
107109
const isDebugMessage = messageData.type === 'debug';
108-
if (isThreadMatching || isParentMatching || isDebugMessage) {
110+
const isStateMessage = messageData.type === 'state';
111+
if (isThreadMatching || isParentMatching || isDebugMessage || isStateMessage) {
109112
if (isDebugMessage) {
110113
let currentDebugMessages = [...(debugMessages || [])];
111114
currentDebugMessages.push(messageData)
112115
setDebugMessages(currentDebugMessages)
116+
} else if (isStateMessage) {
117+
if (isThreadMatching || !threadId) {
118+
if (messageData.state) {
119+
setStateMessage(messageData)
120+
} else {
121+
setStateMessage(null)
122+
}
123+
}
113124
} else {
114125
// Check if the last message needs its data updated
115126
let currentMessages = [...(messages || [])];
@@ -368,7 +379,8 @@ export const useAiBotProviderValue = (args: UseAiBotArgs): UseAiBotReturnType =>
368379
aiModelsLoading,
369380
chatVisibility,
370381
debugMessages,
371-
debugMessagesLoading
382+
debugMessagesLoading,
383+
stateMessage,
372384
}
373385
}
374386

‎ui/packages/platform/src/types/api/entities/bot.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,4 +34,10 @@ export type AiModel = {
3434
vendor: string;
3535
isThirdParty: boolean;
3636
freeUseAvailable: boolean;
37-
};
37+
};
38+
39+
export type StateMessage = {
40+
type: 'state'
41+
state: string | null
42+
thread_id: string
43+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /