From 7146cdac6290053d728359a0523cf6d2f9ce5e9c Mon Sep 17 00:00:00 2001
From: Rebecca Alpert <ralpert@redhat.com>
Date: Fri, 31 Oct 2025 14:05:37 -0400
Subject: [PATCH] feat(Message): Allow for no avatar

---
 .../chatbot/examples/Messages/BotMessage.tsx     |  1 +
 .../chatbot/examples/Messages/UserMessage.tsx    |  1 +
 packages/module/src/Message/Message.test.tsx     |  4 ++++
 packages/module/src/Message/Message.tsx          | 16 +++++++++-------
 4 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx
index ce79badce..ba27a65f8 100644
--- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx
+++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx
@@ -318,6 +318,7 @@ _Italic text, formatted with single underscores_
         content="This bot has a square avatar. You can further customize the avatar by applying an additional class or passing [PatternFly avatar props](/components/avatar) to the `<Message>` component via `avatarProps`."
         hasRoundAvatar={false}
       />
+      <Message name="Bot" role="bot" content="This is a message from a bot with no avatar." />
       <Select
         id="single-select"
         isOpen={isOpen}
diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessage.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessage.tsx
index e32dca0b3..651200f41 100644
--- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessage.tsx
+++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessage.tsx
@@ -333,6 +333,7 @@ _Italic text, formatted with single underscores_
         avatar={userAvatar}
         avatarProps={{ isBordered: true }}
       />
+      <Message name="User" role="user" content="This is a user message with no avatar" />
       <Message
         name="User"
         role="user"
diff --git a/packages/module/src/Message/Message.test.tsx b/packages/module/src/Message/Message.test.tsx
index bfc7e42f7..351242fdd 100644
--- a/packages/module/src/Message/Message.test.tsx
+++ b/packages/module/src/Message/Message.test.tsx
@@ -228,6 +228,10 @@ describe('Message', () => {
     render(<Message avatar="./testImg" role="bot" name="Bot" content="Hi" />);
     expect(screen.getByRole('img')).toHaveAttribute('src', './testImg');
   });
+  it('should not render avatar if no avatar prop is passed', () => {
+    render(<Message role="bot" name="Bot" content="Hi" />);
+    expect(screen.queryByRole('img')).not.toBeInTheDocument();
+  });
   it('should render botWord correctly', () => {
     render(<Message avatar="./img" role="bot" name="Bot" content="Hi" botWord="人工知能" />);
     expect(screen.getByText('Bot')).toBeTruthy();
diff --git a/packages/module/src/Message/Message.tsx b/packages/module/src/Message/Message.tsx
index b51c8cc85..6be74c3a2 100644
--- a/packages/module/src/Message/Message.tsx
+++ b/packages/module/src/Message/Message.tsx
@@ -97,7 +97,7 @@ export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
   /** Name of the user */
   name?: string;
   /** Avatar src for the user */
-  avatar: string;
+  avatar?: string;
   /** Timestamp for the message */
   timestamp?: string;
   /** Set this to true if message is being loaded */
@@ -459,12 +459,14 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
       {...props}
     >
       {/* We are using an empty alt tag intentionally in order to reduce noise on screen readers */}
-      <Avatar
-        className={`pf-chatbot__message-avatar ${hasRoundAvatar ? 'pf-chatbot__message-avatar--round' : ''} ${avatarClassName ? avatarClassName : ''}`}
-        src={avatar}
-        alt=""
-        {...avatarProps}
-      />
+      {avatar && (
+        <Avatar
+          className={`pf-chatbot__message-avatar ${hasRoundAvatar ? 'pf-chatbot__message-avatar--round' : ''} ${avatarClassName ? avatarClassName : ''}`}
+          src={avatar}
+          alt=""
+          {...avatarProps}
+        />
+      )}
       <div className="pf-chatbot__message-contents">
         <div className="pf-chatbot__message-meta">
           {name && (