diff --git a/CHANGELOG.md b/CHANGELOG.md index d964ae03c1..883c7b9207 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -116,7 +116,7 @@ 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 @@ -124,6 +124,9 @@ Breaking changes in this release: - `'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 `` 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) diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html b/__tests__/html2/part-grouping/status.copilot.dark.html new file mode 100644 index 0000000000..bccd350824 --- /dev/null +++ b/__tests__/html2/part-grouping/status.copilot.dark.html @@ -0,0 +1,10 @@ + + + + Part grouping: status (copilot) (dark) + + + + diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-1.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-1.png new file mode 100644 index 0000000000..7def3bc449 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-1.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-10.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-10.png new file mode 100644 index 0000000000..99c440c0f5 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-10.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-11.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-11.png new file mode 100644 index 0000000000..04d4d32ac7 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-11.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-12.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-12.png new file mode 100644 index 0000000000..639ef4254c Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-12.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-13.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-13.png new file mode 100644 index 0000000000..ab7802839e Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-13.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-2.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-2.png new file mode 100644 index 0000000000..374aaf74e6 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-2.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-3.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-3.png new file mode 100644 index 0000000000..bdb508617b Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-3.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-4.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-4.png new file mode 100644 index 0000000000..9ad5f474bc Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-4.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-5.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-5.png new file mode 100644 index 0000000000..8ee4efd9d9 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-5.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-6.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-6.png new file mode 100644 index 0000000000..d30ae3baae Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-6.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-7.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-7.png new file mode 100644 index 0000000000..925d2ab863 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-7.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-8.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-8.png new file mode 100644 index 0000000000..34961c31ad Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-8.png differ diff --git a/__tests__/html2/part-grouping/status.copilot.dark.html.snap-9.png b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-9.png new file mode 100644 index 0000000000..d0b364c5e8 Binary files /dev/null and b/__tests__/html2/part-grouping/status.copilot.dark.html.snap-9.png differ diff --git a/__tests__/html2/part-grouping/status.html b/__tests__/html2/part-grouping/status.html index 668fd90e3f..894282cdd9 100644 --- a/__tests__/html2/part-grouping/status.html +++ b/__tests__/html2/part-grouping/status.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'); }); diff --git a/__tests__/html2/part-grouping/status.html.snap-11.png b/__tests__/html2/part-grouping/status.html.snap-11.png new file mode 100644 index 0000000000..f8d5adbe88 Binary files /dev/null and b/__tests__/html2/part-grouping/status.html.snap-11.png differ diff --git a/__tests__/html2/part-grouping/status.html.snap-12.png b/__tests__/html2/part-grouping/status.html.snap-12.png new file mode 100644 index 0000000000..ad4d67801b Binary files /dev/null and b/__tests__/html2/part-grouping/status.html.snap-12.png differ diff --git a/__tests__/html2/part-grouping/status.html.snap-13.png b/__tests__/html2/part-grouping/status.html.snap-13.png new file mode 100644 index 0000000000..32959b9008 Binary files /dev/null and b/__tests__/html2/part-grouping/status.html.snap-13.png differ diff --git a/packages/component/src/Middleware/ActivityGrouping/ui/PartGrouping/private/PartGroupingActivity.tsx b/packages/component/src/Middleware/ActivityGrouping/ui/PartGrouping/private/PartGroupingActivity.tsx index 98e8876a2a..ffe759fe6c 100644 --- a/packages/component/src/Middleware/ActivityGrouping/ui/PartGrouping/private/PartGroupingActivity.tsx +++ b/packages/component/src/Middleware/ActivityGrouping/ui/PartGrouping/private/PartGroupingActivity.tsx @@ -181,17 +181,31 @@ 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. @@ -199,20 +213,20 @@ function PartGroupingActivity(props: PartGroupingActivityProps) { const groupHeader = useMemo( () => ( - {defaultWorkStatus && ( + {(howToStatus || defaultWorkStatus) && ( )} - {currentGroupStatus === 'Incomplete' - ? currentMessage?.abstract || localize('COLLAPSIBLE_GROUPING_TITLE') + {currentGroupStatus === 'Incomplete' || howToAbstract + ? howToAbstract || currentMessage?.abstract || localize('COLLAPSIBLE_GROUPING_TITLE') : localize('COLLAPSIBLE_GROUPING_TITLE')} ), - [classNames, currentGroupStatus, currentMessage?.abstract, defaultWorkStatus, localize] + [classNames, currentGroupStatus, currentMessage?.abstract, defaultWorkStatus, howToAbstract, howToStatus, localize] ); return (