Skip to content

feat: add raw diff actions - #3159

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

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

Conversation

@ColumbusLabs

Copy link
Copy Markdown

🔗 Linked issue

Fixes #3032

🧭 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:

Before

After:

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

vercel Bot commented Aug 8, 2026

Copy link
Copy Markdown
Contributor

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

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

Request Review

@coderabbitai

coderabbitai Bot commented Aug 8, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

📝 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
Loading

Possibly related PRs

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

github-actions Bot commented Aug 8, 2026

Copy link
Copy Markdown

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

Here’s what will happen next:

  1. 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!

  2. In a few minutes, you’ll be able to see a preview of your changes on Vercel

  3. 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.

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

github-actions Bot commented Aug 8, 2026

Copy link
Copy Markdown

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 coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

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 `@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

Comment thread i18n/schema.json
@codecov

codecov Bot commented Aug 8, 2026

Copy link
Copy Markdown

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 coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

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 `@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

Comment thread i18n/locales/ar-EG.json Outdated
@serhalp serhalp added needs review This PR is waiting for a review from a maintainer front Frontend, Design labels Aug 9, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

front Frontend, Design needs review This PR is waiting for a review from a maintainer

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[feature]: Copy / View changes as .diff

2 participants