Enable markdown formatting for voice command dialog

[Shulyaka]

Proposed change

Enable markdown formatting for voice command dialog, because LLM may occasionally output markdown-formatted text even when explicitly told to produce plain text only. This change would allow to view such text as was intended.

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

N/A

Additional information

• This PR fixes or closes issue:
• This PR is related to issue or discussion:
• Link to documentation pull request:

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io

Summary by CodeRabbit

• New Features
  • Enhanced message display in the voice command dialog with support for Markdown formatting, allowing for richer visual presentation of messages.
• Bug Fixes
  • Improved handling of whitespace in messages by removing restrictive styling, ensuring consistent formatting with the new Markdown component.

[coderabbitai]

Walkthrough

Walkthrough

The update to the HaVoiceCommandDialog class enhances message rendering by incorporating the ha-markdown component, enabling richer text formatting through Markdown syntax. This transition from plain text to formatted messages improves user experience by allowing line breaks and SVG rendering. Additionally, changes to the CSS for the .message class standardize whitespace handling, ensuring consistent message presentation within the dialog.

Changes

Files	Change Summary
src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts	Integrated ha-markdown for message rendering, allowing Markdown formatting and improved visual presentation. Removed white-space: pre-line; CSS property to standardize whitespace handling.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Dialog
    participant MarkdownComponent
    
    User->>Dialog: Send voice command
    Dialog->>MarkdownComponent: Render message with Markdown
    MarkdownComponent-->>Dialog: Return formatted message
    Dialog-->>User: Display formatted message

Loading

---

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

• X
• Mastodon
• Reddit
• LinkedIn

Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai generate interesting stats about this repository and render them as a table.
  • @coderabbitai show all the console.log statements in this repository.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[bramkragten]

The assistant doesnt know atm how the response is going to be used, it can be spoken by a voice assistant, or shown in the native iOS/Android/Watch apps or in this frontend dialog.

By adding support for markdown just here, we might make the problem bigger as it is not supported in all the other places.

[balloob]

This will require more planning/thought:

Assist Pipeline should know if it is going to output to a display or voice, so prompts can be adjusted accordingly (as now we would want markdown for display!)

Also, Android phone/watch + iOS phone/watch have to be updated to support markdown (which will be hard)

[home-assistant]

Please take a look at the requested changes, and use the Ready for review button when you are done, thanks 👍

Learn more about our pull request process.

[Shulyaka]

From my perspective, those are two separate issues:

1. (Core) Whether a pipeline should produce a markdown-formatted text for a device that doesn't support it. Also length of the text is important here.
2. (Frontend, this PR) Whether frontend should display a formatted text as formatted when it is provided for whatever reason (LLMs don't always follow the instructions). I've also made a proposal about markdown support for TTS, which is a separate discussion.

[github-actions]

There hasn't been any activity on this pull request recently. This pull request has been automatically marked as stale because of that and will be closed if no further activity occurs within 7 days.
Thank you for your contributions.