import {SafeAreaView, ScrollView, Text, View} from "react-native";
import React from "react";
import WorkoutCardComponent from "@/components/WorkoutCardComponent";
import Screen from "@/components/ui/Screen";
import CalendarComponent from "@/components/CalendarComponent";
import WelcomeComponent from "@/components/WelcomeComponent";
import ActivitiesComponent from "@/components/ActivitiesComponent";
import {Workout} from "@/model/Workout";


export default function HomeScreen() {
    const exercise = new Workout("Développé couché",  25,"8 Series Workout", 412, "assets/images/Sigma-2.png","Intense" );

    return (
            <ScrollView>
                <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/4 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={exercise} 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>
    );
}