Add purchase commitment card and use it in the Vue app

What does this MR do and why?

Add purchase commitment card and use it in the main usage billing Vue app.

note: the feature is behind a feature flag, it won't be enabled until the whole project is ready.

MR	status
Add usage billing app skeleton with its story (!203124 - merged)	✅
Add purchase commitment card and use it in the ... (!203278 - merged)	this MR

References

Screenshots or screen recordings

Before	After

How to set up and validate locally

• Ensure you're running GitLab as self-managed (e.g. 'export GITLAB_SIMULATE_SAAS=0 gdk restart`)
• Ensure you've a license added to your instance
• Enable billing_usage feature flag (e.g. http://gdk.test:3000/rails/features/usage_billing_dev)
• Navigate to the /admin/gitlab_duo/usage
• Verify the purchase commitment card

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.

Related to #566204