feat: add raw diff actions by ColumbusLabs · Pull Request #3159 · npmx-dev/npmx.dev

ColumbusLabs · 2026-08-08T23:19:34Z

🔗 Linked issue

🧭 Context

The diff viewer parses each selected file for display, but it did not expose a valid unified diff that could be opened or copied for use elsewhere.

📚 Description

add a raw format=diff response for the existing compare-file endpoint
preserve /dev/null headers for added and deleted files
add View .diff and Copy .diff actions for the selected file
keep clipboard writes compatible with Safari user-activation requirements
cover patch generation and the browser actions, including slow and failed clipboard writes

Screenshots

Before:

After:

Verification

focused unit and Nuxt browser tests
pnpm test:unit
pnpm test:types
pnpm vp lint
pnpm vp run i18n:report
pnpm build
live raw and JSON endpoint checks against tinyclip 0.1.14...0.1.15

vercel · 2026-08-08T23:19:40Z

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

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview	Aug 8, 2026 11:56pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Aug 8, 2026 11:56pm
npmx-lunaria	Ignored		Aug 8, 2026 11:56pm

coderabbitai · 2026-08-08T23:19:53Z

📝 Walkthrough

Summary by CodeRabbit

New Features
- Added controls to view and copy file differences as raw .diff content.
- Raw diffs now support added, deleted, and modified files.
- Added loading states, accessibility announcements, clipboard support, and failure handling when copying diffs.
- Updated code-browser links to use clearer “View in code browser” wording.
Bug Fixes
- Improved diff links by safely encoding package, version, and file path details.

Walkthrough

The diff API now returns unified .diff content. The viewer builds encoded URLs, supports viewing and copying raw diffs, manages clipboard states, and updates translation keys. Tests cover generation, URL encoding, asynchronous copying, and failure handling.

Changes

Unified diff feature

Layer / File(s)	Summary
Unified diff generation and API responses `shared/utils/diff.ts`, `server/api/registry/compare-file/[...pkg].get.ts`, `test/unit/shared/utils/diff.spec.ts`	`createUnifiedDiff` generates patches for modified, added, and deleted files. The API returns `text/x-diff` responses for `format=diff` requests and uses separate cache keys.
Diff viewer controls and localisation `app/components/Diff/ViewerPanel.vue`, `i18n/locales/en.json`, `i18n/schema.json`, `test/nuxt/components/diff/ViewerPanel.spec.ts`	The viewer encodes URL segments, opens raw diffs, copies diff content through the Clipboard API, updates button state, and uses the new translation keys. Tests cover these behaviours and failure paths.
Locale structure updates `i18n/locales/*.json`	Locale files remove obsolete comparison translations and add empty structures required by the current locale schema.

Sequence Diagram(s)

sequenceDiagram
participant Browser
participant ViewerPanel
participant CompareFileAPI
participant ClipboardAPI
Browser->>ViewerPanel: Activate view or copy control
ViewerPanel->>CompareFileAPI: Request encoded format=diff URL
CompareFileAPI-->>ViewerPanel: Return raw diff text
ViewerPanel->>ClipboardAPI: Write diff text
ClipboardAPI-->>ViewerPanel: Resolve or reject write
ViewerPanel-->>Browser: Update copy state and announcement

Possibly related PRs

npmx-dev/npmx.dev#3026 — Both changes modify i18n/locales/bn-IN.json and comparison translation keys.

Suggested reviewers:ghostdevv

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Out of Scope Changes check	⚠️ Warning	Many locale files add unrelated empty translation namespaces, such as sponsors, themes, noodles, and keyboard shortcuts.	Remove unrelated locale changes, or provide linked requirements that justify each added or removed translation namespace.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	The implementation meets issue `#3032` by adding `.diff` viewing and copying for selected file changes.
Title check	✅ Passed	The title clearly and concisely summarises the main change: adding raw diff actions.
Description check	✅ Passed	The description directly explains the raw diff endpoint, UI actions, clipboard handling, tests, and verification steps.

✨ 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.}

github-actions · 2026-08-08T23:20:00Z

Hello! Thank you for opening your first PR to npmx, @ColumbusLabs! 🚀

Here’s what will happen next:

Our GitHub bots will run to check your changes.
If they spot any issues you will see some error messages on this PR.
Don’t hesitate to ask any questions if you’re not sure what these mean!
In a few minutes, you’ll be able to see a preview of your changes on Vercel
One or more of our maintainers will take a look and may ask you to make changes.
We try to be responsive, but don’t worry if this takes a few days.

github-actions · 2026-08-08T23:21:05Z

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/ar-EG.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/id-ID.json	Localization changed, will be marked as complete.
i18n/locales/it-IT.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/ne-NP.json	Localization changed, will be marked as complete.
i18n/locales/nl.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.

coderabbitai

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 `@i18n/schema.json`:
- Around line 4807-4809: Update the Arabic locale’s compare translations by
removing the stale compare.view_file key and adding or retaining
compare.view_diff instead, matching the property declared in i18n/schema.json so
no additional property is introduced.

🪄 Autofix

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 Plus

Run ID: 24585e1e-3fd9-45f7-8f92-8cf0616809da

📥 Commits

Reviewing files that changed from the base of the PR and between 5be120b and 7ede24c.

📒 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/utils/diff.ts
test/nuxt/components/diff/ViewerPanel.spec.ts
test/unit/shared/utils/diff.spec.ts

codecov · 2026-08-08T23:22:58Z

Codecov Report

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

Files with missing lines	Patch %	Lines
server/api/registry/compare-file/[...pkg].get.ts	0.00%	6 Missing and 4 partials ⚠️
shared/utils/diff.ts	25.00%	2 Missing and 1 partial ⚠️

📢 Thoughts on this report? Let us know!

coderabbitai

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 `@i18n/locales/ar-EG.json`:
- Line 330: Update the Arabic `compare.view_diff` translation from the file-view
label to a diff-specific label meaning “View diff,” such as `عرض الاختلافات`.

🪄 Autofix

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 Plus

Run ID: a3dc546d-5747-4bc8-bc23-f03ce05b9dbf

📥 Commits

Reviewing files that changed from the base of the PR and between 440817a and 64fc4ee.

📒 Files selected for processing (1)

i18n/locales/ar-EG.json

feat: add raw diff actions
7ede24c

ColumbusLabs force-pushed the feat/raw-diff-actions branch from 45e8511 to 7ede24cCompare August 8, 2026 23:20

[autofix.ci] apply automated fixes
440817a

coderabbitaiBot reviewed Aug 8, 2026
View reviewed changes

Comment threadi18n/schema.json

vercelBotdeployed to Preview – npmx.dev August 8, 2026 23:24 View deployment

fix: update Arabic diff translation key
64fc4ee

coderabbitaiBot reviewed Aug 8, 2026
View reviewed changes

Comment threadi18n/locales/ar-EG.json Outdated

vercelBotdeployed to Preview – npmx.dev August 8, 2026 23:43 View deployment

fix: correct Arabic diff label
bd83b01

vercelBotdeployed to Preview – npmx.dev August 8, 2026 23:56 View deployment

serhalp added needs review This PR is waiting for a review from a maintainer front Frontend, Design labels Aug 9, 2026

Navigation Menu

Uh oh!

Uh oh!

feat: add raw diff actions - #3159

feat: add raw diff actions#3159
ColumbusLabs wants to merge 4 commits into
npmx-dev:mainfrom
ColumbusLabs:feat/raw-diff-actions

ColumbusLabs commented Aug 8, 2026

Uh oh!

vercelBot commented Aug 8, 2026•
edited
Loading

Uh oh!

coderabbitaiBot commented Aug 8, 2026•
edited
Loading

Summary by CodeRabbit

Walkthrough

Changes

Sequence Diagram(s)

❌ Failed checks (1 warning)

Uh oh!

github-actionsBot commented Aug 8, 2026

Uh oh!

github-actionsBot commented Aug 8, 2026•
edited
Loading

Uh oh!

coderabbitaiBot left a comment

Uh oh!

Uh oh!

codecovBot commented Aug 8, 2026•
edited
Loading

Uh oh!

coderabbitaiBot left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Uh oh!

Conversation

ColumbusLabs commented Aug 8, 2026

🔗 Linked issue

🧭 Context

📚 Description

Screenshots

Verification

Uh oh!

vercelBot commented Aug 8, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitaiBot commented Aug 8, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Walkthrough

Changes

Sequence Diagram(s)

❌ Failed checks (1 warning)

Uh oh!

github-actionsBot commented Aug 8, 2026

Uh oh!

github-actionsBot commented Aug 8, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Lunaria Status Overview

Tracked Files

Uh oh!

coderabbitaiBot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

codecovBot commented Aug 8, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

coderabbitaiBot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

vercelBot commented Aug 8, 2026•
edited
Loading

coderabbitaiBot commented Aug 8, 2026•
edited
Loading

github-actionsBot commented Aug 8, 2026•
edited
Loading

codecovBot commented Aug 8, 2026•
edited
Loading