heimoshuiyu/chatgpt-api-web
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Replace ChatBubbleAvatar with improved layout in Message component; update MessageHide component to use Badge for context indication

Browse Source
This commit is contained in:
ecwu
2024-12-21 12:10:49 +08:00
parent 346634c0d0
commit 1656e16c7c
2 changed files with 2 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/message.tsx
View File

@@ -124,7 +124,6 @@ export default function Message(props: Props) {
variant={chat.role === "assistant" ? "received" : "sent"} variant={chat.role === "assistant" ? "received" : "sent"}
className={chat.role !== "assistant" ? "flex-row-reverse" : ""} className={chat.role !== "assistant" ? "flex-row-reverse" : ""}
> >
<ChatBubbleAvatar fallback={chat.role === "assistant" ? "AI" : "US"} />
<ChatBubbleMessage isLoading={false}> <ChatBubbleMessage isLoading={false}>
{chat.hide ? ( {chat.hide ? (
<MessageHide chat={chat} /> <MessageHide chat={chat} />

5
src/messageHide.tsx
View File

@@ -1,5 +1,6 @@
import { ChatStoreMessage } from "@/types/chatstore"; import { ChatStoreMessage } from "@/types/chatstore";
import { getMessageText } from "@/chatgpt"; import { getMessageText } from "@/chatgpt";
import { Badge } from "./components/ui/badge";
interface Props { interface Props {
chat: ChatStoreMessage; chat: ChatStoreMessage;
@@ -9,9 +10,7 @@ export function MessageHide({ chat }: Props) {
return ( return (
<div className="flex items-center gap-2 text-sm text-muted-foreground"> <div className="flex items-center gap-2 text-sm text-muted-foreground">
<span>{getMessageText(chat).split("\n")[0].slice(0, 18)} ...</span> <span>{getMessageText(chat).split("\n")[0].slice(0, 18)} ...</span>
<span className="rounded-md bg-secondary px-2 py-1 text-xs"> <Badge variant="secondary">Removed from context</Badge>
Removed from context
</span>
</div> </div>
); );
} }