Add artifact registry repositories SPA shell

What does this MR do and why?

Adds the organization Artifact Registry repositories-area Vue SPA shell (monolith/S01 Step 4a) — the Platform foundation later AR slices render inside.

Why: the repositories area needs a Vue single-page app shell before any slice can render inside it: the SPA bootstrap, the router scaffolding, and the page-entrypoint wiring that mounts it. It registers no slice routes and makes no AR call, and stays dark behind the existing artifact_registry_ui feature flag (no new flag, no changelog).

What:

  • pages/repositories/index.js reads the mount dataset, builds the history-mode router from the controller-supplied slug-scoped base path, attaches the shared createDefaultClient Apollo provider, and mounts the shell.
  • pages/repositories/app.vue hosts the router outlet in a focusable container and moves focus to it on client-side route changes.
  • router/index.js registers the catch-all in-SPA not-found route and the afterEach document-title hook; it registers no slice routes.
  • components/not_found.vue renders the in-SPA not-found empty state (heading level 1); utils.js updateDocumentTitle keeps the document title in sync with the active route.
  • pages/organizations/artifact_registry_repositories/index/index.js is the per-page auto-loaded entrypoint that calls initArtifactRegistryRepositories so the shell mounts in the running app.
  • Shell strings are externalized via the i18n helper. Jest/VTU specs cover the router, the shell, and route-change focus; an RSpec feature spec drives the rendered view in a browser to guard the page-entrypoint wiring.

References

  • Related issue: #604732 (closed) (Artifact Registry repositories area: Rails mount, Vue SPA shell, and navigation — monolith/S01 Steps 4, 4a, 4b)
  • Builds on the merged Repositories Rails mount (Step 4, !244511 (merged)) and the shared gating seam (Step 3, !244109 (merged)).

Screenshots or screen recordings

This slice ships dark behind artifact_registry_ui and registers no slice routes, so the mounted shell renders the in-SPA "Page not found" empty state until later slices add routes.

Before After
Screenshot_2026-07-13_at_11.16.38_pm

How to set up and validate locally

  1. Enable the flags in a Rails console:
    Feature.enable(:artifact_registry_ui)
    Feature.enable(:ui_for_organizations)
  2. Visit /o/<org>/-/artifact_registry/acme/repositories — the Vue shell mounts (focusable container).
  3. Visit /o/<org>/-/artifact_registry/acme/repositories/does-not-exist — the Rails *vueroute catch-all serves the SPA and the in-SPA "Page not found" fallback renders.
  4. Visit /o/<org>/-/artifact_registry/notacme/repositories — a slug other than acme returns a Rails 404.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Rahul Chanila

Merge request reports

Loading
Loading