Change code block highlighting from Prism to Arborium#576
Merged
Conversation
hazre
changed the title
hazre
changed the title
hazre
force-pushed
the
hazre/feat/arborium-migration
branch
from
5a30404 to
0f7a28b
Compare
Member
Author
|
Okay I added a better theme selector as well. I think this is ready to go. |
Member
|
merge conflicts D: |
Member
Author
|
Yeah my own PR is bringing me pain |
…borium-migration # Conflicts: # src/app/plugins/react-custom-html-parser.test.tsx # src/app/plugins/react-custom-html-parser.tsx # src/app/utils/sanitize.test.ts # src/app/utils/sanitize.ts
Contributor
Deploying with
|
| Status | Preview URL | Commit | Alias | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! | https://pr-576-sable.raspy-dream-bb1d.workers.dev | 3bb692f | pr-576 |
Mon, 30 Mar 2026 21:32:29 GMT |
7w1
approved these changes
Mar 30, 2026
Member
7w1
left a comment
7w1
left a comment
There was a problem hiding this comment.
code lgtm. appears to function properly and styles are consistent
github-merge-queue bot
pushed a commit
that referenced
this pull request
Apr 10, 2026
> [!IMPORTANT] > Merging this PR will create a new release. ## Features * Add support for rendering bundled urls per MSC4095 ([#590](#590) by @nushea) * Improve code blocks with faster, more accurate syntax highlighting, broader language support, and separate light and dark theme options. ([#576](#576) by @hazre) * Add statuses to DMs ([#644](#644) by @nushea) * Add custom DM images and descriptions ([#644](#644) by @nushea) * Add statuses to Member Tile ([#644](#644) by @nushea) * Add the ability to set Global Name Colors dependent on the theme (dark/light) ([#656](#656) by @nushea) * Add a setting to collapse sidebar folders by default. ([#624](#624) by @7w1) * Add a "Dismiss" button to command response messages. ([#625](#625) by @7w1) * Update threads: various fixes, browse all room threads, and see live reply counts on messages. ([#564](#564) by @Just-Insane) * Re-introduced custom HTML formatting for long messages ([#641](#641) by @Septicity) * You can now share direct links to specific settings, and opening one takes you to the right section and highlights the target option. ([#577](#577) by @hazre) * Settings now use route-based navigation with improved desktop and mobile behavior, including better back and close handling. ([#577](#577) by @hazre) ## Fixes * Use file name instead of "a voice message" for non-voice audio files. ([#651](#651) by @mvanhorn) * Constrain bug report modal to viewport height to prevent overflow. ([#652](#652) by @mvanhorn) * Fix dms navigation not navigating to dms when local storage is messed up. ([#653](#653) by @7w1) * Fix reply button not capturing editor focus. ([#623](#623) by @7w1) * Fixes links not being clickable in formatted messages, including messages that use abbreviations. ([#632](#632) by @hazre) * Fix some zero-width (invisible) names ([#640](#640) by @nushea) * Fix iOS elastic bounce-back overscroll on the root element. ([#650](#650) by @mvanhorn) * Fixed the "sticky scrolling" issue in encrypted rooms with many PMP messages. ([#626](#626) by @Septicity) * Fix blank room timeline when app returns from background. When sliding sync delivers an `initial: true` response for the open room, a `TimelineReset` event now correctly shows skeleton placeholders while events reload instead of leaving an empty view. ([#657](#657) by @Just-Insane) * Image zooming is now centered on the cursor position ([#602](#602) by @mini-bomba) * Image zooming is now multiplicative instead of additive, resulting in a consistent "zooming speed". ([#602](#602) by @mini-bomba) * Image zoom buttons now zoom towards the center of the screen ([#602](#602) by @mini-bomba) * Right clicks no longer drag images in the viewer. ([#620](#620) by @Septicity) * Updated Support links to point to https://opencollective.com/sable ([#661](#661) by @7w1)
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
2 participants
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.
Description
I was inspired by this tweet. https://fxtwitter.com/DiscordPreviews/status/2036671398265995336
SettingMenuSelector, removeNotificationModeSwitcher, and reuse the shared selector in notification, room, and theme settingsThe cool thing about Arborium is that all the language support and themes are loaded from a CDN. So you basically ship nothing and on demand, it downloads the proper grammer for each language that shows up in the messages. fallback is just no syntax highlighting.
Sceenshots
Recording.2026-03-28.224825-00.00.00.000-00.00.17.936.mp4
Type of change
Checklist:
AI disclosure:
The main change in this PR is replacing the old Prism-based highlighting path with Arborium for rendered message code blocks and text previews. The message renderer and text viewer now go through the Arborium-backed code highlight renderer, Arborium themes are loaded through the new theme bridge instead of the old Prism theme classes, and unsupported or failed language/theme loads still fall back safely to plain rendered code. The settings work in this PR now exposes code block theming with the same structure as the existing app theme controls: a System Theme toggle that keeps separate light and dark Arborium theme selections, plus a single Manual Theme selector that can override them when system mode is off. The reusable
SettingMenuSelectorextraction is supporting cleanup that lets the same dropdown pattern drive notification settings, room notification controls, and the theme pickers while removing the older one-off switcher component. The wrapping changes are the last part of that migration work: Arborium-rendered code now wraps in both timeline messages and text previews so long lines stay readable without forcing wide overflow. The tests cover Arborium theme selection and loading, selector reuse, notification option reuse, and the message/text-viewer code block regressions.