enhancement: show assistant info on message

[urmauur]

Describe Your Changes

This pull request introduces enhancements to the StreamingContent and ThreadContent components to improve the display of assistant-related metadata and formatting, along with updates to state management hooks to include assistant information. Additionally, a utility function for date formatting has been added. Below are the most important changes grouped by theme:

Enhancements to StreamingContent and ThreadContent Components:

• Updated StreamingContent to use useMessages for fetching messages and added logic to conditionally display assistant metadata in the ThreadContent component. (web-app/src/containers/StreamingContent.tsx, [1] [2]
• Modified ThreadContent to accept a new showAssistant prop and render assistant details (avatar, name, and formatted creation date) when applicable. (web-app/src/containers/ThreadContent.tsx, [1] [2] [3]

State Management Updates:

• Updated useAppState to include assistant metadata when updating streamingContent. (web-app/src/hooks/useAppState.ts, [1] [2]
• Enhanced useMessages to include assistant metadata in newly created messages. (web-app/src/hooks/useMessages.ts, [1] [2]

Utility Function Addition:

• Added a formatDate utility function to format dates in a user-friendly manner, used in the assistant metadata display. (web-app/src/utils/formatDate.ts, web-app/src/utils/formatDate.tsR1-R10)

Miscellaneous:

• Updated ThreadDetail to pass the showAssistant prop to ThreadContent based on message roles and sequence. (web-app/src/routes/threads/$threadId.tsx, web-app/src/routes/threads/$threadId.tsxR199-R203)

Fixes Issues

• Closes #
• Closes #

Self Checklist

• Added relevant comments, esp in complex areas
• Updated docs (for bug fixes / features)
• Created issues for follow-up changes or refactoring needed

---

Important

Enhances message components to display assistant metadata, updates state management, and adds a date formatting utility.

• Components:
  • StreamingContent: Uses useMessages to fetch messages and conditionally displays assistant metadata in ThreadContent.
  • ThreadContent: Accepts showAssistant prop to render assistant details (avatar, name, formatted date).
• State Management:
  • useAppState: Includes assistant metadata in updateStreamingContent().
  • useMessages: Adds assistant metadata to new messages in addMessage().
• Utilities:
  • Adds formatDate function for user-friendly date formatting.
• Miscellaneous:
  • ThreadDetail: Passes showAssistant prop to ThreadContent based on message roles and sequence.

^{This description was created by for 7c6bda1. You can customize this summary. It will automatically update as commits are pushed.}

[louis-menlo]

LGTM

[ellipsis-dev]

Important

Looks good to me! 👍

Reviewed everything up to 7c6bda1 in 1 minute and 37 seconds. Click for details.

• Reviewed 196 lines of code in 6 files
• Skipped 0 files when reviewing.
• Skipped posting 6 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/containers/StreamingContent.tsx:24

• Draft comment:
  Verify that the 'showAssistant' logic (using the last message's role) handles consecutive assistant messages as intended.
• Reason this comment was not posted:
  Comment did not seem useful. Confidence is useful = 0% <= threshold 50% This comment is asking the PR author to verify the behavior of the showAssistant logic, which is against the rules. It does not provide a specific suggestion or ask for a specific test to be written. Therefore, it should be removed.

2. web-app/src/containers/ThreadContent.tsx:235

• Draft comment:
  Hardcoded defaults for assistant avatar ('👋') and name ('Jan') are used; consider making these configurable.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

3. web-app/src/hooks/useAppState.ts:35

• Draft comment:
  Directly accessing assistant state via useAssistant.getState() may lead to stale values; consider subscribing to changes for dynamic updates.
• Reason this comment was not posted:
  Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 20% vs. threshold = 50% This is a legitimate concern in React/Zustand applications. When using getState() directly, you bypass the reactive subscription system. However, in this specific case, the assistant value is only captured once when updating the streaming content - it's not being used in a render context where staleness would be an issue. The suggested alternative of subscribing would actually be more complex and potentially unnecessary here. I might be underestimating the impact of stale assistant state. There could be race conditions or edge cases where the assistant changes right as content is being updated. While race conditions are theoretically possible, the practical impact is minimal since this is a one-time capture of the assistant state when creating/updating a message. If the assistant changes after, it's reasonable for the message to retain the original assistant context. The comment raises a theoretically valid concern but the current implementation is actually appropriate for this use case. The comment should be removed as it would lead to unnecessary complexity without clear benefit.

4. web-app/src/hooks/useMessages.ts:35

• Draft comment:
  Ensure that the assistant metadata added in new messages via useAssistant.getState() remains in sync if the assistant state updates.
• Reason this comment was not posted:
  Comment did not seem useful. Confidence is useful = 0% <= threshold 50% This comment is asking the author to ensure that a specific behavior is maintained, which violates the rule against asking the author to ensure behavior. It does not provide a specific suggestion or ask for a test to be written.

5. web-app/src/routes/threads/$threadId.tsx:199

• Draft comment:
  Confirm that the 'showAssistant' prop logic (checking previous message role) is consistent across components and covers all edge cases.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

6. web-app/src/utils/formatDate.ts:1

• Draft comment:
  Consider parameterizing the locale in formatDate to support internationalization if needed.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

Workflow ID: wflow_KpwnaKLalRNFvDvA

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}