Skip to content

feat(mobile): add a line wrap toggle to code blocks - #19041

Closed
Abdullah1738 wants to merge 1 commit into
pingdotgg:mainfrom
Abdullah1738:fix/mobile-code-wrap-enriched
Closed

Abdullah1738 wants to merge 1 commit into
pingdotgg:mainfrom
Abdullah1738:fix/mobile-code-wrap-enriched

Conversation

@Abdullah1738

Copy link
Copy Markdown

Problem

On mobile, fenced code blocks in messages only scroll sideways, so long lines get cut off at the screen edge and you have to swipe inside a small box to read them. #15877 added a per-block wrap button for this, but it was closed when #16979 replaced the mobile Markdown renderer with Enriched Markdown. Julius's close note: "A code-block wrap toggle would need to be rebuilt on top of Enriched; feel free to open a new PR against the new renderer if you want to pick it back up." (#15877 (comment))

Change

This rebuilds it on Enriched. Code block headers are native in Enriched, so the button lives in the fork: pingdotgg/enriched-markdown#1 adds an opt-in enableCodeBlockWrapToggle prop that puts a wrap button next to Copy in each code block header. This PR bumps the vendored archive to 1.2.0-t3.12 (built from that branch, commit 0dc84de7) and turns the prop on in apps/mobile/src/native/EnrichedMarkdownText.tsx.

The behaviour matches #15877. It's per block and starts off, with the same labels as web ("Wrap lines" / "Disable line wrap"), text.alignleft on iOS and wrap_text on Android. Wrapped blocks lay out at the bubble width, and the choice survives streaming updates of the same message. Code blocks inside blockquotes keep scrolling.

Scope and approval

This is a parity fix that brings back the mobile wrap toggle from #15877 on the new renderer. Julius invited a new PR for it in the closing comment linked above. It mirrors web's existing per-block wrap toggle in ChatMarkdown. Surfaces: mobile only (web already has the toggle, desktop wraps web). No contracts, providers, server, or settings changes. The dependency follows apps/mobile/deps/README.md, and it needs pingdotgg/enriched-markdown#1 merged first (the archive here is built from that branch).

Verification

  • tsc-rs --noEmit in apps/mobile, vp fmt --check apps/mobile/src, vp lint --report-unused-disable-directives apps/mobile/src, vp run knip:check, git diff --check: clean.
  • iOS Release device build and iOS Release simulator build (T3Code.app, upstream branding) with the new archive succeed.
  • Ran it against a seeded demo server with a message holding a long single-line ts block and a short sh block. The long line is clipped and scrolls sideways first, wraps at the bubble width after tapping the button, and scrolls again after a second tap. Copy still copies the original single line in both states, and the short block looks the same as before. On Android the button reads "Wrap lines" / "Disable line wrap" to accessibility services.
  • iOS screenshots are from this branch on an iPhone simulator. Android screenshots are from our fork's release build (arm64 + x86_64) on an emulator, which ships the same 1.2.0-t3.12 archive and the same one-line prop change. I also ran it on an iPhone and an iPad.
iOS Android
Off (default) iOS code block, long line clipped Android code block, long line clipped
On iOS code block, long line wrapped Android code block, long line wrapped

Built with Claude Opus 5.5 in T3 Code (OpenCode harness). Reviewed with GPT-6 Astra.

@github-actions github-actions Bot added the vouch:unvouched PR author is not yet trusted in the VOUCHED list. label Oct 13, 2026
@github-actions github-actions Bot added the size:S 10-29 changed lines (additions + deletions). label Oct 13, 2026
@macroscopeapp

macroscopeapp Bot commented Oct 13, 2026

Copy link
Copy Markdown
Contributor

Approvability

Verdict: Not approved

Macroscope's review found this PR not approvable — This enables a new mobile code-block wrap control backed by substantial vendored iOS and Android native changes, including layout and measurement behavior. The hidden implementation is broader than the small app diff, so human review is warranted.

You can add or adjust custom eligibility rules. Learn more.

@coderabbitai

coderabbitai Bot commented Oct 13, 2026

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Path: .coderabbit.config.ts
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: deb55706-23ad-45ed-b918-6dcc5cb89c73
📥 Commits

Reviewing files that changed from the base of the PR and between 6524a8d and 2f1b340.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (5)
  • apps/mobile/deps/react-native-enriched-markdown-1.2.0-t3.11.tgz
  • apps/mobile/deps/react-native-enriched-markdown-1.2.0-t3.12.tgz
  • apps/mobile/package.json
  • apps/mobile/src/native/EnrichedMarkdownText.tsx
  • pnpm-workspace.yaml

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 9 remain after this review.

📝 Walkthrough

The mobile app updates react-native-enriched-markdown to version 1.2.0-t3.12 and enables the code-block wrap toggle on rendered Markdown text.

Changes: Mobile Markdown Code Wrapping

Layer / File(s) Summary
Update the Markdown package and enable code wrapping
apps/mobile/package.json, pnpm-workspace.yaml, apps/mobile/src/native/EnrichedMarkdownText.tsx
The dependency and allowed-builds entry now use the 1.2.0-t3.12 tarball. MobileEnrichedMarkdownText enables the code-block wrap toggle.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix

Suggested reviewers: juliusmarminge

Merge Risk: ⚪ Minimal · up to 2f1b3

The mobile renderer enables the wrap toggle through the supported GitHub-flavor path, and the package update preserves the app’s existing link APIs. No actionable merge risk remains.

Security architecture risk: 🔵 Low · up to 2f1b3

The change remains within mobile Markdown presentation. No expansion of data access or privileged actions was identified, but native streaming, recycling, and rapid-toggle behavior have only been checked statically.

Retained concerns
No architecture-level concerns identified.

Security review details

Security Blast Radius

  • inferred — The introduced control operates within each mobile client's existing native Markdown rendering process, including chat, file, and pull-request views. The checked integration changes do not add service credentials, tenant authority, or a new data-store access path.

Trust Boundaries and Controls

  • observed — The adapter retains its existing link presses, link context menus, image resolution, media rendering, image presses, and selection-clipboard wiring. The wrap option does not replace or bypass those callback boundaries in the compared source.

Resilience and Maintainability Implications

  • observed — Native rendering rejects superseded asynchronous results. iOS recycling invalidates pending renders and clears wrap indexes; Android cleanup invalidates pending work, and measurement-store release removes per-view wrap state. These are static safeguards, not runtime validation of interruption or recycling.
Pre-merge checks · Passed 4
Passed Passed checks (4 passed)
Check name Status Explanation
Title check Passed The title clearly and concisely describes the main change: adding a line-wrap toggle for mobile code blocks.
Description check Passed The description includes complete Problem, Change, Scope and approval, and Verification sections. It explains the prior behavior, implementation, dependency update, approval context, validation result…
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Comment @coderabbitai help to get the list of available commands.

@maria-rcks

Copy link
Copy Markdown
Collaborator

Note

Written by gpt-6.1-sol on behalf of Maria

Thanks for rebuilding the wrap toggle for Enriched. This adds a reading control rather than repairing broken scrolling, and I recognize Julius previously invited this resubmission. Right now we are only taking focused bug fixes from outside contributors, using the limited review capacity described in Read this first. Please preserve the mobile readability proposal in an Ideas discussion and request reconsideration if maintainers choose to prioritize it.

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

Labels

size:S 10-29 changed lines (additions + deletions). vouch:unvouched PR author is not yet trusted in the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants