Use invoice preview API to calculate plan pricing for SaaS purchase

What does this MR do and why?

Uses invoicePreview GraphQL endpoint to preview transaction during SaaS purchase flow

• We use use_invoice_preview_api_in_saas_purchase feature flag to determine whether or not to use the new API
• With the introduction of preview transaction API, this MR also introduces a loading state and error handling for the same

Note: We need this MR to be deployed to be able to turn this feature flag on but we can still go live with this MR if all is looking well with feature flag off.

Screenshots or screen recordings

Scenario	Screenshot
Feature flag on	Screen_Recording_2023-02-02_at_3.11.20_PM
Feature flag off	Screen_Recording_2023-02-02_at_2.42.17_PM
Large breakpoint subscription purchase
Large breakpoint loading state
Large breakpoint error state
Large breakpoint no users state (no change)
Large breakpoint new group (no change)
Small breakpoint subscription purchase
Small breakpoint loading state
Small breakpoint error state
Small breakpoint no users state (no change)
Small breakpoint new group (no change)

How to set up and validate locally

1. Start gdk in SaaS mode GITLAB_SIMULATE_SAAS=true gdk start
2. Go to a free group's billing page: Settings -> Billing
3. Click on Upgrade CTA on one of the plans

Turn feature flag ON

1. Open rails console rails c
2. Run Feature.enable(:use_invoice_preview_api_in_saas_purchase)

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.

Related to #388075