Skip to content

Commit 9887f11

Browse files
nkrantznkrantz
committed
chore: 2
1 parent 9c322bb commit 9887f11

File tree

4 files changed

+60
-55
lines changed

4 files changed

+60
-55
lines changed

‎packages/paste-website/src/components/assistant/AssistantCanvas.tsx‎

Lines changed: 35 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -64,40 +64,42 @@ export const AssistantCanvas: React.FC<AssistantCanvasProps> = ({ selectedThread
6464
<Box maxWidth="1000px" marginX="auto">
6565
{activeRun != null && <AssistantMessagePoller />}
6666
<AIChatLog ref={loggerRef}>
67-
<Text
68-
as="div"
69-
color="colorTextWeak"
70-
fontSize="fontSize20"
71-
lineHeight="lineHeight20"
72-
fontWeight="fontWeightMedium"
73-
textAlign="center"
74-
>
75-
Welcome to the Paste Design System Assistant! We&apos;re excited to have you here.
76-
</Text>
77-
<Text
78-
as="div"
79-
color="colorTextWeak"
80-
fontSize="fontSize20"
81-
lineHeight="lineHeight20"
82-
fontWeight="fontWeightMedium"
83-
textAlign="center"
84-
>
85-
Keep in mind that this is an experimental tool and so the information provided{" "}
86-
<Text as="div" fontWeight="fontWeightBold">
87-
may not be entirely accurate
67+
<Box display="flex" flexDirection="column" rowGap="space40">
68+
<Text
69+
as="span"
70+
color="colorTextWeak"
71+
fontSize="fontSize20"
72+
lineHeight="lineHeight20"
73+
fontWeight="fontWeightMedium"
74+
textAlign="center"
75+
>
76+
Welcome to the Paste Design System Assistant! We&apos;re excited to have you here.
8877
</Text>
89-
.
90-
</Text>
91-
<Text
92-
as="div"
93-
color="colorTextWeak"
94-
fontSize="fontSize20"
95-
lineHeight="lineHeight20"
96-
fontWeight="fontWeightMedium"
97-
textAlign="center"
98-
>
99-
Your conversations are not used to train OpenAI&apos;s models, but are stored by OpenAI.
100-
</Text>
78+
<Text
79+
as="span"
80+
color="colorTextWeak"
81+
fontSize="fontSize20"
82+
lineHeight="lineHeight20"
83+
fontWeight="fontWeightMedium"
84+
textAlign="center"
85+
>
86+
Keep in mind that this is an experimental tool and so the information provided{" "}
87+
<Text as="span" fontWeight="fontWeightBold">
88+
may not be entirely accurate
89+
</Text>
90+
.
91+
</Text>
92+
<Text
93+
as="span"
94+
color="colorTextWeak"
95+
fontSize="fontSize20"
96+
lineHeight="lineHeight20"
97+
fontWeight="fontWeightMedium"
98+
textAlign="center"
99+
>
100+
Your conversations are not used to train OpenAI&apos;s models, but are stored by OpenAI.
101+
</Text>
102+
</Box>
101103
{messages?.map((threadMessage): React.ReactNode => {
102104
if (threadMessage.role === "assistant") {
103105
return <AssistantMessage key={threadMessage.id} threadMessage={threadMessage} />;

‎packages/paste-website/src/components/assistant/AssistantMessage.tsx‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,24 @@
1-
import { ChatBubble, ChatMessage, ChatMessageMeta, ChatMessageMetaItem } from "@twilio-paste/chat-log";
1+
import { AIChatMessage, AIChatMessageAuthor, AIChatMessageBody } from "@twilio-paste/ai-chat-log";
22
import { type ThreadMessage } from "openai/resources/beta/threads/messages";
33
import * as React from "react";
44

5-
import { Logo } from "../../assets/Logo";
65
import { formatTimestamp } from "../../utils/formatTimestamp";
76
import { AssistantMarkdown } from "./AssistantMarkdown";
87

98
export const AssistantMessage: React.FC<{ threadMessage: ThreadMessage }> = ({ threadMessage }) => {
109
return (
11-
<ChatMessage variant="inbound">
12-
<ChatBubble>
10+
<AIChatMessage variant="bot">
11+
<AIChatMessageAuthor
12+
aria-label={`said by paste assistant at ${formatTimestamp(threadMessage.created_at)}`}
13+
avatarSrc="../../assets/Logo"
14+
>
15+
PasteBot
16+
</AIChatMessageAuthor>
17+
<AIChatMessageBody>
1318
{threadMessage.content[0].type === "text" && (
1419
<AssistantMarkdown key={threadMessage.id}>{threadMessage.content[0].text.value}</AssistantMarkdown>
1520
)}
16-
</ChatBubble>
17-
<ChatMessageMeta aria-label={`said by the assistant at ${formatTimestamp(threadMessage.created_at)}`}>
18-
<ChatMessageMetaItem>
19-
<Logo size={20} />
20-
PasteBot ・ {formatTimestamp(threadMessage.created_at)}
21-
</ChatMessageMetaItem>
22-
</ChatMessageMeta>
23-
</ChatMessage>
21+
</AIChatMessageBody>
22+
</AIChatMessage>
2423
);
2524
};

‎packages/paste-website/src/components/assistant/UserMessage.tsx‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import { ChatBubble, ChatMessage, ChatMessageMeta, ChatMessageMetaItem } from "@twilio-paste/chat-log";
1+
import { AIChatMessage, AIChatMessageAuthor, AIChatMessageBody } from "@twilio-paste/ai-chat-log";
2+
import { UserIcon } from "@twilio-paste/icons/esm/UserIcon";
23
import { type ThreadMessage } from "openai/resources/beta/threads/messages";
34
import * as React from "react";
45

@@ -7,15 +8,18 @@ import { AssistantMarkdown } from "./AssistantMarkdown";
78

89
export const UserMessage: React.FC<{ threadMessage: ThreadMessage }> = ({ threadMessage }) => {
910
return (
10-
<ChatMessage variant="outbound">
11-
<ChatBubble>
11+
<AIChatMessage variant="user">
12+
<AIChatMessageAuthor
13+
aria-label={`said by you at ${formatTimestamp(threadMessage.created_at)}`}
14+
avatarIcon={UserIcon}
15+
>
16+
You
17+
</AIChatMessageAuthor>
18+
<AIChatMessageBody>
1219
{threadMessage.content[0].type === "text" && (
1320
<AssistantMarkdown key={threadMessage.id}>{threadMessage.content[0].text.value}</AssistantMarkdown>
1421
)}
15-
</ChatBubble>
16-
<ChatMessageMeta aria-label={`said by you at ${formatTimestamp(threadMessage.created_at)}`}>
17-
<ChatMessageMetaItem>You ・ {formatTimestamp(threadMessage.created_at)}</ChatMessageMetaItem>
18-
</ChatMessageMeta>
19-
</ChatMessage>
22+
</AIChatMessageBody>
23+
</AIChatMessage>
2024
);
2125
};

‎packages/paste-website/src/pages/components/ai-chat-log/api.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,9 @@ import {
5252
AIChatMessage,
5353
AIChatMessageAuthor,
5454
AIChatMessageBody,
55-
AIChatMessageFeedback,
5655
AIChatMessageLoading,
57-
AIChatMessageMeta,
56+
AIChatMessageActionGroup,
57+
AIChatMessageActionCard,
5858
} from "@twilio-paste/ai-chat-log";
5959

6060
export const Basic = () => {

0 commit comments

Comments
 (0)