From a8121145060a99111fb9dd732ad774ca64d4e2a1 Mon Sep 17 00:00:00 2001
From: Bartlomiej Slabiak <bartlomiej.slabiak@iohk.io>
Date: Fri, 16 Aug 2024 14:33:14 +0200
Subject: [PATCH 1/2] feat: add test ids for tokens table list lw-10959

---
 .../assets-table-token-amount.component.tsx          |  4 +++-
 .../assets-table-token-profile.component.tsx         | 12 +++++++++---
 .../profile-picture/image.component.tsx              |  9 ++++++++-
 3 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/design-system/assets-table/assets-table-token-amount.component.tsx b/src/design-system/assets-table/assets-table-token-amount.component.tsx
index 68e152d..cd80de0 100644
--- a/src/design-system/assets-table/assets-table-token-amount.component.tsx
+++ b/src/design-system/assets-table/assets-table-token-amount.component.tsx
@@ -16,7 +16,9 @@ export const TokenAmount = ({
 }: Readonly<Props>): JSX.Element => {
   return (
     <Flex flexDirection="column" alignItems="flex-end" className={cx.container}>
-      <Text.Body.Large weight="$semibold">{amount}</Text.Body.Large>
+      <Text.Body.Large weight="$semibold" data-testid="token-amount">
+        {amount}
+      </Text.Body.Large>
       <Text.Body.Normal color="secondary" weight="$semibold">
         {fiatPrice}
       </Text.Body.Normal>
diff --git a/src/design-system/assets-table/assets-table-token-profile.component.tsx b/src/design-system/assets-table/assets-table-token-profile.component.tsx
index d4631f7..ce3034b 100644
--- a/src/design-system/assets-table/assets-table-token-profile.component.tsx
+++ b/src/design-system/assets-table/assets-table-token-profile.component.tsx
@@ -23,13 +23,19 @@ export const TokenProfile = ({
       <Grid columns="$fitContent" gutters="$0">
         <Cell>
           <Box mr="$24">
-            <Image imageSrc={imageSrc} alt={name} />
+            <Image imageSrc={imageSrc} alt={name} testId="token-icon" />
           </Box>
         </Cell>
         <Cell>
-          <Text.Body.Large weight="$semibold">{name}</Text.Body.Large>
+          <Text.Body.Large weight="$semibold" data-testid="token-name">
+            {name}
+          </Text.Body.Large>
           <Box>
-            <Text.Body.Normal color="secondary" weight="$semibold">
+            <Text.Body.Normal
+              color="secondary"
+              weight="$semibold"
+              data-testid="token-ticker"
+            >
               {description}
             </Text.Body.Normal>
           </Box>
diff --git a/src/design-system/profile-picture/image.component.tsx b/src/design-system/profile-picture/image.component.tsx
index 5896933..0168771 100644
--- a/src/design-system/profile-picture/image.component.tsx
+++ b/src/design-system/profile-picture/image.component.tsx
@@ -12,6 +12,7 @@ interface Props {
   alt?: string;
   delayMs?: number;
   selected?: boolean;
+  testId?: string;
 }
 
 export const Image = ({
@@ -20,13 +21,19 @@ export const Image = ({
   alt,
   delayMs = 600,
   selected,
+  testId = 'image',
 }: Readonly<Props>): JSX.Element => (
   <RadixUIAvatar.Root
     className={classNames(cx.root, cx.container, {
       [cx.selected]: selected,
     })}
   >
-    <RadixUIAvatar.Image className={cx.image} src={imageSrc} alt={alt} />
+    <RadixUIAvatar.Image
+      className={cx.image}
+      src={imageSrc}
+      alt={alt}
+      data-testid={testId}
+    />
     <RadixUIAvatar.Fallback delayMs={delayMs}>
       {fallback}
     </RadixUIAvatar.Fallback>

From 788ef80f1f85d218685eb943a6af8d3aebaaa34d Mon Sep 17 00:00:00 2001
From: Bartlomiej Slabiak <bartlomiej.slabiak@iohk.io>
Date: Fri, 16 Aug 2024 15:05:04 +0200
Subject: [PATCH 2/2] feat: add property testId to TokenProfile

---
 .../assets-table/assets-table-token-profile.component.tsx | 8 +++++---
 src/design-system/profile-picture/image.component.tsx     | 2 +-
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/design-system/assets-table/assets-table-token-profile.component.tsx b/src/design-system/assets-table/assets-table-token-profile.component.tsx
index ce3034b..49351e7 100644
--- a/src/design-system/assets-table/assets-table-token-profile.component.tsx
+++ b/src/design-system/assets-table/assets-table-token-profile.component.tsx
@@ -11,30 +11,32 @@ interface Props {
   imageSrc: string;
   name: string;
   description: string;
+  testId?: string;
 }
 
 export const TokenProfile = ({
   imageSrc,
   name,
   description,
+  testId = 'token-profile',
 }: Readonly<Props>): JSX.Element => {
   return (
     <div className={cx.container}>
       <Grid columns="$fitContent" gutters="$0">
         <Cell>
           <Box mr="$24">
-            <Image imageSrc={imageSrc} alt={name} testId="token-icon" />
+            <Image imageSrc={imageSrc} alt={name} testId={`${testId}-icon`} />
           </Box>
         </Cell>
         <Cell>
-          <Text.Body.Large weight="$semibold" data-testid="token-name">
+          <Text.Body.Large weight="$semibold" data-testid={`${testId}-name`}>
             {name}
           </Text.Body.Large>
           <Box>
             <Text.Body.Normal
               color="secondary"
               weight="$semibold"
-              data-testid="token-ticker"
+              data-testid={`${testId}-ticker`}
             >
               {description}
             </Text.Body.Normal>
diff --git a/src/design-system/profile-picture/image.component.tsx b/src/design-system/profile-picture/image.component.tsx
index 0168771..c02c912 100644
--- a/src/design-system/profile-picture/image.component.tsx
+++ b/src/design-system/profile-picture/image.component.tsx
@@ -21,7 +21,7 @@ export const Image = ({
   alt,
   delayMs = 600,
   selected,
-  testId = 'image',
+  testId = 'profile-picture',
 }: Readonly<Props>): JSX.Element => (
   <RadixUIAvatar.Root
     className={classNames(cx.root, cx.container, {