From 70f975c390ca3dd1bfc31562089306bb920b2ab1 Mon Sep 17 00:00:00 2001
From: wklos-iohk <wojciech.klos@iohk.io>
Date: Mon, 12 May 2025 15:41:06 +0200
Subject: [PATCH] feat: add test ids for flow card profile component

---
 .../flow-card/flow-card-profile.component.tsx | 23 ++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/design-system/flow-card/flow-card-profile.component.tsx b/src/design-system/flow-card/flow-card-profile.component.tsx
index af8f922..d27fdba 100644
--- a/src/design-system/flow-card/flow-card-profile.component.tsx
+++ b/src/design-system/flow-card/flow-card-profile.component.tsx
@@ -14,6 +14,7 @@ interface Props {
   icon?: ReactNode;
   name: string;
   description?: string;
+  testId?: string;
 }
 
 export const Profile = ({
@@ -21,6 +22,7 @@ export const Profile = ({
   icon,
   name,
   description,
+  testId,
 }: Readonly<Props>): JSX.Element => {
   const renderProfileImage = () => {
     if (typeof icon !== 'undefined') {
@@ -34,18 +36,33 @@ export const Profile = ({
     <div className={cx.container}>
       <Grid columns="$fitContent" gutters="$0">
         <Cell>
-          <Flex className={cx.image} alignItems="center" h="$fill">
+          <Flex
+            className={cx.image}
+            alignItems="center"
+            h="$fill"
+            data-testid={testId ? `${testId}-image` : 'profile-image'}
+          >
             {renderProfileImage()}
           </Flex>
         </Cell>
         <Cell>
           <Flex justifyContent="center" flexDirection="column" h="$fill">
-            <Text.Body.Large color="primary" weight="$semibold">
+            <Text.Body.Large
+              color="primary"
+              weight="$semibold"
+              data-testid={testId ? `${testId}-name` : 'profile-name'}
+            >
               {name}
             </Text.Body.Large>
             {description === undefined ? undefined : (
               <Box>
-                <Text.Body.Normal color="secondary" weight="$semibold">
+                <Text.Body.Normal
+                  color="secondary"
+                  weight="$semibold"
+                  data-testid={
+                    testId ? `${testId}-description` : 'profile-description'
+                  }
+                >
                   {description}
                 </Text.Body.Normal>
               </Box>