From 5902550fbcf3c281d9ab6e01f3002dc85b710531 Mon Sep 17 00:00:00 2001
From: ling1726 <lingfangao@hotmail.com>
Date: Mon, 4 Jan 2021 14:24:12 +0000
Subject: [PATCH] Remove default value for chat header slot (#16321)

* Remove default value for chat header slot

* update changelog

* Always render header slot

Co-authored-by: Lingfan Gao <lingfan.gao@microsoft.com>
---
 packages/fluentui/CHANGELOG.md                                 | 1 +
 .../react-northstar/src/components/Chat/ChatMessage.tsx        | 3 +--
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/fluentui/CHANGELOG.md b/packages/fluentui/CHANGELOG.md
index f463afcaed67b..fac958018ed69 100644
--- a/packages/fluentui/CHANGELOG.md
+++ b/packages/fluentui/CHANGELOG.md
@@ -72,6 +72,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Fix Menu styles for `Toolbar` @TanelVari ([#16141](https://github.com/microsoft/fluentui/pull/16141))
 - Fix the type for `onBlur`callback in the `Dropdown` component @ling1726 ([#16257](https://github.com/microsoft/fluentui/pull/16257))
 - Fix missing export for `AttachmentBodyStylesProps` @ling1726 ([#16260](https://github.com/microsoft/fluentui/pull/16260))
+- Fix throwing error when using `ChatMessage` with children without declaring the `header` prop @ling1726 ([#16321](https://github.com/microsoft/fluentui/pull/16321))
 
 ### Features
 - Add 2.0 light and dark themes @jurokapsiar ([#15867](https://github.com/microsoft/fluentui/pull/15867))
diff --git a/packages/fluentui/react-northstar/src/components/Chat/ChatMessage.tsx b/packages/fluentui/react-northstar/src/components/Chat/ChatMessage.tsx
index 25d4568b80fde..c573db873831b 100644
--- a/packages/fluentui/react-northstar/src/components/Chat/ChatMessage.tsx
+++ b/packages/fluentui/react-northstar/src/components/Chat/ChatMessage.tsx
@@ -342,7 +342,7 @@ export const ChatMessage: ComponentWithAs<'div', ChatMessageProps> &
 
   const readStatusElement = createShorthand(ChatMessageReadStatus, readStatus, {});
 
-  const headerElement = createShorthand(ChatMessageHeader, header, {
+  const headerElement = createShorthand(ChatMessageHeader, header || {}, {
     overrideProps: () => ({
       content: (
         <>
@@ -395,7 +395,6 @@ ChatMessage.displayName = 'ChatMessage';
 ChatMessage.defaultProps = {
   accessibility: chatMessageBehavior,
   badgePosition: 'end',
-  header: {},
   positionActionMenu: true,
   reactionGroupPosition: 'start',
 };