chore(data-cy): require data-cy attributes [EE-6880] (#11453)

app/react/components/modals/Dialog.tsx

@@ -69,6 +69,7 @@ export function Dialog<T>({
             color={button.color}
             key={index}
             size="medium"
+            data-cy={button.dataCy}
           >
             {button.label} {button.timeout && count ? `(${count})` : null}
           </Button>

app/react/components/modals/SwitchPrompt.tsx

@@ -1,5 +1,7 @@
 import { ReactNode, useState } from 'react';
 
+import { AutomationTestingProps } from '@/types';
+
 import { SwitchField } from '@@/form-components/SwitchField';
 
 import { ModalType, type ButtonOptions } from './types';
@@ -16,6 +18,7 @@ function SwitchPrompt({
   modalType,
   message,
   defaultValue = false,
+  'data-cy': dataCy,
 }: {
   onSubmit: OnSubmit<{ value: boolean }>;
   title: string;
@@ -24,7 +27,7 @@ function SwitchPrompt({
   modalType?: ModalType;
   message?: ReactNode;
   defaultValue?: boolean;
-}) {
+} & AutomationTestingProps) {
   const [value, setValue] = useState(defaultValue);
 
   return (
@@ -36,6 +39,7 @@ function SwitchPrompt({
           {message && <div className="mb-3">{message}</div>}
           <SwitchField
             name="value"
+            data-cy={dataCy}
             label={switchLabel}
             checked={value}
             onChange={setValue}
@@ -56,12 +60,15 @@ export async function openSwitchPrompt(
     modalType,
     message,
     defaultValue,
+    'data-cy': dataCy,
   }: {
     confirmButton?: ButtonOptions<true>;
     modalType?: ModalType;
     message?: ReactNode;
     defaultValue?: boolean;
-  } = {}
+  } & AutomationTestingProps = {
+    'data-cy': 'switch-prompt',
+  }
 ) {
   return openModal(SwitchPrompt, {
     confirmButton,
@@ -70,5 +77,6 @@ export async function openSwitchPrompt(
     modalType,
     message,
     defaultValue,
+    'data-cy': dataCy,
   });
 }

app/react/components/modals/types.ts

@@ -8,6 +8,7 @@ export interface ButtonOptions<TValue = undefined> {
   color?: ComponentProps<typeof Button>['color'];
   value?: TValue;
   timeout?: number;
+  dataCy: string;
 }
 
 export interface ButtonsOptions<T> {

app/react/components/modals/utils.ts

@@ -7,15 +7,20 @@ import { ButtonOptions } from './types';
 export function buildConfirmButton(
   label = 'Confirm',
   color: ComponentProps<typeof Button>['color'] = 'primary',
-  timeout = 0
+  timeout = 0,
+  dataCy = 'modal-confirm-button'
 ): ButtonOptions<true> {
-  return { label, color, value: true, timeout };
+  return { label, color, value: true, timeout, dataCy };
 }
 
-export function buildCancelButton(label = 'Cancel'): ButtonOptions<false> {
+export function buildCancelButton(
+  label = 'Cancel',
+  dataCy = 'modal-cancel-button'
+): ButtonOptions<false> {
   return {
     label,
     color: 'default',
     value: false,
+    dataCy,
   };
 }