ref(flags): update unleashIntegration param (#12795)

* ref(flags): update unleashIntegration param

* Use info alert

* reword

* Update alert, apply for all platforms, and refactor dup code

Author: aliu39

docs/platforms/javascript/common/configuration/integrations/unleash.mdx

@@ -34,8 +34,16 @@ The [Unleash](https://www.getunleash.io/) integration tracks feature flag evalua
 
 _Import names: `Sentry.unleashIntegration`_
 
+Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+
 <PlatformContent includePath="/configuration/unleash" />
 
+<Alert level="info">
+
+The `unleashClientClass` option has been renamed to `featureFlagClientClass` in v9 of the Sentry SDK. Please update accordingly.
+
+</Alert>
+
 Visit the Sentry website and confirm that your error event has recorded the feature flag "test-flag" and its value "false".
 
 <PlatformContent includePath="feature-flags/next-steps" />

platform-includes/configuration/unleash/javascript.ember.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/ember';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/ember';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.gatsby.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/gatsby';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/gatsby';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/browser';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/browser';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.nextjs.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/nextjs';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/nextjs';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.nuxt.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/nuxt';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/nuxt';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.react.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/react';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/react';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.remix.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/remix';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/remix';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.solid.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/solid';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/solid';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.solidstart.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/solidstart';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/solidstart';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.svelte.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/svelte';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/svelte';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.sveltekit.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/sveltekit';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/sveltekit';
 import { UnleashClient } from 'unleash-proxy-client';
 

platform-includes/configuration/unleash/javascript.vue.mdx

@@ -1,6 +1,27 @@
-Before using this integration, you need to install and instrument Unleash in your app. Learn more by reading [Unleash's SDK reference](https://docs.getunleash.io/reference/sdks/javascript-browser) and [quickstart](https://docs.getunleash.io/quickstart).
+```javascript {tabTitle: JavaScript}
+import * as Sentry from '@sentry/vue';
+import { UnleashClient } from 'unleash-proxy-client';
+
+Sentry.init({
+  dsn: '___PUBLIC_DSN___',
+  integrations: [Sentry.unleashIntegration({featureFlagClientClass: UnleashClient})],
+});
+
+const unleash = new UnleashClient({
+  url: 'https://<your-unleash-instance>/api/frontend',
+  clientKey: '<your-client-side-token>',
+  appName: 'my-webapp',
+});
+
+unleash.start();
+
+// Evaluate a flag with a default value. You may have to wait for your client to synchronize first.
+unleash.isEnabled('test-flag');
+
+Sentry.captureException(new Error('Something went wrong!'));
+```
 
-```javascript
+```javascript {tabTitle: JavaScript (deprecated)}
 import * as Sentry from '@sentry/vue';
 import { UnleashClient } from 'unleash-proxy-client';