From 04cee350cb62fb1962ca167b258a09fc0c83293b Mon Sep 17 00:00:00 2001
From: Vinicius Souza <dev@viniciussouza.me>
Date: Fri, 1 Nov 2024 11:40:47 -0300
Subject: [PATCH] feat: show actual exercise data on card

---
 src/components/ExerciseCard.tsx | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/ExerciseCard.tsx b/src/components/ExerciseCard.tsx
index 10f2983..6d61334 100644
--- a/src/components/ExerciseCard.tsx
+++ b/src/components/ExerciseCard.tsx
@@ -2,14 +2,20 @@ import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
 import { Heading, HStack, Icon, Image, Text, VStack } from '@gluestack-ui/themed';
 import { ChevronRight } from 'lucide-react-native';
 
-type Props = TouchableOpacityProps;
+import { api } from '@services/api';
 
-export function ExerciseCard({ ...others }: Props) {
+import { ExerciseDTO } from '@dtos/ExerciseDTO';
+
+type Props = TouchableOpacityProps & {
+  data: ExerciseDTO;
+};
+
+export function ExerciseCard({ data, ...others }: Props) {
   return (
     <TouchableOpacity {...others}>
       <HStack bg="$gray500" alignItems="center" p="$2" pr="$4" rounded="$md" mb="$3">
         <Image
-          source={{ uri: 'https://i.pravatar.cc/200' }}
+          source={{ uri: `${api.defaults.baseURL}/exercise/thumb/${data.thumb}` }}
           alt="imagem do exercício"
           h="$16"
           w="$16"
@@ -20,11 +26,11 @@ export function ExerciseCard({ ...others }: Props) {
 
         <VStack flex={1}>
           <Heading color="white" fontSize="$lg">
-            Puxada Frontal
+            {data.name}
           </Heading>
 
           <Text fontSize="$sm" color="$gray200" mt="$1" numberOfLines={2}>
-            3 séries de 12 repetições with a really big line
+            {data.series} séries de {data.repetitions} repetições
           </Text>
         </VStack>