Skip to content

fix: display diffs for larger files#2730

Open
taskylizard wants to merge 4 commits into
npmx-dev:mainfrom
taskylizard:main
Open

fix: display diffs for larger files#2730
taskylizard wants to merge 4 commits into
npmx-dev:mainfrom
taskylizard:main

Conversation

@taskylizard
Copy link
Copy Markdown
Contributor

🔗 Linked issue

Resolves #2698

🧭 Context

Diffs are not showed for files above 250KiB even if the diff output is small.

📚 Description

This PR fixes large modified file diffs by moving size handling to server and adding an degraded diff mode.

  • allow modified file diffs up to 1MiB per side
  • keep added/removed file diff cap at 250 KiB
  • remove client-side hard block for files over 250 KiB
  • disable inline edit merging for large files
  • keep syntax highlighting when rendered diff is small
  • truncate very large diff output at 5000 lines, showing large/truncated diff notices in the UI
  • add diff truncation metadata and unit tests for stuff

Hope this approach is solid, I don't know if we can push this even higher or not but it should be OK for now. i18n is affected so not sure about it.

@vercel
Copy link
Copy Markdown
Contributor

vercel Bot commented May 12, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
npmx.dev Ready Ready Preview, Comment Jun 1, 2026 5:45pm
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Jun 1, 2026 5:45pm
npmx-lunaria Ignored Ignored Jun 1, 2026 5:45pm

Request Review

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 12, 2026

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: a63fccc3-16d6-4ed4-a60e-16a057082a51

📥 Commits

Reviewing files that changed from the base of the PR and between 0f65407 and 447877f.

📒 Files selected for processing (25)
  • i18n/locales/az-AZ.json
  • i18n/locales/bg-BG.json
  • i18n/locales/bn-IN.json
  • i18n/locales/cs-CZ.json
  • i18n/locales/de.json
  • i18n/locales/es.json
  • i18n/locales/fr-FR.json
  • i18n/locales/hi-IN.json
  • i18n/locales/hu-HU.json
  • i18n/locales/id-ID.json
  • i18n/locales/ja-JP.json
  • i18n/locales/mr-IN.json
  • i18n/locales/nb-NO.json
  • i18n/locales/nl.json
  • i18n/locales/pl-PL.json
  • i18n/locales/pt-BR.json
  • i18n/locales/pt-PT.json
  • i18n/locales/ro-RO.json
  • i18n/locales/ru-RU.json
  • i18n/locales/sr-Latn-RS.json
  • i18n/locales/tr-TR.json
  • i18n/locales/uk-UA.json
  • i18n/locales/vi-VN.json
  • i18n/locales/zh-CN.json
  • i18n/locales/zh-TW.json
💤 Files with no reviewable changes (6)
  • i18n/locales/ro-RO.json
  • i18n/locales/nl.json
  • i18n/locales/ru-RU.json
  • i18n/locales/es.json
  • i18n/locales/ja-JP.json
  • i18n/locales/tr-TR.json

📝 Walkthrough

Summary by CodeRabbit

  • New Features

    • Large-file diff mode: banner shown for large/truncated diffs; some inline-merge options disabled while core viewing controls (e.g. word-wrap) remain.
    • New user-facing messages for truncated diffs and large-diff options-disabled notice.
  • Improvements

    • Safer, truncation-aware rendering for very large comparisons to improve responsiveness and clarity.
    • Updated localisation keys across languages to support the new UI text.
  • Tests

    • Added unit tests for diff truncation behaviour.

Walkthrough

Adds server-side input caps and render limits, a degraded large-diff mode that disables merge-merged-line edits, truncates returned hunks (preserving skip blocks), conditionally highlights, and surfaces large/truncated state in the UI and i18n strings.

Changes

Large diff mode and output truncation

Layer / File(s) Summary
Type contracts and truncation utility
shared/types/compare.ts, shared/utils/diff.ts, test/unit/shared/utils/diff.spec.ts
FileDiffResponse.meta expands to include large and truncationReason; truncateDiffHunks added to limit returned lines while preserving skip blocks; unit tests cover truncation and skip-block behaviour.
Server diff handler sizing and large-mode detection
server/api/registry/compare-file/[...pkg].get.ts
Introduces size constants (input caps, large-mode threshold, output/highlight limits); fetchFileContentForDiff enforces byte limits and returns 413 when exceeded; parallel fetches use modified-file max; handler disables merge options when large inputs detected; inserts skip blocks, truncates hunks to output limits, conditionally applies syntax highlighting, and returns meta.{large,truncated,truncationReason,computeTime} with truncated hunks/stats.
UI integration of large-mode state
app/components/Diff/ViewerPanel.vue
largeDiffMode derived from server meta.large or local size heuristic; command palette omits merge-modified-lines when large; options dropdown shows disabled notice and hides merge controls/sliders in large mode; header shows banner when large-mode or truncation is present.
Localization for large-diff messaging
i18n/locales/en.json, i18n/schema.json
Adds compare.diff_truncated, compare.large_diff_mode, and compare.large_diff_options_disabled; removes old compare.file_too_large and compare.file_size_warning; schema updated accordingly.
Locale updates (placeholders and removals)
i18n/locales/*
Many locale files updated: add command_palette, package.size_decrease, timeline/chart copy_alt, leaderboard.likes, compare.scatter_chart.copy_alt, compare facet placeholders (githubStars, githubIssues, createdAt), remove old compare file-size strings in locales, and add top-level changelog.error placeholders.

Sequence Diagram

sequenceDiagram
  participant Client
  participant Handler
  participant Fetch
  participant CreateDiff
  participant PostProcess
  participant Response

  Client->>Handler: request diff
  Handler->>Fetch: fetch both sides with maxBytes limit
  Fetch-->>Handler: content or 413 error
  Handler->>Handler: compute byte sizes and detect large-mode
  Handler->>CreateDiff: create diff with adjusted options (mergeModifiedLines disabled when large)
  CreateDiff-->>Handler: hunks
  Handler->>PostProcess: insert skip blocks and truncate hunks
  PostProcess->>PostProcess: decide highlighting based on truncation and render size
  PostProcess-->>Handler: final hunks, stats, meta
  Handler->>Response: return response with meta.large and meta.truncated
  Response-->>Client: diff response
Loading
  • Possibly related PRs:
    • npmx-dev/npmx.dev#2682: touches leaderboard.likes i18n namespace that appears as placeholders in this PR.
    • npmx-dev/npmx.dev#2813: modifies i18n/locales/tr-TR.json in the compare/version diff UI; overlaps in translation keys.
  • Suggested reviewers:
    • ghostdevv
    • serhalp
    • danielroe
🚥 Pre-merge checks | ✅ 4
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title 'fix: display diffs for larger files' accurately summarises the main objective of the PR, which is enabling diff display for files larger than the previous 250 KiB limit.
Description check ✅ Passed The description is well-related to the changeset, explaining the fix strategy, key changes (modified file limits, degraded mode, truncation, metadata), and noting i18n impact.
Linked Issues check ✅ Passed The PR addresses issue #2698 by allowing diffs for large files when the actual diff is small; modified files now support up to 1 MiB per side, added/removed stay at 250 KiB, client-side blocks removed, and large-file UI modes with truncation at 5000 lines are implemented.
Out of Scope Changes check ✅ Passed Changes focus on diff size handling, UI modes, truncation logic, and i18n updates (removing old size-warning keys and adding new truncation/large-mode messages); all remain within scope of improving large-file diff display.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 12, 2026

Lunaria Status Overview

🌕 This pull request will trigger status changes.

Learn more

By default, every PR changing files present in the Lunaria configuration's files property will be considered and trigger status changes accordingly.

You can change this by adding one of the keywords present in the ignoreKeywords property in your Lunaria configuration file in the PR's title (ignoring all files) or by including a tracker directive in the merged commit's description.

Tracked Files

File Note
i18n/locales/az-AZ.json Localization changed, will be marked as complete. 🔄️
i18n/locales/bg-BG.json Localization changed, will be marked as complete. 🔄️
i18n/locales/bn-IN.json Localization changed, will be marked as complete. 🔄️
i18n/locales/cs-CZ.json Localization changed, will be marked as complete. 🔄️
i18n/locales/de.json Localization changed, will be marked as complete. 🔄️
i18n/locales/en.json Source changed, localizations will be marked as outdated.
i18n/locales/es.json Localization changed, will be marked as complete. 🔄️
i18n/locales/fr-FR.json Localization changed, will be marked as complete. 🔄️
i18n/locales/hi-IN.json Localization changed, will be marked as complete. 🔄️
i18n/locales/hu-HU.json Localization changed, will be marked as complete. 🔄️
i18n/locales/id-ID.json Localization changed, will be marked as complete. 🔄️
i18n/locales/ja-JP.json Localization changed, will be marked as complete. 🔄️
i18n/locales/mr-IN.json Localization changed, will be marked as complete. 🔄️
i18n/locales/nb-NO.json Localization changed, will be marked as complete. 🔄️
i18n/locales/nl.json Localization changed, will be marked as complete. 🔄️
i18n/locales/pl-PL.json Localization changed, will be marked as complete. 🔄️
i18n/locales/pt-BR.json Localization changed, will be marked as complete. 🔄️
i18n/locales/pt-PT.json Localization changed, will be marked as complete. 🔄️
i18n/locales/ro-RO.json Localization changed, will be marked as complete. 🔄️
i18n/locales/ru-RU.json Localization changed, will be marked as complete. 🔄️
i18n/locales/sr-Latn-RS.json Localization changed, will be marked as complete. 🔄️
i18n/locales/tr-TR.json Localization changed, will be marked as complete. 🔄️
i18n/locales/uk-UA.json Localization changed, will be marked as complete. 🔄️
i18n/locales/vi-VN.json Localization changed, will be marked as complete. 🔄️
i18n/locales/zh-CN.json Localization changed, will be marked as complete. 🔄️
i18n/locales/zh-TW.json Localization changed, will be marked as complete. 🔄️
Warnings reference
Icon Description
🔄️ The source for this localization has been updated since the creation of this pull request, make sure all changes in the source have been applied.

@codecov
Copy link
Copy Markdown

codecov Bot commented May 12, 2026

Codecov Report

❌ Patch coverage is 76.78571% with 13 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines Patch % Lines
app/components/Diff/ViewerPanel.vue 75.60% 5 Missing and 5 partials ⚠️
shared/utils/diff.ts 80.00% 0 Missing and 3 partials ⚠️

📢 Thoughts on this report? Let us know!

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@shared/utils/diff.ts`:
- Around line 352-360: The loop over hunks in shared/utils/diff.ts currently
pushes hunk.type === 'skip' into result before checking remainingLines, so a
trailing skip block can be emitted even when budget is exhausted; change the
logic so the remainingLines check happens before you push skip hunks (or only
push skip hunks when remainingLines > 0), ensuring you don't append a 'skip' to
result after you decide to return { hunks: result, truncated: true }; update the
loop around the `for (const hunk of hunks)` handling of `hunk.type === 'skip'`,
`remainingLines`, and `result` accordingly.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: c689f384-b3d6-4581-90df-bdc13705b8e9

📥 Commits

Reviewing files that changed from the base of the PR and between f91f8c4 and 3c6d060.

📒 Files selected for processing (7)
  • app/components/Diff/ViewerPanel.vue
  • i18n/locales/en.json
  • i18n/schema.json
  • server/api/registry/compare-file/[...pkg].get.ts
  • shared/types/compare.ts
  • shared/utils/diff.ts
  • test/unit/shared/utils/diff.spec.ts

Comment thread shared/utils/diff.ts Outdated
@taskylizard taskylizard changed the title fix(diff): display diffs for larger files fix: display diffs for larger files May 14, 2026
Copy link
Copy Markdown
Member

@ghostdevv ghostdevv left a comment

Choose a reason for hiding this comment

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

Could you take a look at the code rabbit comment and failing CI? @taskylizard

@taskylizard
Copy link
Copy Markdown
Contributor Author

Ya

@taskylizard
Copy link
Copy Markdown
Contributor Author

Actually we could move to @pierre/diffs which should be more performant, but let's go ahead with this for now

@taskylizard
Copy link
Copy Markdown
Contributor Author

Should be good to go I think @ghostdevv

@gameroman gameroman requested review from gameroman and ghostdevv June 1, 2026 18:05
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.

Displaying diffs for big files

2 participants