Build the Jira pages under Vue 3 behind a flag

tutumantuturequested to merge
gitlab-community/gitlab-org/gitlab:630030-vue3-migrate-jira into master

What does this MR do and why?

Declares the five Jira entrypoints as rollout so the bundler emits a Vue 3 chunk alongside the Vue 2 one, and Rails serves the Vue 3 chunk when vue3_migrate_jira is enabled.

  • pages.jira_connect.branches.new
  • pages.jira_connect.oauth_callbacks
  • pages.projects.import.jira
  • pages.projects.integrations.jira.issues.index
  • pages.projects.integrations.jira.issues.show

All five files validate against config/vue3migration/migration_schema.js.

One flag for all five

The five pages span three areas: the Jira Cloud app, the Jira issue importer, and the Jira issues integration. They share a flag because the issue scopes them as one unit and every one of their controllers declares feature_category :team_planning, which maps to product_group: work_items, so there is no split in ownership to respect. If the reviewer would rather roll the Jira Cloud app pages separately from the rest, splitting the flag is easy and I am happy to do it.

The rollout needs a GitLab DRI

The rollout issue is #630837, with the DRI deliberately unfilled. Rolling this out means running /chatops gitlab run feature set ... in GitLab's internal #production channel and watching dashboards on log.gprd.gitlab.net, none of which is available to a wider community contributor. Someone from groupwork items needs to pick that up for the flag to reach 100%.

I raised the same question on the sibling ZenTao issue at #630032, since it applies to every issue under the parent epic. If the team would rather own these migrations end to end, closing this is a perfectly reasonable outcome.

References

Closes #630030

Rollout issue #630837

Sibling merge request for the ZenTao pages !257701 (merged)

Part of gitlab-org#23066

Screenshots or screen recordings

No visible change while the flag is off, which is how it ships. With the flag enabled, the same pages render from the Vue 3 chunk.

To confirm which apps run under Vue 3 on an environment, query the DOM marker set by the Vue 3 runtime:

document.querySelectorAll('[data-gitlab-vue3-app]')

How to set up and validate locally

  1. Enable the flag: Feature.enable(:vue3_migrate_jira).
  2. Walk the five pages: the Jira Cloud app branch creation and OAuth callback screens, the Jira issue importer, and the Jira issues list and detail pages on an Ultimate namespace with the Jira integration configured.
  3. Confirm each renders correctly and document.querySelectorAll('[data-gitlab-vue3-app]') returns a node.
  4. Disable the flag and confirm all five still render from the Vue 2 chunk.

The Jira Cloud app pages are worth the closest look, since they run inside an Atlassian iframe and are the least like the others.

Each metadata file was checked against the repo's own validator, and all five return VALID.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist.

Merge request reports