ref(feedback): update onboarding tray to show enableScreenshot config (…

…#70867) Closes #69683 `enableScreenshot` is `true` by default: https://docs.sentry.io/platforms/javascript/user-feedback/configuration/#user-and-form https://github.com/getsentry/sentry/assets/56095982/7dab204b-6b1d-4eb4-9119-02532dfc37b2
getsentry · May 14, 2024 · 1f61c87 · 1f61c87
1 parent 60756d7
commit 1f61c87
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 0 deletions.
diff --git a/static/app/components/feedback/feedbackOnboarding/feedbackConfigToggle.tsx b/static/app/components/feedback/feedbackOnboarding/feedbackConfigToggle.tsx
@@ -9,11 +9,15 @@ function FeedbackConfigToggle({
   onEmailToggle,
   nameToggle,
   onNameToggle,
+  screenshotToggle,
+  onScreenshotToggle,
 }: {
   emailToggle: boolean;
   nameToggle: boolean;
   onEmailToggle: () => void;
   onNameToggle: () => void;
+  onScreenshotToggle: () => void;
+  screenshotToggle: boolean;
 }) {
   return (
     <SwitchWrapper>
@@ -25,6 +29,15 @@ function FeedbackConfigToggle({
         {t('Email Required')}
         <Switch id="email" toggle={onEmailToggle} size="lg" isActive={emailToggle} />
       </SwitchItem>
+      <SwitchItem htmlFor="screenshot">
+        {t('Enable Screenshots')}
+        <Switch
+          id="screenshot"
+          toggle={onScreenshotToggle}
+          size="lg"
+          isActive={screenshotToggle}
+        />
+      </SwitchItem>
     </SwitchWrapper>
   );
 }

diff --git a/static/app/components/feedback/feedbackOnboarding/feedbackOnboardingLayout.tsx b/static/app/components/feedback/feedbackOnboarding/feedbackOnboardingLayout.tsx
@@ -25,6 +25,7 @@ export function FeedbackOnboardingLayout({
 
   const [email, setEmail] = useState(false);
   const [name, setName] = useState(false);
+  const [screenshot, setScreenshot] = useState(true);
 
   const {isLoading: isLoadingRegistry, data: registryData} =
     useSourcePackageRegistries(organization);
@@ -52,6 +53,7 @@ export function FeedbackOnboardingLayout({
       feedbackOptions: {
         email,
         name,
+        screenshot,
       },
     };
 
@@ -74,6 +76,7 @@ export function FeedbackOnboardingLayout({
     configType,
     email,
     name,
+    screenshot,
   ]);
 
   return (
@@ -91,8 +94,10 @@ export function FeedbackOnboardingLayout({
                     <FeedbackConfigToggle
                       emailToggle={email}
                       nameToggle={name}
+                      screenshotToggle={screenshot}
                       onEmailToggle={() => setEmail(!email)}
                       onNameToggle={() => setName(!name)}
+                      onScreenshotToggle={() => setScreenshot(!screenshot)}
                     />
                   ),
                 }}

diff --git a/static/app/components/onboarding/gettingStartedDoc/types.ts b/static/app/components/onboarding/gettingStartedDoc/types.ts
@@ -51,6 +51,7 @@ export interface DocsParams<
   feedbackOptions?: {
     email?: boolean;
     name?: boolean;
+    screenshot?: boolean;
   };
   newOrg?: boolean;
   replayOptions?: {

diff --git a/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx b/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx
@@ -82,11 +82,16 @@ export const CrashReportWebApiOnboarding: OnboardingConfig = {
 export const getFeedbackConfigOptions = ({
   name,
   email,
+  screenshot,
 }: {
   email?: boolean;
   name?: boolean;
+  screenshot?: boolean;
 } = {}) => {
   const options: string[] = [];
+  if (!screenshot) {
+    options.push('enableScreenshot: false,');
+  }
   if (name) {
     options.push('isNameRequired: true,');
   }