import ExternalLink from 'sentry/components/links/externalLink'; import Link from 'sentry/components/links/link'; import List from 'sentry/components/list/'; import ListItem from 'sentry/components/list/listItem'; import {StepType} from 'sentry/components/onboarding/gettingStartedDoc/step'; import type { Docs, DocsParams, OnboardingConfig, } from 'sentry/components/onboarding/gettingStartedDoc/types'; import {appleFeedbackOnboarding} from 'sentry/gettingStartedDocs/apple/apple-macos'; import {t, tct} from 'sentry/locale'; type Params = DocsParams; const getInstallSnippet = () => `brew install getsentry/tools/sentry-wizard && sentry-wizard -i ios`; const getExperimentalFeaturesSnippetSwift = () => ` import Sentry SentrySDK.start { options in // ... // Enable all experimental features options.attachViewHierarchy = true options.enableMetricKit = true options.enableTimeToFullDisplayTracing = true options.swiftAsyncStacktraces = true options.enableAppLaunchProfiling = true }`; const getExperimentalFeaturesSnippetObjC = () => ` @import Sentry; [SentrySDK startWithConfigureOptions:^(SentryOptions *options) { // ... // Enable all experimental features options.attachViewHierarchy = YES; options.enableMetricKit = YES; options.enableTimeToFullDisplayTracing = YES; options.swiftAsyncStacktraces = YES; options.enableAppLaunchProfiling = YES; }];`; const getConfigureMetricsSnippetSwift = (params: Params) => ` import Sentry SentrySDK.start { options in options.dsn = "${params.dsn}" options.enableMetrics = true }`; const getConfigureMetricsSnippetObjC = (params: Params) => ` @import Sentry; [SentrySDK startWithConfigureOptions:^(SentryOptions * options) { options.Dsn = @"${params.dsn}"; options.enableMetrics = YES; }];`; const getVerifyMetricsSnippetSwift = () => ` import Sentry // Incrementing a counter by one for each button click. SentrySDK.metrics .increment(key: "button_login_click", value: 1.0, tags: ["screen": "login"] ) // Add '150' to a distribution used to track the loading time. SentrySDK.metrics .distribution(key: "image_download_duration", value: 150.0, unit: MeasurementUnitDuration.millisecond, tags: ["screen": "login"] ) // Adding '1' to a gauge used to track the loading time. SentrySDK.metrics .gauge(key: "page_load", value: 1.0, unit: MeasurementUnitDuration.millisecond, tags: ["screen": "login"] ) // Add 'jane' to a set // used for tracking the number of users that viewed a page. SentrySDK.metrics .set(key: "user_view", value: "jane", unit: MeasurementUnit(unit: "username"), tags: ["screen": "login"] )`; const getVerifyMetricsSnippetObjC = () => ` @import Sentry; // Incrementing a counter by one for each button click. [SentrySDK.metrics incrementWithKey :@"button_login_click" value: 1.0 unit: SentryMeasurementUnit.none tags: @{ @"screen" : @"login" } ]; // Add '150' to a distribution used to track the loading time. [SentrySDK.metrics distributionWithKey: @"image_download_duration" value: 150.0 unit: SentryMeasurementUnitDuration.millisecond tags: @{ @"screen" : @"login" } ]; // Adding '1' to a gauge used to track the loading time. [SentrySDK.metrics gaugeWithKey: @"page_load" value: 1.0 unit: SentryMeasurementUnitDuration.millisecond tags: @{ @"screen" : @"login" } ]; // Add 'jane' to a set // used for tracking the number of users that viewed a page. [SentrySDK.metrics setWithKey :@"user_view" value: @"jane" unit: [[SentryMeasurementUnit alloc] initWithUnit:@"username"] tags: @{ @"screen" : @"login" } ];`; const onboarding: OnboardingConfig = { install: () => [ { type: StepType.INSTALL, description: (
{tct(
'Add Sentry automatically to your app with the [wizardLink:Sentry wizard] (call this inside your project directory).',
{
wizardLink: (
,
}
)}
,
xcodebuild:
,
}
)}
,
gitignore:
,
}
)}
,
docsLink: ,
}
),
configurations: [
{
language: 'yml',
partialLoading: params.sourcePackageRegistries?.isLoading,
code: getInstallSnippet(),
},
],
},
],
configure: (params: DocsParams) => [
{
type: StepType.CONFIGURE,
description: t(
'To enable capturing metrics, you need to enable the metrics feature.'
),
configurations: [
{
code: [
{
label: 'Swift',
value: 'swift',
language: 'swift',
code: getConfigureMetricsSnippetSwift(params),
},
{
label: 'Objective-C',
value: 'c',
language: 'c',
code: getConfigureMetricsSnippetObjC(params),
},
],
},
],
},
],
verify: () => [
{
type: StepType.VERIFY,
description: tct(
"Then you'll be able to add metrics as [codeCounters:counters], [codeSets:sets], [codeDistribution:distributions], and [codeGauge:gauges]. These are available under the [codeNamespace:SentrySDK.metrics()] namespace. Try out this example:",
{
codeCounters:
,
codeSets:
,
codeDistribution:
,
codeGauge:
,
codeNamespace:
,
}
),
configurations: [
{
configurations: [
{
code: [
{
label: 'Swift',
value: 'swift',
language: 'swift',
code: getVerifyMetricsSnippetSwift(),
},
{
label: 'Objective-C',
value: 'c',
language: 'c',
code: getVerifyMetricsSnippetObjC(),
},
],
},
],
},
{
description: t(
'With a bit of delay you can see the data appear in the Sentry UI.'
),
},
{
description: tct(
'Learn more about metrics and how to configure them, by reading the [docsLink:docs].',
{
docsLink: (