[LG-5932, LG-5934] refactor,feature(chat) Compound MessageFeed#3488
Merged
shaneeza merged 14 commits intos/initial-message-integrationfrom Jan 29, 2026
Merged
[LG-5932, LG-5934] refactor,feature(chat) Compound MessageFeed#3488shaneeza merged 14 commits intos/initial-message-integrationfrom
shaneeza merged 14 commits intos/initial-message-integrationfrom
Conversation
…afygreen-ui into LG-5932-message-feed-compound
🦋 Changeset detectedLatest commit: 5681c08 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Contributor
There was a problem hiding this comment.
Pull request overview
This PR refactors MessageFeed into a compound component and introduces a new context provider. The changes prepare the component for more flexible composition while temporarily removing the assistant name display from messages.
Changes:
- Refactored
MessageFeedto use theCompoundComponentpattern - Added
MessageFeedContextwith provider and custom hook for managing feed state - Removed assistant avatar and name display from non-sender messages in
Messagecomponent
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| chat/message/src/Message/Message.tsx | Removes assistant avatar/name rendering and related dependencies |
| chat/message-feed/src/MessageFeedContext/index.ts | Exports new context provider and hook |
| chat/message-feed/src/MessageFeedContext/MessageFeedContext.types.ts | Defines types for the MessageFeed context |
| chat/message-feed/src/MessageFeedContext/MessageFeedContext.tsx | Implements context provider and hook with error boundary |
| chat/message-feed/src/MessageFeedContext/MessageFeedContext.spec.tsx | Adds test coverage for the context hook |
| chat/message-feed/src/MessageFeed/MessageFeed.tsx | Wraps component with CompoundComponent wrapper |
| chat/message-feed/shared.types.ts | Defines subcomponent property constants for compound pattern |
| .changeset/dark-pots-tell.md | Documents changes for release notes |
chat/message-feed/src/MessageFeedContext/MessageFeedContext.tsx
Outdated
Show resolved
Hide resolved
shaneeza
requested review from
adamrasheed and
stephl3
and removed request for
a team
Contributor
|
Size Change: +63 B (0%) Total Size: 1.83 MB
ℹ️ View Unchanged
|
stephl3
requested changes
Jan 27, 2026
.changeset/dark-pots-tell.md
Outdated
| @@ -0,0 +1,6 @@ | |||
| --- | |||
| '@lg-chat/message-feed': path | |||
Collaborator
There was a problem hiding this comment.
Suggested change
| '@lg-chat/message-feed': path | |
| '@lg-chat/message-feed': patch |
Collaborator
There was a problem hiding this comment.
actually, this should be a minor since we're adding this context feature
adamrasheed
reviewed
Jan 28, 2026
chat/message-feed/tsconfig.json
Outdated
| } | ||
| ] | ||
| } | ||
| } No newline at end of file |
Collaborator
Author
There was a problem hiding this comment.
my cursor settings we're all screwed up 🙃
| }, | ||
| ), | ||
| { | ||
| displayName: 'MessageFeed', |
Collaborator
There was a problem hiding this comment.
do we need to add a key here? I dont have too much context on the larger project but im not sure where MessageFeedSubcomponentProperty.InitialMessage should be going
Collaborator
Author
There was a problem hiding this comment.
Yes! I will add it in the next PR.
Contributor
|
Coverage after merging LG-5932-message-feed-compound into s/initial-message-integration will be
Coverage Report for Changed Files
|
|||||||||||||||||||
stephl3
approved these changes
Jan 28, 2026
adamrasheed
approved these changes
Jan 28, 2026
shaneeza
merged commit 4b0df9a
into
s/initial-message-integration
12 of 13 checks passed
This was referenced Jan 29, 2026
gargantia-prime
pushed a commit
that referenced
this pull request
Feb 5, 2026
* [LG-5932, LG-5934] refactor,feature(chat) Compound MessageFeed (#3488) * refactor(MessageFeed): convert to CompoundComponent and temp remove assistant name * refactor(MessageFeed): enhance component structure * feat(MessageFeed): add MessageFeedContext * docs(MessageFeed): add changeset * fix(MessageFeed): update error message for context provider * refactor(Message): undo message changes * chore(MessageFeed): add compound-component dependency * chore(pnpm-lock): add compound-component to dependencies * refactor(MessageFeed): move shared types * chore(changeset): update dependency version for @lg-chat/message-feed * fix(tsconfig): add missing newline at end of file * fix(MessageFeedContext): handle error boundary for React 17 in context hook tests * testing * [LG-5935] feat(message-feed) InitialMessage Subcomponent (#3490) * refactor(MessageFeed): convert to CompoundComponent and temp remove assistant name * refactor(MessageFeed): enhance component structure * feat(MessageFeed): add MessageFeedContext * docs(MessageFeed): add changeset * fix(MessageFeed): update error message for context provider * refactor(Message): undo message changes * chore(MessageFeed): add compound-component dependency * chore(pnpm-lock): add compound-component to dependencies * chore(MessageFeed): update dependencies for compound-component integration * refactor(MessageFeed): move shared types * refactor(InitialMessage): update import path for shared types and use enum for key * feat(InitialMessage): integrate MessageFeedContext to manage initial message visibility * chore(changeset): update dependency version for @lg-chat/message-feed * fix(tsconfig): add missing newline at end of file * fix(MessageFeedContext): handle error boundary for React 17 in context hook tests * feat(InitialMessage): implement styles and update component structure for initial message display * feat(InitialMessage): enhance initial message component with structured content and styles * refactor(InitialMessage): replace hardcoded title and description with constants for improved maintainability * feat(ChatWindow): add initial message prompts and enhance message handling in chat window stories * refactor(ChatWindow): remove enableHideOnSelect prop from Suggested Prompts in initial message component * test(InitialMessage): add unit tests for accessibility, rendering, and visibility behavior * test(MessageFeed): enhance tests with scrollTo mock and update query methods for initial message visibility * refactor(InitialMessage): simplify getWrapperStyles function and remove unused props * chore(MessageFeed): update dependencies and tsconfig to include new LeafyGreen UI components * refactor(ChatWindow): rename initial message component and update props for message prompts * chore(MessageFeed): remove unused @leafygreen-ui/hooks dependency from package.json and pnpm-lock.yaml * refactor(MessageFeed): remove commented-out MyMessage component from InitialMessage story * chore(MessageFeed): update changeset * refactor(InitialMessage): update styles for title and description components * refactor(InitialMessage): adjust inner wrapper styles with focus ring for improved layout * refactor(InitialMessage): restructure inner wrapper and remove description styles for cleaner layout * refactor(InitialMessage): integrate LeafyGreenProvider for dark mode support and simplify props in stories * refactor(InitialMessage): remove LeafyGreenProvider and streamline component structure for improved readability * feat(InitialMessage): add generated story for initialMessage * refactor(InitialMessage): update AssistantAvatar size and adjust props in InitialMessage types for improved clarity * fix(InitialMessage): export InitialMessageProps type for better type safety * refactor(InitialMessage): Components to components * refactor(InitialMessage): update import paths from Components to components * feat(InitialMessage): add interactive story for message addition with state management * fix(InitialMessage): add visibility property to transition styles for improved animation handling * feat(MessageFeed): enhance InitialMessage stories with new message handling and improve visibility checks in tests * refactor(MessageFeed): simplify initial message handling by removing unnecessary state and improving readability * refactor(MessageFeed): export InitialMessageProps type for better accessibility in message feed components * chore(MessageFeed): disable Chromatic snapshots for InitialMessage stories to streamline visual testing * [LG-5933] feat(message-feed) MessagePrompts Subcomponent (#3491) * refactor(MessageFeed): convert to CompoundComponent and temp remove assistant name * refactor(MessageFeed): enhance component structure * feat(MessageFeed): add MessageFeedContext * docs(MessageFeed): add changeset * fix(MessageFeed): update error message for context provider * refactor(Message): undo message changes * chore(MessageFeed): add compound-component dependency * chore(pnpm-lock): add compound-component to dependencies * chore(MessageFeed): update dependencies for compound-component integration * refactor(MessageFeed): move shared types * refactor(InitialMessage): update import path for shared types and use enum for key * feat(InitialMessage): integrate MessageFeedContext to manage initial message visibility * chore(changeset): update dependency version for @lg-chat/message-feed * fix(tsconfig): add missing newline at end of file * fix(MessageFeedContext): handle error boundary for React 17 in context hook tests * feat(InitialMessage): implement styles and update component structure for initial message display * feat(InitialMessage): enhance initial message component with structured content and styles * refactor(InitialMessage): replace hardcoded title and description with constants for improved maintainability * feat(ChatWindow): add initial message prompts and enhance message handling in chat window stories * refactor(ChatWindow): remove enableHideOnSelect prop from Suggested Prompts in initial message component * test(InitialMessage): add unit tests for accessibility, rendering, and visibility behavior * test(MessageFeed): enhance tests with scrollTo mock and update query methods for initial message visibility * refactor(InitialMessage): simplify getWrapperStyles function and remove unused props * chore(MessageFeed): update dependencies and tsconfig to include new LeafyGreen UI components * refactor(ChatWindow): rename initial message component and update props for message prompts * chore(MessageFeed): remove unused @leafygreen-ui/hooks dependency from package.json and pnpm-lock.yaml * refactor(MessageFeed): remove commented-out MyMessage component from InitialMessage story * chore(MessageFeed): update changeset * refactor(MessageFeed): integrate MessagePrompts and MessagePrompt components into InitialMessage * refactor(InitialMessage): update styles for title and description components * refactor(InitialMessage): adjust inner wrapper styles with focus ring for improved layout * test(InitialMessage, MessagePrompt, MessagePrompts): enhance tests for rendering and type validation * refactor(InitialMessage): rename component and add message prompts for enhanced user interaction * chore(pnpm-lock): add '@lg-chat/message-prompts' dependency and clean up unused entries * test(InitialMessage, MessagePrompts): improve error handling tests for enableHideOnSelect prop * chore(changeset): update to include new components * test(InitialMessage): fix JSX syntax in type validation tests for proper rendering * test(MessageFeed): add tests for rendering MessagePrompts and its child MessagePrompt components * refactor(InitialMessage): restructure inner wrapper and remove description styles for cleaner layout * refactor(InitialMessage): integrate LeafyGreenProvider for dark mode support and simplify props in stories * test(InitialMessage, MessageFeed): update tests to ensure proper rendering of MessagePrompts and prevent rendering of children when not a subcomponent * refactor(InitialMessage): remove LeafyGreenProvider and simplify component structure for improved readability * refactor(InitialMessage): remove LeafyGreenProvider and streamline component structure for improved readability * feat(InitialMessage): add generated story for initialMessage * feat(InitialMessage): enhance story with interactive MessagePrompts and update children prop for better demonstration * chore(ALL_PACKAGES): revert ALL_PACKAGES * refactor(InitialMessage): update AssistantAvatar size and adjust props in InitialMessage types for improved clarity * fix(InitialMessage): export InitialMessageProps type for better type safety * refactor(InitialMessage): Components to components * refactor(InitialMessage): update import paths from Components to components * feat(InitialMessage): add interactive story for message addition with state management * fix(InitialMessage): add visibility property to transition styles for improved animation handling * feat(MessageFeed): enhance InitialMessage stories with new message handling and improve visibility checks in tests * feat(InitialMessage): rename Components to components * fix(InitialMessage): update import paths from Components to components for consistency * refactor(InitialMessage): replace MessageFeedSubcomponentProperty with InitialMessageSubcomponentProperty in relevant components * feat(MessagePromptsItem): add MessagePromptsItem component with associated types and tests * refactor(MessagePrompts): rename MessagePrompt to MessagePromptsItem across components and update related tests and stories * refactor(MessageFeed): simplify initial message handling by removing unnecessary state and improving readability * refactor(MessageFeed): export InitialMessageProps type for better accessibility in message feed components * refactor(MessageFeed): export additional message prompts types for improved component integration * [LG-5936] feat(message-feed): ResourceList Subcomponent (#3495) * refactor(MessageFeed): convert to CompoundComponent and temp remove assistant name * refactor(MessageFeed): enhance component structure * feat(MessageFeed): add MessageFeedContext * docs(MessageFeed): add changeset * fix(MessageFeed): update error message for context provider * refactor(Message): undo message changes * chore(MessageFeed): add compound-component dependency * chore(pnpm-lock): add compound-component to dependencies * chore(MessageFeed): update dependencies for compound-component integration * refactor(MessageFeed): move shared types * refactor(InitialMessage): update import path for shared types and use enum for key * feat(InitialMessage): integrate MessageFeedContext to manage initial message visibility * chore(changeset): update dependency version for @lg-chat/message-feed * fix(tsconfig): add missing newline at end of file * fix(MessageFeedContext): handle error boundary for React 17 in context hook tests * feat(InitialMessage): implement styles and update component structure for initial message display * feat(InitialMessage): enhance initial message component with structured content and styles * refactor(InitialMessage): replace hardcoded title and description with constants for improved maintainability * feat(ChatWindow): add initial message prompts and enhance message handling in chat window stories * refactor(ChatWindow): remove enableHideOnSelect prop from Suggested Prompts in initial message component * test(InitialMessage): add unit tests for accessibility, rendering, and visibility behavior * test(MessageFeed): enhance tests with scrollTo mock and update query methods for initial message visibility * refactor(InitialMessage): simplify getWrapperStyles function and remove unused props * chore(MessageFeed): update dependencies and tsconfig to include new LeafyGreen UI components * refactor(ChatWindow): rename initial message component and update props for message prompts * chore(MessageFeed): remove unused @leafygreen-ui/hooks dependency from package.json and pnpm-lock.yaml * refactor(MessageFeed): remove commented-out MyMessage component from InitialMessage story * chore(MessageFeed): update changeset * refactor(MessageFeed): integrate MessagePrompts and MessagePrompt components into InitialMessage * refactor(InitialMessage): update styles for title and description components * refactor(InitialMessage): adjust inner wrapper styles with focus ring for improved layout * test(InitialMessage, MessagePrompt, MessagePrompts): enhance tests for rendering and type validation * refactor(InitialMessage): rename component and add message prompts for enhanced user interaction * chore(pnpm-lock): add '@lg-chat/message-prompts' dependency and clean up unused entries * test(InitialMessage, MessagePrompts): improve error handling tests for enableHideOnSelect prop * chore(changeset): update to include new components * test(InitialMessage): fix JSX syntax in type validation tests for proper rendering * test(MessageFeed): add tests for rendering MessagePrompts and its child MessagePrompt components * feat(MessageFeed): add ResourceLists and ResourceList properties to MessageFeedSubcomponentProperty * feat(MessageFeed): add InitialMessageWithResourceList story and update InitialMessage component to include ResourceList and ResourceListItem * refactor(InitialMessage): restructure inner wrapper and remove description styles for cleaner layout * refactor(ResourceListItem): update styles to use theme-based icon colors and improve structure * refactor(InitialMessage): integrate LeafyGreenProvider for dark mode support and simplify props in stories * test(InitialMessage, MessageFeed): update tests to ensure proper rendering of MessagePrompts and prevent rendering of children when not a subcomponent * refactor(InitialMessage): remove LeafyGreenProvider and simplify component structure for improved readability * refactor(InitialMessage): remove LeafyGreenProvider and streamline component structure for improved readability * feat(InitialMessage): add generated story for initialMessage * feat(InitialMessage): enhance story with interactive MessagePrompts and update children prop for better demonstration * chore(ALL_PACKAGES): revert ALL_PACKAGES * fix(InitialMessage): remove unused darkMode prop from story and include resourceList in the InitialMessage component * feat(ResourceList): integrate LeafyGreenProvider for dark mode support and update ResourceListProps to include DarkModeProps * feat(InitialMessage): add additional resource list items and update story configuration for enhanced interactivity * fix(ResourceListItem): update prop documentation for glyph and children to clarify usage * docs(MessageFeed): update changeset * refactor(InitialMessage): update AssistantAvatar size and adjust props in InitialMessage types for improved clarity * fix(InitialMessage): export InitialMessageProps type for better type safety * refactor(InitialMessage): Components to components * refactor(InitialMessage): update import paths from Components to components * feat(InitialMessage): add interactive story for message addition with state management * fix(InitialMessage): add visibility property to transition styles for improved animation handling * feat(MessageFeed): enhance InitialMessage stories with new message handling and improve visibility checks in tests * feat(InitialMessage): rename Components to components * fix(InitialMessage): update import paths from Components to components for consistency * refactor(InitialMessage): replace MessageFeedSubcomponentProperty with InitialMessageSubcomponentProperty in relevant components * feat(MessagePromptsItem): add MessagePromptsItem component with associated types and tests * refactor(MessagePrompts): rename MessagePrompt to MessagePromptsItem across components and update related tests and stories * feat(InitialMessage): implement InitialMessage component with accessibility tests, styles, and subcomponents for prompts and resource lists * fix(MessageFeed): correct import paths for InitialMessage component * feat(ResourceListItem): export ResourceListItemProps type for improved type safety * test(InitialMessage): add tests for ResourceList subcomponent and update existing tests * refactor(MessageFeed): simplify initial message handling by removing unnecessary state and improving readability * refactor(MessageFeed): export InitialMessageProps type for better accessibility in message feed components * feat(index): export ResourceList and its props for improved component accessibility * refactor(MessageFeed): export additional message prompts types for improved component integration * fix(chat) Update MessagePrompt padding (#3502) * fix(MessagePrompt.styles): update padding values for improved layout consistency * Update MessagePrompt padding to align with design specifications * (message-feed) InitialMessage README (#3498) * refactor(MessageFeed): convert to CompoundComponent and temp remove assistant name * refactor(MessageFeed): enhance component structure * feat(MessageFeed): add MessageFeedContext * docs(MessageFeed): add changeset * fix(MessageFeed): update error message for context provider * refactor(Message): undo message changes * chore(MessageFeed): add compound-component dependency * chore(pnpm-lock): add compound-component to dependencies * chore(MessageFeed): update dependencies for compound-component integration * refactor(MessageFeed): move shared types * refactor(InitialMessage): update import path for shared types and use enum for key * feat(InitialMessage): integrate MessageFeedContext to manage initial message visibility * chore(changeset): update dependency version for @lg-chat/message-feed * fix(tsconfig): add missing newline at end of file * fix(MessageFeedContext): handle error boundary for React 17 in context hook tests * feat(InitialMessage): implement styles and update component structure for initial message display * feat(InitialMessage): enhance initial message component with structured content and styles * refactor(InitialMessage): replace hardcoded title and description with constants for improved maintainability * feat(ChatWindow): add initial message prompts and enhance message handling in chat window stories * refactor(ChatWindow): remove enableHideOnSelect prop from Suggested Prompts in initial message component * test(InitialMessage): add unit tests for accessibility, rendering, and visibility behavior * test(MessageFeed): enhance tests with scrollTo mock and update query methods for initial message visibility * refactor(InitialMessage): simplify getWrapperStyles function and remove unused props * chore(MessageFeed): update dependencies and tsconfig to include new LeafyGreen UI components * refactor(ChatWindow): rename initial message component and update props for message prompts * chore(MessageFeed): remove unused @leafygreen-ui/hooks dependency from package.json and pnpm-lock.yaml * refactor(MessageFeed): remove commented-out MyMessage component from InitialMessage story * chore(MessageFeed): update changeset * refactor(MessageFeed): integrate MessagePrompts and MessagePrompt components into InitialMessage * refactor(InitialMessage): update styles for title and description components * refactor(InitialMessage): adjust inner wrapper styles with focus ring for improved layout * test(InitialMessage, MessagePrompt, MessagePrompts): enhance tests for rendering and type validation * refactor(InitialMessage): rename component and add message prompts for enhanced user interaction * chore(pnpm-lock): add '@lg-chat/message-prompts' dependency and clean up unused entries * test(InitialMessage, MessagePrompts): improve error handling tests for enableHideOnSelect prop * chore(changeset): update to include new components * test(InitialMessage): fix JSX syntax in type validation tests for proper rendering * test(MessageFeed): add tests for rendering MessagePrompts and its child MessagePrompt components * feat(MessageFeed): add ResourceLists and ResourceList properties to MessageFeedSubcomponentProperty * feat(MessageFeed): add InitialMessageWithResourceList story and update InitialMessage component to include ResourceList and ResourceListItem * refactor(InitialMessage): restructure inner wrapper and remove description styles for cleaner layout * refactor(ResourceListItem): update styles to use theme-based icon colors and improve structure * refactor(InitialMessage): integrate LeafyGreenProvider for dark mode support and simplify props in stories * test(InitialMessage, MessageFeed): update tests to ensure proper rendering of MessagePrompts and prevent rendering of children when not a subcomponent * refactor(InitialMessage): remove LeafyGreenProvider and simplify component structure for improved readability * refactor(InitialMessage): remove LeafyGreenProvider and streamline component structure for improved readability * feat(InitialMessage): add generated story for initialMessage * feat(InitialMessage): enhance story with interactive MessagePrompts and update children prop for better demonstration * chore(ALL_PACKAGES): revert ALL_PACKAGES * fix(InitialMessage): remove unused darkMode prop from story and include resourceList in the InitialMessage component * feat(ResourceList): integrate LeafyGreenProvider for dark mode support and update ResourceListProps to include DarkModeProps * feat(InitialMessage): add additional resource list items and update story configuration for enhanced interactivity * fix(ResourceListItem): update prop documentation for glyph and children to clarify usage * docs(MessageFeed): update changeset * refactor(InitialMessage): update AssistantAvatar size and adjust props in InitialMessage types for improved clarity * fix(InitialMessage): export InitialMessageProps type for better type safety * refactor(InitialMessage): Components to components * refactor(InitialMessage): update import paths from Components to components * feat(InitialMessage): add interactive story for message addition with state management * fix(InitialMessage): add visibility property to transition styles for improved animation handling * feat(MessageFeed): enhance InitialMessage stories with new message handling and improve visibility checks in tests * feat(InitialMessage): rename Components to components * fix(InitialMessage): update import paths from Components to components for consistency * refactor(InitialMessage): replace MessageFeedSubcomponentProperty with InitialMessageSubcomponentProperty in relevant components * feat(MessagePromptsItem): add MessagePromptsItem component with associated types and tests * refactor(MessagePrompts): rename MessagePrompt to MessagePromptsItem across components and update related tests and stories * feat(InitialMessage): implement InitialMessage component with accessibility tests, styles, and subcomponents for prompts and resource lists * fix(MessageFeed): correct import paths for InitialMessage component * feat(ResourceListItem): export ResourceListItemProps type for improved type safety * test(InitialMessage): add tests for ResourceList subcomponent and update existing tests * wip * docs(README): enhance documentation for MessageFeed and InitialMessage components, detailing subcomponents and usage examples * fix(README): correct syntax errors in useState initialization and update documentation for MessagePrompts and MessagePromptsItem * docs(MessageFeed): update README primary example
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
✍️ Proposed changes
Changes in the PR include:
MessageFeedinto a compound componentMessageFeed🎟 Jira ticket: LG-5934
🎟 Jira ticket: LG-5934
✅ Checklist
For new components
For bug fixes, new features & breaking changes
pnpm changesetand documented my changes🧪 How to test changes