-
Notifications
You must be signed in to change notification settings - Fork 114
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Ahuna] Test assistants in side modal from gallery
- Loading branch information
1 parent
4d74500
commit 4cab17d
Showing
6 changed files
with
361 additions
and
88 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,165 @@ | ||
| import { Modal } from "@dust-tt/sparkle"; | ||
| import { | ||
| AgentConfigurationType, | ||
| AgentMention, | ||
| ConversationType, | ||
| InternalPostConversationsRequestBodySchema, | ||
| MentionType, | ||
| UserType, | ||
| } from "@dust-tt/types"; | ||
| import { WorkspaceType } from "@dust-tt/types"; | ||
| import Conversation from "./conversation/Conversation"; | ||
| import { useContext, useEffect, useState } from "react"; | ||
| import { PostConversationsResponseBody } from "@app/pages/api/w/[wId]/assistant/conversations"; | ||
| import { SendNotificationsContext } from "@app/components/sparkle/Notification"; | ||
| import { NotificationType } from "@app/components/sparkle/Notification"; | ||
| import * as t from "io-ts"; | ||
| import { deleteConversation, submitMessage } from "@app/lib/conversation"; | ||
| import { GenerationContextProvider } from "./conversation/GenerationContextProvider"; | ||
| import { FixedAssistantInputBar } from "./conversation/input_bar/InputBar"; | ||
|
|
||
| export function TryAssistantModal({ | ||
| owner, | ||
| user, | ||
| assistant, | ||
| onClose, | ||
| }: { | ||
| owner: WorkspaceType; | ||
| user: UserType; | ||
| assistant: AgentConfigurationType; | ||
| onClose: () => void; | ||
| }) { | ||
| const [stickyMentions, setStickyMentions] = useState<AgentMention[]>([ | ||
| { configurationId: assistant?.sId as string }, | ||
| ]); | ||
| const [conversation, setConversation] = useState< | ||
| ConversationType | null | { errorMessage: string } | ||
| >(null); | ||
| const sendNotification = useContext(SendNotificationsContext); | ||
|
|
||
| const handleSubmit = async ( | ||
| input: string, | ||
| mentions: MentionType[], | ||
| contentFragment?: { | ||
| title: string; | ||
| content: string; | ||
| } | ||
| ) => { | ||
| if (!conversation || "errorMessage" in conversation) return; | ||
| const messageData = { input, mentions, contentFragment }; | ||
| const result = await submitMessage({ | ||
| owner, | ||
| user, | ||
| conversationId: conversation.sId as string, | ||
| messageData, | ||
| }); | ||
| if (result.isOk()) return; | ||
| sendNotification({ | ||
| title: result.error.title, | ||
| description: result.error.message, | ||
| type: "error", | ||
| }); | ||
| }; | ||
|
|
||
| useEffect(() => { | ||
| setStickyMentions([{ configurationId: assistant?.sId as string }]); | ||
| if (assistant && !conversation) { | ||
| createEmptyConversation(owner.sId, assistant, sendNotification) | ||
| .then((conv) => { | ||
| setConversation(conv); | ||
| submitMessage({ | ||
| owner, | ||
| user, | ||
| conversationId: conv.sId, | ||
| messageData: { | ||
| input: "Hi, I'd like to try you out!", | ||
| mentions: [{ configurationId: assistant.sId }], | ||
| }, | ||
| }); | ||
| }) | ||
| .catch((e) => setConversation({ errorMessage: e.message })); | ||
| } | ||
| }, [assistant]); | ||
|
|
||
| return ( | ||
| <Modal | ||
| isOpen={!!assistant} | ||
| title={`Trying @${assistant?.name}`} | ||
| onClose={async () => { | ||
| onClose(); | ||
| if (conversation && "sId" in conversation) { | ||
| await deleteConversation({ | ||
| workspaceId: owner.sId, | ||
| conversationId: conversation?.sId as string, | ||
| sendNotification, | ||
| }); | ||
| setConversation(null); | ||
| } | ||
| }} | ||
| hasChanged={false} | ||
| variant="side-md" | ||
| > | ||
| {conversation && !("errorMessage" in conversation) && ( | ||
| <GenerationContextProvider> | ||
| <Conversation | ||
| owner={owner} | ||
| user={user} | ||
| conversationId={conversation.sId} | ||
| onStickyMentionsChange={setStickyMentions} | ||
| /> | ||
| <FixedAssistantInputBar | ||
| owner={owner} | ||
| onSubmit={handleSubmit} | ||
| stickyMentions={stickyMentions} | ||
| conversationId={conversation.sId} | ||
| />{" "} | ||
| </GenerationContextProvider> | ||
| )} | ||
| {conversation && "errorMessage" in conversation && ( | ||
| <div className="flex h-full flex-col items-center justify-center"> | ||
| <div className="text-center"> | ||
| <h2 className="text-2xl font-semibold"> | ||
| Error creating conversation | ||
| </h2> | ||
| <p className="text-structure-500 text-lg"> | ||
| {conversation.errorMessage} | ||
| </p> | ||
| </div> | ||
| </div> | ||
| )} | ||
| </Modal> | ||
| ); | ||
| } | ||
|
|
||
| async function createEmptyConversation( | ||
| workspaceId: string, | ||
| agentConfiguration: AgentConfigurationType, | ||
| sendNotification: (notification: NotificationType) => void | ||
| ): Promise<ConversationType> { | ||
| const body: t.TypeOf<typeof InternalPostConversationsRequestBodySchema> = { | ||
| title: `Trying out ${agentConfiguration.name}`, | ||
| visibility: "unlisted", | ||
| message: null, | ||
| contentFragment: undefined, | ||
| }; | ||
|
|
||
| const cRes = await fetch(`/api/w/${workspaceId}/assistant/conversations`, { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify(body), | ||
| }); | ||
|
|
||
| if (!cRes.ok) { | ||
| const data = await cRes.json(); | ||
| sendNotification({ | ||
| title: "Error creating conversation.", | ||
| description: data.error.message || "Please try again or contact us.", | ||
| type: "error", | ||
| }); | ||
| throw new Error(data.error.message); | ||
| } | ||
|
|
||
| return ((await cRes.json()) as PostConversationsResponseBody).conversation; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,130 @@ | ||
| import { NotificationType } from "@app/components/sparkle/Notification"; | ||
| import { | ||
| WorkspaceType, | ||
| MentionType, | ||
| UserType, | ||
| Result, | ||
| Err, | ||
| Ok, | ||
| } from "@dust-tt/types"; | ||
|
|
||
| export type ConversationErrorType = { | ||
| type: | ||
| | "attachment_upload_error" | ||
| | "message_send_error" | ||
| | "plan_limit_reached_error"; | ||
| title: string; | ||
| message: string; | ||
| }; | ||
|
|
||
| export async function submitMessage({ | ||
| owner, | ||
| user, | ||
| conversationId, | ||
| messageData, | ||
| }: { | ||
| owner: WorkspaceType; | ||
| user: UserType; | ||
| conversationId: string; | ||
| messageData: { | ||
| input: string; | ||
| mentions: MentionType[]; | ||
| contentFragment?: { | ||
| title: string; | ||
| content: string; | ||
| }; | ||
| }; | ||
| }): Promise<Result<void, ConversationErrorType>> { | ||
| const { input, mentions, contentFragment } = messageData; | ||
| // Create a new content fragment. | ||
| if (contentFragment) { | ||
| const mcfRes = await fetch( | ||
| `/api/w/${owner.sId}/assistant/conversations/${conversationId}/content_fragment`, | ||
| { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ | ||
| title: contentFragment.title, | ||
| content: contentFragment.content, | ||
| url: null, | ||
| contentType: "file_attachment", | ||
| context: { | ||
| timezone: Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC", | ||
| profilePictureUrl: user.image, | ||
| }, | ||
| }), | ||
| } | ||
| ); | ||
|
|
||
| if (!mcfRes.ok) { | ||
| const data = await mcfRes.json(); | ||
| console.error("Error creating content fragment", data); | ||
| return new Err({ | ||
| type: "attachment_upload_error", | ||
| title: "Error uploading file.", | ||
| message: data.error.message || "Please try again or contact us.", | ||
| }); | ||
| } | ||
| } | ||
|
|
||
| // Create a new user message. | ||
| const mRes = await fetch( | ||
| `/api/w/${owner.sId}/assistant/conversations/${conversationId}/messages`, | ||
| { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ | ||
| content: input, | ||
| context: { | ||
| timezone: Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC", | ||
| profilePictureUrl: user.image, | ||
| }, | ||
| mentions, | ||
| }), | ||
| } | ||
| ); | ||
|
|
||
| if (!mRes.ok) { | ||
| const data = await mRes.json(); | ||
| return new Err({ | ||
| type: | ||
| data.error.type === "test_plan_message_limit_reached" | ||
| ? "plan_limit_reached_error" | ||
| : "message_send_error", | ||
| title: "Your message could not be sent.", | ||
| message: data.error.message || "Please try again or contact us.", | ||
| }); | ||
| } | ||
| return new Ok(undefined); | ||
| } | ||
|
|
||
| export async function deleteConversation({ | ||
| workspaceId, | ||
| conversationId, | ||
| sendNotification, | ||
| }: { | ||
| workspaceId: string; | ||
| conversationId: string; | ||
| sendNotification: (notification: NotificationType) => void; | ||
| }) { | ||
| const res = await fetch( | ||
| `/api/w/${workspaceId}/assistant/conversations/${conversationId}`, | ||
| { | ||
| method: "DELETE", | ||
| } | ||
| ); | ||
|
|
||
| if (!res.ok) { | ||
| const data = await res.json(); | ||
| sendNotification({ | ||
| title: "Error deleting conversation.", | ||
| description: data.error.message || "Please try again or contact us.", | ||
| type: "error", | ||
| }); | ||
| return; | ||
| } | ||
| } |
Oops, something went wrong.