PipelineUsageApp: Add namespace usage overview

What does this MR do and why?

Relates to: https://gitlab.com/gitlab-org/gitlab/-/issues/345373

As part of the bigger effort to have a common layout for Usage Quotas we need to migrate the pipelines tab to vue. This MR takes care of moving the namespace usage overview (more details in screenshots)

MR	Description
!83021 (merged)	Creation of the component and Buy Additional Minutes button
!84711 (merged)	Add project list and their CI usage
!85917 (merged)	👈 You're here
!86112 (merged)	[Reviewed and merged into this MR] Move usage graphs inside PipelineUsageApp
!86122 (merged)	Add PipelineUsageApp behind feature flag

Screenshots or screen recordings

Without purchasing additional minutes

Before	After

With additional minutes

Before	After

How to set up and validate locally

1. Make sure your Simulating SaaS
2. Make sure that you are running GitLab as SaaS and have check_namespace_plan setting enabled

   ::Gitlab::CurrentSettings.update(check_namespace_plan: true)

3. Apply this patch to inject PipelinesUsageApp in the Usage Quotas page: pipelines-vue-patch.patch
   1. Download the file then git apply ~/path/to/file/pipelines-vue-patch.patch
4. Visit Usage Quotas page:
   1. Group: http://gdk.test:3000/groups/<group-id>/-/usage_quotas#pipelines-quota-tab
   2. Profile: http://gdk.test:3000/-/profile/usage_quotas#pipelines-quota-tab
5. To add some data:
   1. Project:
      1. Create data: Ci::Minutes::ProjectMonthlyUsage.new(project_id: 123, date: Date.new(2022, 05, 01), amount_used: 70).save
      2. Update data: Ci::Minutes::ProjectMonthlyUsage.where(project_id: 123, date: Date.new(2022, 05, 01)).update(amount_used: 70)
   2. Namespace:
      1. Create data: Ci::Minutes::NamespaceMonthlyUsage.new(namespace_id: 321, date: Date.new(2022, 05, 01), amount_used: 70).save
      2. Update data: Ci::Minutes::NamespaceMonthlyUsage.where(namespace_id: 321, date: Date.new(2022, 05, 01)).update(amount_used: 70)
6. Verify that the data is showing correctly
7. There are some UI changes because we're migrating some components to Pajamas

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.