Vue 3 migration: admin pipeline usage quotas

Part of &23285.

This page shows admin pipeline usage quotas. It has one EE-only entrypoint.

Entrypoints & apps

Entrypoint Vue apps mounted Page-specific components
ee/app/assets/javascripts/pages/admin/application_settings/usage_quotas/index.js The usage quotas app. initUsageQuotasAdminView builds a tab list from getPipelineTabMetadata(), then calls mountUsageQuotasApp, which mounts with initVueApp (app/assets/javascripts/usage_quotas/utils.js:9) 7: 6 in usage_quotas/pipelines, 1 in usage_quotas/components

Ownership

The components live under usage_quotas/, which the Fulfillment group owns, even though the page is attributed to Verify. Ask Fulfillment to review the merge request.

Risks

  • The app mounts with initVueApp, so the root element carries the data-gitlab-vue3-app marker. A silent fallback to Vue 2 is therefore detectable.
  • The page builds its tab list at runtime from metadata objects rather than from a static template. Check that the pipeline tab appears at all, and that its minutes usage table renders.

Tasks / MRs

  • MR 1: add the vue3_migrate_pipeline_usage_quotas flag definition and one vue3_migration.yml under ee/. Ask Fulfillment to review.
  • Render the admin usage quotas page with the flag on. Confirm the pipeline tab appears.
  • Check the minutes usage table renders and paginates.
  • Write a Sentry query for this flag before ramping.
  • Ramp the flag as shown below.
  • Cleanup MR: move the yml to status: migrated and remove the flag.

Rollout

enable for gitlab-org (dogfood)
→ 10% → 50% → 100%, with a soak between steps
→ default_enabled: true → cleanup MR

Notes

  • Restart the Vite dev server after you add a vue3_migration.yml. Otherwise the entry map stays stale, the app never mounts, and no console error appears.
  • Local GDK runs Vue 2. Stub the flag off to check rendering in feature specs.