Onboarding - tracking codes view

What does this MR do and why?

Related to #381320 (closed)

When a user is setting up the Product Analytics feature and has a valid jitsu_key (alongside the rest of the required values) and no data, we need to present the setup instructions to instrument tracking.

These instructions come from https://gitlab.com/gitlab-org/analytics-section/product-analytics/gl-application-sdk-js/-/tree/main/packages/js-sdk#how-to-call-the-script.

Screenshots or screen recordings

Click to expand screenshot

How to set up and validate locally

Validate with a patch

The easiest way to test this feature locally is to force the rendering of this page on /flightjs/Flight/-/product_analytics/dashboards (or another project) by applying the following patch (pbpaste | git apply after copying).

Click to expand patch

diff --git a/ee/app/assets/javascripts/product_analytics/product_analytics_app.vue b/ee/app/assets/javascripts/product_analytics/product_analytics_app.vue
index 792bc4f82b22..bba3454614c0 100644
--- a/ee/app/assets/javascripts/product_analytics/product_analytics_app.vue
+++ b/ee/app/assets/javascripts/product_analytics/product_analytics_app.vue
@@ -31,8 +31,8 @@ export default {
   async created() {
     const status = await this.getOnboardingStatus();
 
-    this.isOnboarding = status === 'no_project_instance';
-    this.needsSetup = status === 'no_instance_data';
+    this.isOnboarding = false;
+    this.needsSetup = true;
     this.isLoading = false;
   },
   methods: {

Regular validation

Please follow the instructions at https://gitlab.com/gitlab-org/gitlab/-/snippets/2474959 to enable Product Analytics on your GDK.

With the Product Analytics feature enabled:

1. Initialize the stack for a new project on the Rails console (rails c):

   project = Project.find_by_id(1)
   ProductAnalytics::InitializeStackService.new(container: project).execute
   # Expected response:
   # <ServiceResponse:0x00000001621a6db0 @http_status=:ok, @message="Product analytics initialization started", @payload={}, @reason=nil, @status=:success>

2. Go to /[namespace]/[project]/-/product_analytics/dashboards.
3. The setup page should render.

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.