Add richer empty state for product analytics usage quota

Placeholder issue from these MR comments:

!133781 (comment 1598472955)

Having a tab without data but with a CTA is something that's been done on the Pipelines page but not on Usage quota. We could adopt that pattern here of always showing with a CTA.

Related review suggestion:

Can we add a sentence with an action the user can take after this message? Maybe "Set up product analytics for your projects.".

Proposal

• adjust tab logic, so the product analytics tab is always visible (aside from the product_analytics_usage_quota development feature flag)
• when product analytics is not enabled, show empty state
• when product analytics is enabled but no projects within the group have product analytics enabled, show empty state
• empty state should include relevant call to action (link to docs?)

Design

Standard <gl-empty-state>

Reuse the dashboard empty state SVG illustration:

Implementation plan

• modify groups_helper.rb such that the feature flag is the only thing which hides the tab
• provide a productAnalyticsEnabled flag to frontend
• update the current vue empty state:
  • add a gl-empty-state to parent usage quota component
    • empty state call to action changes depending on productAnalyticsEnabled
      • Enable product analytics
      • Onboard projects with product analytics
      • both link to the product analytics docs (we can't link directly to the onboarding flow as that is project specific and this usage quota page is at the group level) at the relevant anchors.
  • remove the existing plain empty state sentence in the projects usage breakdown. Component should render nothing when empty state, same as group totals component.
  • if productAnalyticsEnabled is false, skip rendering child components
  • otherwise emit event after fetching data if there are no product analytics projects. This causes empty state in parent to show.
• add/update tests