From a2647f377c0a2d56d739db2e20f2fb745154ae9b Mon Sep 17 00:00:00 2001
From: Lukasz Jagiela <Lukasz.Jagiela@iohk.io>
Date: Tue, 24 Sep 2024 13:55:35 +0200
Subject: [PATCH] chore: add data-testid to toggle-switch component

---
 src/design-system/box/box.component.tsx                    | 2 +-
 .../toggle-switch/toggle-switch.component.tsx              | 7 +++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/design-system/box/box.component.tsx b/src/design-system/box/box.component.tsx
index 2377060..ac55e18 100644
--- a/src/design-system/box/box.component.tsx
+++ b/src/design-system/box/box.component.tsx
@@ -51,7 +51,7 @@ export const Box = forwardRef<HTMLDivElement | null, Readonly<Props>>(
       px,
       py,
       w,
-      testId = 'box',
+      testId,
       ...props
     },
     ref,
diff --git a/src/design-system/toggle-switch/toggle-switch.component.tsx b/src/design-system/toggle-switch/toggle-switch.component.tsx
index 7f26f2b..e016063 100644
--- a/src/design-system/toggle-switch/toggle-switch.component.tsx
+++ b/src/design-system/toggle-switch/toggle-switch.component.tsx
@@ -21,6 +21,7 @@ type Props = Omit<
   defaultChecked?: boolean;
   required?: boolean;
   id?: string;
+  testId?: string;
 };
 
 export const ToggleSwitch = ({
@@ -28,6 +29,7 @@ export const ToggleSwitch = ({
   id,
   icon,
   disabled,
+  testId,
   ...props
 }: Readonly<Props>): JSX.Element => {
   return (
@@ -35,15 +37,16 @@ export const ToggleSwitch = ({
       alignItems="center"
       className={disabled === true ? cx.disabled : undefined}
     >
-      <label className={cx.label} htmlFor={id}>
+      <label className={cx.label} htmlFor={id} data-testid={testId + '-label'}>
         <Text.Body.Normal color="secondary">{label}</Text.Body.Normal>
       </label>
-      {icon !== undefined && <Box className={cx.iconContainer}>{icon}</Box>}
+      {icon !== undefined && <Box className={cx.iconContainer} testId={testId + '-icon'}>{icon}</Box>}
       <Switch.Root
         {...props}
         disabled={disabled}
         className={cx.toogleSwitch}
         id={id}
+        data-testid={testId + '-switch'}
       >
         <Switch.Thumb className={cx.thumb} />
       </Switch.Root>