Skip to content

fix: html/markdown formatting in chat#2446

Draft
Gibbz wants to merge 1 commit into
krille-chan:mainfrom
Gibbz:fix/chat-html-rendering
Draft

fix: html/markdown formatting in chat#2446
Gibbz wants to merge 1 commit into
krille-chan:mainfrom
Gibbz:fix/chat-html-rendering

Conversation

@Gibbz

@Gibbz Gibbz commented Dec 21, 2025

Copy link
Copy Markdown

Edit: still need to make some more fixes, dont merge this

This is essentially 2 in 1 as the linux build wasn't working (maybe just my system?).
I'll be doing a local build with the last fixes I've done over the week just to ensure its all working right together.

The markdown/html rendering in the chat was making a minced mess of formatting, fonts and icons. So I've updated to something more robust.

Fixed:

  • Replaced manual HtmlMessage renderer with flutter_html to fix broken markdown display and layout issues.
  • Ported Matrix Pills, Mxc Images, Checkboxes, Spoilers, and Details.
  • Adjusted font family and fallbacks to ensure correct rendering of text and emojis and removed custom color overrides to respect default system icons.

Upgraded:

  • Fixed Linux build by upgrading flutter_secure_storage to v10.0.0.
  • Upgraded matrix SDK to v4.1.0 and other dependencies.

Thank you so much for your contribution to FluffyChat ❤️❤️❤️

Pull Request has been tested on:

  • Android
  • iOS
  • Browser (Chromium based)
  • Browser (Firefox based)
  • Browser (WebKit based)
  • Desktop Linux
  • Desktop Windows
  • Desktop macOS

@Gibbz Gibbz requested a review from krille-chan as a code owner December 21, 2025 23:11
@Gibbz Gibbz force-pushed the fix/chat-html-rendering branch 4 times, most recently from ac31b86 to 26aee74 Compare December 22, 2025 10:28
@Gibbz Gibbz marked this pull request as draft December 22, 2025 10:30
@Gibbz Gibbz force-pushed the fix/chat-html-rendering branch from 26aee74 to a604d78 Compare December 22, 2025 10:31
@JAicewizard

Copy link
Copy Markdown

Should this still be a draft? What needs changes to make this a final version? I would love for html messages to be fixed

@JAicewizard JAicewizard left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mostly small issues. Also don't know what the style guides are here, so best to ask krille for that

textColor: textColor,
);
case CuteEventContent.eventType:
case MessageTypes.Image:

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are these spaces/tabs correct? looks like a formatting issue

Comment on lines +157 to +159
color: activeChat
? theme.colorScheme.onSecondaryContainer
: theme.colorScheme.onSurface,

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this is just a random styling change, idk what the rules are in regards to adding this in PRs

Comment on lines +23 to +25
final double? width;
final double? height;
final double? aspectRatio;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of making them nullable, you could set them in the constructor. That way you have the behavior of a default value like before, while allowing the arguments to be null

Comment on lines +65 to +67
if (aspectRatio != null) {
placeholder = AspectRatio(aspectRatio: aspectRatio!, child: placeholder);
}

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The placeholder is already wrapped in an AspectRatio indirectly in build. Is this necessary?

Comment on lines +114 to +116
if (aspectRatio != null) {
image = AspectRatio(aspectRatio: aspectRatio!, child: image);
}

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we need this? The MxcImage should always already be the correct aspect ratio right?

Comment on lines +103 to +104
width: width,
height: height,

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Probably forgot the default width/height here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants