import React, {useState} from "react"
import useAuthUser from "../hooks/AuthUser"
import YearRainfall from "../components/rainfall/YearRainfaill"
import PageLayout from "../components/PageLayout"
import AddRainfall from "../components/rainfall/AddRainfall"

const Home = () => {

    const {authUser} = useAuthUser()
    const [loadedAt, reload] = useState(new Date)

    return <div>
        {authUser
            ? <PageLayout>
                <div className="flex flex-col gap-2">
                    <YearRainfall loadedAt={loadedAt} />

                    <AddRainfall reload={reload}/>
                </div>
            </PageLayout>
            : <div className="px-5 pt-10">
                <h1 className="text-lg font-bold">Application pour enregistrer sa pluviométrie</h1>
                <p className="mt-5">Un compte est nécessaire mais les inscriptions ne sont pas ouvertes.</p>
            </div>
        }
    </div>
}

export default Home