Split summary cards on Usage Quotas Pipelines

What does this MR do and why?

This is pure maintenancerefactor in preparation of FE: Bring the cards design on Usage Quotas Pipe... (#350787 - closed) , there should be no visual or behavioural changes.

I think there are a few things that need to be updated behaviour wise, but this MR tries to preserve existing code and behaviour.

This MR splits the Usage Quotas Pipelines summary card into two separate components. This simplifies the parent component and makes the children components more specialised. Which would ease-up the migration to more stylised cards.

References

Please include cross links to any resources that are relevant to this MR This will give reviewers and future readers helpful context to give an efficient review of the changes introduced.

• FE: Bring the cards design on Usage Quotas Pipe... (#350787 - closed)

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

Should be the same before-after

Before	After

How to set up and validate locally

Easy mode: Storybook

This MR contains two commits: first adds more stories to test the functionality (HEAD~1), and the second is the refactoring.

1. start Storybook via npm run storybook:start
2. open http://localhost:9002/?path=/story/ee-usage-quotas-pipelines-app--default
3. try comparing this version to git checkout HEAD~1 to see that there are no changes

Real mode:

1. simulate SaaS
2. open Usage Quotas view at the pipelines tab (e.g. http://localhost:3000/groups/gitlab-org/-/usage_quotas#pipelines-quota-tab)
3. verify that the tab looks similarly to the master branch