microsoft · OEvgeny · Mar 6, 2026 · Mar 7, 2026 · Mar 17, 2026 · Mar 17, 2026
@@ -116,14 +116,17 @@ Breaking changes in this release:
    - `@msinternal/botframework-webchat-react-hooks` for helpers for React hooks
 - Added link sanitization and ESLint rules, in PR [#5564](https://github.com/microsoft/BotFramework-WebChat/pull/5564), by [@compulim](https://github.com/compulim)
 - Added blob URL sanitization and ESLint rules, in PR [#5568](https://github.com/microsoft/BotFramework-WebChat/pull/5568), by [@compulim](https://github.com/compulim)
-- Added visual message grouping following the `isPartOf` property of the `Message` entity, in PR [#5553](https://github.com/microsoft/BotFramework-WebChat/pull/5553), in PR [#5585](https://github.com/microsoft/BotFramework-WebChat/pull/5585), in PR [#5590](https://github.com/microsoft/BotFramework-WebChat/pull/5590), in PR [#5608](https://github.com/microsoft/BotFramework-WebChat/pull/5608), by [@OEvgeny](https://github.com/OEvgeny)
+- Added visual message grouping following the `isPartOf` property of the `Message` entity, in PR [#5553](https://github.com/microsoft/BotFramework-WebChat/pull/5553), in PR [#5585](https://github.com/microsoft/BotFramework-WebChat/pull/5585), in PR [#5590](https://github.com/microsoft/BotFramework-WebChat/pull/5590), in PR [#5608](https://github.com/microsoft/BotFramework-WebChat/pull/5608), in PR [#5773](https://github.com/microsoft/BotFramework-WebChat/pull/5773), by [@OEvgeny](https://github.com/OEvgeny)
    - The mode is suitable for providing chain-of-thought reasoning
    - Added visual indication of `creativeWorkStatus` property in `Message` entity:
       - `undefined` - no indicator is shown
       - `'Incomplete'` - show loader aside from the message
       - `'Published'` - show checkmark aside from the message
    - Added a `position` property support for the `Message` entity
       - The `position` property takes precedence over existing sequence ID
+   - Added support for explicit group status via `isPartOf.creativeWorkStatus` and `isPartOf.abstract` on the HowTo entity
+      - When the HowTo entity carries an explicit `creativeWorkStatus`, it takes precedence over status derived from individual messages
+      - When the HowTo entity carries an `abstract`, it is used as the group header title
 - Unified build info and injection of `<meta>` tag, in PR [#5571](https://github.com/microsoft/BotFramework-WebChat/pull/5571), by [@compulim](https://github.com/compulim)
 - Added documentation for `isPartOf` property, in PR [#5573](https://github.com/microsoft/BotFramework-WebChat/pull/5573), by [@compulim](https://github.com/compulim)
 - `fluent-theme`: Changed dependencies to import solely from the "bundle" package, in PR [#5584](https://github.com/microsoft/BotFramework-WebChat/pull/5584), by [@compulim](https://github.com/compulim)

@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Part grouping: status (copilot) (dark)</title>
+    <script>
+      location = './status?variant=copilot&fluent-theme=dark';
+    </script>
+  </head>
+  <body></body>
+</html>
@@ -146,13 +146,18 @@
         }
       };
 
-      const withModifiers = (activity, { position, status, abstract }) => ({
+      const withModifiers = (activity, { position, status, abstract, howToStatus, howToAbstract }) => ({
         ...activity,
         entities: activity.entities.map(entity => ({
           ...entity,
           ...(typeof abstract !== 'undefined' ? { abstract } : {}),
           ...(typeof position !== 'undefined' ? { position } : {}),
-          creativeWorkStatus: status
+          creativeWorkStatus: status,
+          isPartOf: {
+            ...entity.isPartOf,
+            ...(typeof howToStatus !== 'undefined' ? { creativeWorkStatus: howToStatus } : {}),
+            ...(typeof howToAbstract !== 'undefined' ? { abstract: howToAbstract } : {})
+          }
         }))
       });
 
@@ -247,6 +252,28 @@
       // Then: all activities should show the 'Published' status indicator
       await pageConditions.numActivitiesShown(6);
       await host.snapshot('local');
+
+      // When: folding the list:
+      await host.click(document.querySelector('.collapsible-grouping__toggle'));
+
+      // Then: should show published status in the group header
+      await host.snapshot('local');
+
+      // Test Case 8: HowTo-level status takes precedence
+      // When: setting the HowTo entity's creativeWorkStatus to 'Incomplete' while messages have 'Published'
+      directLine.emulateIncomingActivity(withModifiers(activities.at(0), { status: 'Published', abstract: 'one done', howToStatus: 'Incomplete', howToAbstract: 'HowTo in progress' }));
+
+      // Then: the group header should show 'Incomplete' because the HowTo status takes precedence over derived message status
+      await pageConditions.numActivitiesShown(6);
+      await host.snapshot('local');
+
+      // Test Case 9: HowTo-level status set to 'Published' overrides message-derived status
+      // When: a message is 'Incomplete' but the HowTo entity is explicitly 'Published'
+      directLine.emulateIncomingActivity(withModifiers(activities.at(3), { status: 'Incomplete', abstract: 'four in progress again', howToStatus: 'Published', howToAbstract: 'HowTo completed' }));
+
+      // Then: the group header should show 'Published' from the HowTo, not 'Incomplete' from the message
+      await pageConditions.numActivitiesShown(6);
+      await host.snapshot('local');
     });
   </script>
 </body>

@@ -181,38 +181,52 @@ function PartGroupingActivity(props: PartGroupingActivityProps) {
 
   const topAlignedCallout = isZeroOrPositive(bubbleNubOffset);
 
+  // The HowTo entity (the group root) may carry an explicit `creativeWorkStatus` and `abstract`.
+  // When present, it takes precedence over status derived from individual messages.
+  const [howToAbstract, howToStatus] = useMemo(() => {
+    const howToMessage = messages.find(message => message.isPartOf?.creativeWorkStatus);
+    const howTo = howToMessage?.isPartOf;
+
+    return [howTo?.abstract, howTo?.creativeWorkStatus];
+  }, [messages]);
+
   const defaultWorkStatus = useMemo(
     () => (messages.some(message => 'creativeWorkStatus' in message) ? 'Incomplete' : undefined),
     [messages]
   );
 
-  const currentGroupStatus = currentMessage?.creativeWorkStatus || defaultWorkStatus;
+  // Group status resolution:
+  // 1. If the HowTo entity has an explicit `creativeWorkStatus`, use it.
+  // 2. Otherwise, derive from the active message: find the first 'Incomplete' message's status.
+  // 3. Fall back to `defaultWorkStatus` which is 'Incomplete' if any message has a `creativeWorkStatus` property.
+  const currentGroupStatus = howToStatus || currentMessage?.creativeWorkStatus || defaultWorkStatus;
 
   /**
    * The idea behind group header is that it displays the state of the entire group:
-   * - We start by determining if the group should display a status (i.e., if any message in the group has a creativeWorkStatus).
-   * - If there is a status to display we display it.
+   * - We first check if the HowTo entity (isPartOf) has an explicit `creativeWorkStatus`.
+   * - If it does, we use it directly as the group status.
+   * - Otherwise, we derive status from messages: find the active 'Incomplete' message.
    * - For the title we check if the current group status is 'Incomplete'.
    * - If it is 'Incomplete', we show the abstract of the first message with 'Incomplete' status.
    * - If not, we fall back to a default title.
    */
   const groupHeader = useMemo(
     () => (
       <Fragment>
-        {defaultWorkStatus && (
+        {(howToStatus || defaultWorkStatus) && (
           <StackedLayoutMessageStatus
             className={classNames['part-grouping-activity__message-status']}
             creativeWorkStatus={currentGroupStatus}
           />
         )}
         <CollapsibleGroupingTitle>
-          {currentGroupStatus === 'Incomplete'
-            ? currentMessage?.abstract || localize('COLLAPSIBLE_GROUPING_TITLE')
+          {currentGroupStatus === 'Incomplete' || howToAbstract
+            ? howToAbstract || currentMessage?.abstract || localize('COLLAPSIBLE_GROUPING_TITLE')
             : localize('COLLAPSIBLE_GROUPING_TITLE')}
         </CollapsibleGroupingTitle>
       </Fragment>
     ),
-    [classNames, currentGroupStatus, currentMessage?.abstract, defaultWorkStatus, localize]
+    [classNames, currentGroupStatus, currentMessage?.abstract, defaultWorkStatus, howToAbstract, howToStatus, localize]
   );
 
   return (