Skip to content

feat: add deprecated marking to package timeline page - #3133

Merged
gameroman merged 6 commits into
npmx-dev:mainfrom
btea:feat/timeline-deprecated
Aug 13, 2026
Merged

feat: add deprecated marking to package timeline page#3133
gameroman merged 6 commits into
npmx-dev:mainfrom
btea:feat/timeline-deprecated

Conversation

@btea

@btea btea commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

🔗 Linked issue

/

🧭 Context

related to #3121 (comment)

📚 Description

@vercel

vercel Bot commented Aug 4, 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 12, 2026 11:58pm
2 Skipped Deployments
Project Deployment Actions Updated (UTC)
docs.npmx.dev Ignored Ignored Preview Aug 12, 2026 11:58pm
npmx-lunaria Ignored Ignored Aug 12, 2026 11:58pm

Request Review

@github-actions

github-actions Bot commented Aug 4, 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/en.json Source changed, localizations will be marked as outdated.
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.

@gameroman

Copy link
Copy Markdown
Member

Also related to #2630

@codecov

codecov Bot commented Aug 4, 2026

Copy link
Copy Markdown

Codecov Report

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

Files with missing lines Patch % Lines
...p/pages/package-timeline/[[org]]/[packageName].vue 0.00% 3 Missing and 1 partial ⚠️
app/components/Package/TimelineChart.vue 0.00% 1 Missing ⚠️

📢 Thoughts on this report? Let us know!

@gameroman gameroman left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Does it only show the latest version that is deprecated on timeline?

It seems to differ from the versions view

Screenshots

https://npmx-m0g6t0w58-npmx.vercel.app/package-timeline/websim/v/0.1.0

Image

https://npmx-m0g6t0w58-npmx.vercel.app/package/websim/versions

Image

@coderabbitai

coderabbitai Bot commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 05d67ebe-1f67-46b1-aed3-5398110c3202

📥 Commits

Reviewing files that changed from the base of the PR and between 7aacc27 and c4ec2c3.

📒 Files selected for processing (1)
  • app/pages/package-timeline/[[org]]/[packageName].vue
🚧 Files skipped from review as they are similar to previous changes (1)
  • app/pages/package-timeline/[[org]]/[packageName].vue

📝 Walkthrough

Summary by CodeRabbit

  • New Features

    • Package timeline entries now indicate when a version is deprecated, including versions without a predecessor.
    • Timeline events distinguish success, warning and error states with green, amber and red markers and text.
    • Timeline details display consistently for entries with sub-events or deprecation information.
    • Deprecation information is available in English, Simplified Chinese and Traditional Chinese.
  • Documentation

    • Added translations and schema support for the deprecated status label.

Walkthrough

The timeline API now returns deprecation messages and categorical sub-event states. The package timeline creates deprecation events for all deprecated versions. Charts render success, warning, and error states. Supported locales include the deprecated label.

Changes

Package timeline status states

Layer / File(s) Summary
Define timeline status data
server/api/registry/timeline/[...pkg].get.ts, app/utils/charts.ts
TimelineVersion now includes an optional deprecated field. SubEvent now uses success, warn, or error states instead of positive.
Generate timeline sub-events
app/pages/package-timeline/[[org]]/[packageName].vue
The timeline creates error events for deprecated versions, including versions without a semver predecessor. Other version changes now use categorical states.
Render states and translations
app/components/Package/TimelineChart.vue, app/components/Package/TimelineChartXyTooltip.vue, i18n/schema.json, i18n/locales/en.json, i18n/locales/zh-CN.json, i18n/locales/zh-TW.json
Charts classify and render success, warning, and error states. Locale files and the i18n schema define the deprecated label.

Sequence Diagram(s)

sequenceDiagram
  participant PackageMetadata
  participant TimelineAPI
  participant PackageTimelinePage
  participant TimelineCharts
  participant I18nTranslations
  PackageMetadata->>TimelineAPI: Provide deprecation metadata
  TimelineAPI->>PackageTimelinePage: Return timeline versions and states
  PackageTimelinePage->>I18nTranslations: Request deprecated label
  I18nTranslations-->>PackageTimelinePage: Return translated label
  PackageTimelinePage->>TimelineCharts: Render sub-events
  TimelineCharts-->>PackageTimelinePage: Display green, amber, or red states
Loading

Possibly related PRs

Suggested reviewers: gameroman

Mergeability Score: ⚪ Minimal · up to c4ec2

This change adds deprecated-package marking to the package timeline page without any identified merge-blocking risk; it is merge-ready after normal checks and review.

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name Status Explanation Resolution
Description check ❓ Inconclusive The description identifies related work but contains no meaningful summary of the changes or their purpose. Add a brief summary of the implementation, user impact, rationale, and relevant tests.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly identifies the main change: adding deprecated marking to the package timeline page.
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 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.

@btea

btea commented Aug 4, 2026

Copy link
Copy Markdown
Contributor Author

@gameroman Thank you for providing the example; I hadn't considered this scenario before.

@gameroman gameroman left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Nice!

@gameroman
gameroman requested a review from a team August 4, 2026 13:35

@ghostdevv ghostdevv left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I wonder if we should show the deprecation on the timeline graph itself too?

@ghostdevv
ghostdevv requested a review from 43081j August 11, 2026 21:57
@graphieros

graphieros commented Aug 12, 2026

Copy link
Copy Markdown
Member

I wonder if we should show the deprecation on the timeline graph itself too?

I think we should, since the chart can be exported, it needs to carry this information.
Changes I would recommend:

  • adding an icon to signal deprecation above related data points (and to avoid stacking possibly 3 icons above a data point, I would say if it is deprecated we only show the deprecation icon)
  • adding the deprecation information inside the tooltip
  • icon & tooltip info should be visible on all 3 charts
  • optional: adding a legend to explain what icons mean, 3 is already 'a lot'

These are not small changes, I recommend a separate issue. I think the present PR can be merged as is, then I can deal with the graph updates.

@gameroman
gameroman self-requested a review August 12, 2026 08:25

@gameroman gameroman left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I think instead of user provided deprecated message

Image

We should show it just as "Deprecated version", for example

Image

Or maybe like this

Image

@btea

btea commented Aug 12, 2026

Copy link
Copy Markdown
Contributor Author

@gameroman It has been adjusted.

@gameroman gameroman added the needs review This PR is waiting for a review from a maintainer label Aug 12, 2026
Comment thread app/pages/package-timeline/[[org]]/[packageName].vue Outdated
Comment thread app/pages/package-timeline/[[org]]/[packageName].vue Outdated

@gameroman gameroman left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Looks nice

Timeline graph changes can be a separate PR 👍

@graphieros

Copy link
Copy Markdown
Member

Timeline graph changes can be a separate PR 👍

Agreed, although it's just cosmetics, as the warning icon works well

@gameroman
gameroman added this pull request to the merge queue Aug 13, 2026
Merged via the queue into npmx-dev:main with commit 9c6c3cf Aug 13, 2026
24 checks passed
@btea
btea deleted the feat/timeline-deprecated branch August 13, 2026 08:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

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.

5 participants