feat: Message.Content Empty component (#607)

Yonom · Jul 29, 2024 · 2534938 · 2534938
1 parent 2019e39
commit 2534938
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/.changeset/tall-items-ring.md b/.changeset/tall-items-ring.md
@@ -0,0 +1,5 @@
+---
+"@assistant-ui/react": patch
+---
+
+feat: Message.Content Empty component
diff --git a/packages/react/src/context/providers/ContentPartProvider.tsx b/packages/react/src/context/providers/ContentPartProvider.tsx
@@ -51,7 +51,7 @@ const toContentPartStatus = (
   return message.status as ToolContentPartStatus;
 };
 
-const EMPTY_CONTENT = Object.freeze({ type: "text", text: "" });
+export const EMPTY_CONTENT = Object.freeze({ type: "text", text: "" });
 
 const getContentPartState = (
   { message }: MessageState,

diff --git a/packages/react/src/primitives/message/MessageContent.tsx b/packages/react/src/primitives/message/MessageContent.tsx
@@ -7,7 +7,10 @@ import {
   useThreadContext,
 } from "../../context";
 import { useMessageContext } from "../../context/react/MessageContext";
-import { ContentPartProvider } from "../../context/providers/ContentPartProvider";
+import {
+  ContentPartProvider,
+  EMPTY_CONTENT,
+} from "../../context/providers/ContentPartProvider";
 import { ContentPartPrimitiveText } from "../contentPart/ContentPartText";
 import { ContentPartPrimitiveImage } from "../contentPart/ContentPartImage";
 import { ContentPartPrimitiveDisplay } from "../contentPart/ContentPartDisplay";
@@ -23,6 +26,7 @@ import { ContentPartPrimitiveInProgress } from "../contentPart/ContentPartInProg
 export type MessagePrimitiveContentProps = {
   components?:
     | {
+        Empty?: TextContentPartComponent | undefined;
         Text?: TextContentPartComponent | undefined;
         Image?: ImageContentPartComponent | undefined;
         UI?: UIContentPartComponent | undefined;
@@ -63,6 +67,7 @@ type MessageContentPartComponentProps = {
 
 const MessageContentPartComponent: FC<MessageContentPartComponentProps> = ({
   components: {
+    Empty = defaultComponents.Text,
     Text = defaultComponents.Text,
     Image = defaultComponents.Image,
     UI = defaultComponents.UI,
@@ -81,6 +86,8 @@ const MessageContentPartComponent: FC<MessageContentPartComponentProps> = ({
     case "text":
       if (status.type === "requires-action")
         throw new Error("Encountered unexpected requires-action status");
+      if (part === EMPTY_CONTENT) return <Empty part={part} status={status} />;
+
       return <Text part={part} status={status} />;
 
     case "image":