Adds UI elements for deprecated packages
What does this MR do and why?
We added support for npm deprecate, so it'd be good to reflect that on the UI.
Although support exists only for npm package format atm, the frontend implementation ignores that since the backend plans to return this value via the existing status field, see decision.
Based on ux input,
- Adds badge on package list page
- Adds warning alert on package detail page
Changelog: added
MR acceptance checklist
Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Screenshots or screen recordings
Screenshots are required for UI changes, and strongly recommended for all other merge requests.
After deprecation:
| List page | Details page |
|---|---|
 |
 |
How to set up and validate locally
- Create an npm package, follow steps in https://gitlab.com/gitlab-org/ci-cd/package-stage/package/-/wikis/Packages-Tips-&-Tricks#how-to-create-a-new-package-artificially
- Apply patch since backend is still being worked on in #474231 (closed):
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_list_row.vue b/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_list_row.vue
index c5af8d304d10..3ce9f82cd0ba 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_list_row.vue
+++ b/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_list_row.vue
@@ -92,7 +92,7 @@ export default {
return this.packageEntity.protectionRuleExists;
},
showDeprecatedBadge() {
- return this.packageEntity.status === PACKAGE_DEPRECATED_STATUS;
+ return this.packageEntity.status !== PACKAGE_DEPRECATED_STATUS;
},
nonDefaultRow() {
return this.packageEntity.status && this.packageEntity.status !== PACKAGE_DEFAULT_STATUS;
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/pages/details.vue b/app/assets/javascripts/packages_and_registries/package_registry/pages/details.vue
index 1d775728f353..d406999535af 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/pages/details.vue
+++ b/app/assets/javascripts/packages_and_registries/package_registry/pages/details.vue
@@ -194,7 +194,7 @@ export default {
return this.packageType === PACKAGE_TYPE_NUGET;
},
showDeprecationAlert() {
- return this.packageEntity.status === PACKAGE_DEPRECATED_STATUS;
+ return this.packageEntity.status !== PACKAGE_DEPRECATED_STATUS;
},
showFiles() {
return this.packageType !== PACKAGE_TYPE_COMPOSER;- Visit
Group > Deploy > Package registry&Project > Deploy > Package registryThis should show the list page & it should show adeprecatedbadge. - Click on the package with the
deprecatedbadge & confirm that alert is visible on the package details page.
Related to #474231 (closed)
Merge request reports
Activity
changed milestone to %17.6
assigned to @rchanila
added pipelinetier-1 label
2 Warnings 
featureaddition and featureenhancement merge requests normally have a documentation change. Consider adding a documentation update or confirming the documentation plan with the Technical Writer counterpart.
For more information, see:
- The Handbook page on merge request types.
- The definition of done documentation.
This merge request changed files with disabled eslint rules. Please consider fixing them. Disabled eslint rules
The following files have disabled
eslintrules. Please consider fixing them:app/assets/javascripts/packages_and_registries/package_registry/constants.js
Run the following command for more details
node_modules/.bin/eslint --report-unused-disable-directives --no-inline-config \ 'app/assets/javascripts/packages_and_registries/package_registry/constants.js'Reviewer roulette
Category Reviewer Maintainer frontend @a_akgun(UTC+3, 8 hours behind author)
@deepika.guliani(UTC+5.5, 5.5 hours behind author)
Please refer to documentation page for guidance on how you can benefit from the Reviewer Roulette, or use the GitLab Review Workload Dashboard to find other available reviewers.
If needed, you can retry the
danger-reviewjob that generated this comment.Generated by
Bundle size analysis [beta]
This compares changes in bundle size for entry points between the commits a32c7f57 and bc58721e
Entrypoint / Name Size before Size after Diff Diff in percent average 4.39 MB 4.39 MB - 0.0 % mainChunk 3.31 MB 3.31 MB - 0.0 %
Note: We do not have exact data for a32c7f57. So we have used data from: 02a7b43c.
The intended commit has no webpack pipeline, so we chose the last commit with one before it.Please look at the full report for more details
Read more about how this report works.
Generated by
removed rails label
removed backend label
mentioned in issue #474231 (closed)
added 1086 commits
-
1c49ec48...e3a3e09c - 1085 commits from branch
master - bc58721e - Adds UI elements for deprecated packages
-
1c49ec48...e3a3e09c - 1085 commits from branch
Resolved by Rahul Chanila@marina.mosti can you please do the frontend review? Thanks!
- Last reply by Rahul Chanila
added workflowin review label and removed workflowin dev label
requested review from @marina.mosti
requested review from @fernanda.toledo
removed review request for @marina.mosti
requested review from @anna_vovchenko
removed review request for @fernanda.toledo
added pipeline:mr-approved label
added pipelinetier-3 pipeline:run-e2e-omnibus-once labels
requested review from @deepika.guliani
E2E Test Result Summary
allure-report-publishergenerated test report!e2e-test-on-gdk:
expand test summary
+------------------------------------------------------------------+ | suites summary | +-------------+--------+--------+---------+-------+-------+--------+ | | passed | failed | skipped | flaky | total | result | +-------------+--------+--------+---------+-------+-------+--------+ | Create | 129 | 0 | 22 | 0 | 151 | ✅ | | Package | 17 | 0 | 18 | 0 | 35 | ✅ | | Verify | 45 | 0 | 2 | 0 | 47 | ✅ | | Govern | 75 | 0 | 3 | 0 | 78 | ✅ | | Fulfillment | 2 | 0 | 0 | 0 | 2 | ✅ | | Analytics | 2 | 0 | 0 | 0 | 2 | ✅ | | Plan | 76 | 0 | 0 | 0 | 76 | ✅ | | Data Stores | 33 | 0 | 1 | 0 | 34 | ✅ | | Ai-powered | 0 | 0 | 1 | 0 | 1 | ➖ | | Monitor | 8 | 0 | 0 | 0 | 8 | ✅ | | Manage | 1 | 0 | 1 | 0 | 2 | ✅ | | Secure | 4 | 0 | 0 | 0 | 4 | ✅ | | Release | 5 | 0 | 0 | 0 | 5 | ✅ | +-------------+--------+--------+---------+-------+-------+--------+ | Total | 397 | 0 | 48 | 0 | 445 | ✅ | +-------------+--------+--------+---------+-------+-------+--------+e2e-test-on-cng:
expand test summary
+------------------------------------------------------------------+ | suites summary | +-------------+--------+--------+---------+-------+-------+--------+ | | passed | failed | skipped | flaky | total | result | +-------------+--------+--------+---------+-------+-------+--------+ | Create | 138 | 1 | 21 | 0 | 160 | ❌ | | Verify | 50 | 0 | 15 | 0 | 65 | ✅ | | Govern | 83 | 1 | 9 | 2 | 93 | ❌ | | Monitor | 8 | 0 | 12 | 0 | 20 | ✅ | | Package | 24 | 0 | 14 | 0 | 38 | ✅ | | Plan | 86 | 0 | 8 | 0 | 94 | ✅ | | Analytics | 2 | 0 | 0 | 0 | 2 | ✅ | | Data Stores | 33 | 0 | 10 | 0 | 43 | ✅ | | Ai-powered | 0 | 0 | 2 | 0 | 2 | ➖ | | Release | 5 | 0 | 1 | 0 | 6 | ✅ | | Secure | 1 | 0 | 6 | 0 | 7 | ✅ | | Configure | 0 | 0 | 3 | 0 | 3 | ➖ | | Fulfillment | 2 | 0 | 7 | 0 | 9 | ✅ | | Growth | 0 | 0 | 2 | 0 | 2 | ➖ | | Manage | 1 | 0 | 9 | 0 | 10 | ✅ | | ModelOps | 0 | 0 | 1 | 0 | 1 | ➖ | +-------------+--------+--------+---------+-------+-------+--------+ | Total | 433 | 2 | 120 | 2 | 555 | ❌ | +-------------+--------+--------+---------+-------+-------+--------+started a merge train
mentioned in commit 0da0cec3
added workflowstaging-canary label and removed workflowin review label
added workflowcanary label and removed workflowstaging-canary label
added workflowstaging label and removed workflowcanary label
added workflowproduction label and removed workflowstaging label
added workflowpost-deploy-db-staging label and removed workflowproduction label
added workflowpost-deploy-db-production label and removed workflowpost-deploy-db-staging label
added releasedcandidate label
added releasedpublished label and removed releasedcandidate label
