feat(tracemetrics): Add onboarding skeleton for metrics (#102088)

### Summary
This makes use of the hasTraceMetrics flag to properly show onboarding
or not, but does not actually include the onboarding steps (which can be
added later by us or the sdk maintainers).

Author: k-fish

static/app/components/events/featureFlags/onboarding/featureFlagOnboardingLayout.tsx

@@ -47,6 +47,7 @@ export function FeatureFlagOnboardingLayout({
       platformKey,
       project,
       isLogsSelected: false,
+      isMetricsSelected: false,
       isFeedbackSelected: false,
       isPerformanceSelected: false,
       isProfilingSelected: false,

static/app/components/feedback/feedbackOnboarding/feedbackOnboardingLayout.tsx

@@ -47,6 +47,7 @@ export function FeedbackOnboardingLayout({
       project,
       isLogsSelected: false,
       isFeedbackSelected: true,
+      isMetricsSelected: false,
       isPerformanceSelected: false,
       isProfilingSelected: false,
       isReplaySelected: false,

static/app/components/onboarding/gettingStartedDoc/onboardingLayout.tsx

@@ -86,6 +86,7 @@ export function OnboardingLayout({
       project,
       isLogsSelected: activeProductSelection.includes(ProductSolution.LOGS),
       isFeedbackSelected: false,
+      isMetricsSelected: activeProductSelection.includes(ProductSolution.METRICS),
       isPerformanceSelected: activeProductSelection.includes(
         ProductSolution.PERFORMANCE_MONITORING
       ),

static/app/components/onboarding/gettingStartedDoc/types.ts

@@ -87,6 +87,7 @@ export enum ProductSolution {
   SESSION_REPLAY = 'session-replay',
   PROFILING = 'profiling',
   LOGS = 'logs',
+  METRICS = 'metrics',
 }
 
 export interface DocsParams<
@@ -96,6 +97,7 @@ export interface DocsParams<
   dsn: ProjectKey['dsn'];
   isFeedbackSelected: boolean;
   isLogsSelected: boolean;
+  isMetricsSelected: boolean;
   isPerformanceSelected: boolean;
   isProfilingSelected: boolean;
   isReplaySelected: boolean;
@@ -167,6 +169,7 @@ export interface Docs<PlatformOptions extends BasePlatformOptions = BasePlatform
   feedbackOnboardingNpm?: OnboardingConfig<PlatformOptions>;
   logsOnboarding?: OnboardingConfig<PlatformOptions>;
   mcpOnboarding?: OnboardingConfig<PlatformOptions>;
+  metricsOnboarding?: OnboardingConfig<PlatformOptions>;
   performanceOnboarding?: OnboardingConfig<PlatformOptions>;
   platformOptions?: PlatformOptions;
   profilingOnboarding?: OnboardingConfig<PlatformOptions>;

static/app/components/onboarding/gettingStartedDoc/utils/useLoadGettingStarted.ts

@@ -7,6 +7,7 @@ import {
   feedbackOnboardingPlatforms,
   replayPlatforms,
   withLoggingOnboarding,
+  withMetricsOnboarding,
   withPerformanceOnboarding,
 } from 'sentry/data/platformCategories';
 import type {Organization} from 'sentry/types/organization';
@@ -17,7 +18,13 @@ import {useProjectKeys} from 'sentry/utils/useProjectKeys';
 type Props = {
   orgSlug: Organization['slug'];
   platform: PlatformIntegration;
-  productType?: 'feedback' | 'replay' | 'performance' | 'featureFlags' | 'logs';
+  productType?:
+    | 'feedback'
+    | 'replay'
+    | 'performance'
+    | 'featureFlags'
+    | 'logs'
+    | 'metrics';
   projSlug?: Project['slug'];
 };
 
@@ -54,7 +61,8 @@ export function useLoadGettingStarted({
         (productType === 'feedback' &&
           !feedbackOnboardingPlatforms.includes(platform.id)) ||
         (productType === 'featureFlags' &&
-          !featureFlagOnboardingPlatforms.includes(platform.id))
+          !featureFlagOnboardingPlatforms.includes(platform.id)) ||
+        (productType === 'metrics' && !withMetricsOnboarding.has(platform.id))
       ) {
         setModule('none');
         return;

static/app/components/performanceOnboarding/sidebar.tsx

@@ -310,6 +310,7 @@ function OnboardingContent({currentProject}: {currentProject: Project}) {
     project: currentProject,
     isFeedbackSelected: false,
     isLogsSelected: false,
+    isMetricsSelected: false,
     isPerformanceSelected: true,
     isProfilingSelected: false,
     isReplaySelected: false,

static/app/components/profiling/profilingOnboardingSidebar.tsx

@@ -327,6 +327,7 @@ function ProfilingOnboardingContent(props: ProfilingOnboardingContentProps) {
     project: props.project,
     isLogsSelected: false,
     isFeedbackSelected: false,
+    isMetricsSelected: false,
     isPerformanceSelected: true,
     isProfilingSelected: true,
     isReplaySelected: false,

static/app/components/replaysOnboarding/replayOnboardingLayout.tsx

@@ -47,6 +47,7 @@ export function ReplayOnboardingLayout({
       project,
       isLogsSelected: false,
       isFeedbackSelected: false,
+      isMetricsSelected: false,
       isPerformanceSelected: false,
       isProfilingSelected: false,
       isReplaySelected: true,

static/app/components/updatedEmptyState.tsx

@@ -92,6 +92,7 @@ export default function UpdatedEmptyState({project}: {project?: Project}) {
     platformKey: currentPlatformKey,
     project,
     isLogsSelected: false,
+    isMetricsSelected: false,
     isFeedbackSelected: false,
     isPerformanceSelected: false,
     isProfilingSelected: false,

static/app/data/platformCategories.tsx

@@ -390,6 +390,12 @@ export const withoutLoggingSupport: Set<PlatformKey> = new Set([
   'native',
 ]);
 
+// List of platforms that have metrics onboarding checklist content
+export const withMetricsOnboarding: Set<PlatformKey> = new Set([]);
+
+// List of platforms that do not have metrics support. We make use of this list in the product to not provide any Metrics
+export const withoutMetricsSupport: Set<PlatformKey> = new Set([]);
+
 export const profiling: PlatformKey[] = [
   'android',
   'apple',