You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Mobile/app/(tabs)/(home)/HomeScreen.tsx

68 lines
2.3 KiB

import { ExerciceDTO } from "@/api/service/dto/dto.training";
import { CatalogServiceRef } from "@/api/service/service.ref";
import ActivitiesComponent from "@/components/ActivitiesComponent";
import CalendarComponent from "@/components/CalendarComponent";
import WelcomeComponent from "@/components/WelcomeComponent";
import WorkoutCardComponent from "@/components/WorkoutCardComponent";
import Screen from "@/components/ui/Screen";
import React, { useEffect, useState } from "react";
import { ScrollView, Text, View } from "react-native";
export default function HomeScreen() {
const [exercices, setExercices] = useState<ExerciceDTO[]>([]);
const exerciceService = CatalogServiceRef;
const getRandomNumber = (min: number, max: number) => {
return Math.floor(Math.random() * (max - min + 1)) + min;
};
useEffect(() => {
const fetchData = async () => {
try {
const data = await exerciceService.getAllExercices();
setExercices(data);
} catch (err: any) {}
};
fetchData();
}, []);
return (
<ScrollView className="h-full ">
<Screen>
<View className="h-1/6 justify-center">
<WelcomeComponent />
</View>
<View className="h-1/6 mt-2">
<View className="flex-row justify-between items-center mb-4">
<Text className="text-lg font-bold text-black">
Fitness Metrics
</Text>
<Text className="text-orange-500 font-semibold">See All</Text>
</View>
<CalendarComponent />
</View>
<View className="h-1/5 mt-8">
<View className="flex-row justify-between items-center mb-4">
<Text className="text-lg font-bold text-black">Workout</Text>
<Text className="text-orange-500 font-semibold">See All</Text>
</View>
<WorkoutCardComponent
exercise={exercices[getRandomNumber(0, exercices.length - 1)]}
background="bg-black"
/>
</View>
<View className="h-1/5 mt-8">
<View className="flex-row justify-between items-center mb-4 mt-6 ">
<Text className="text-lg font-bold text-black">Activities</Text>
<Text className="text-orange-500 font-semibold">See All</Text>
</View>
<ActivitiesComponent />
</View>
</Screen>
</ScrollView>
);
}