/* eslint-disable react-hooks/exhaustive-deps */
"use client";

/* eslint-disable @typescript-eslint/no-explicit-any */
import styles from "./home.module.scss"
import DashboardLayout from "@/layouts/dashboard"
import MemberGreeting from "@/components/members/member-greeting";
import AnalyticsWrapper from "@/components/dashboard/analytics-wrapper"
import AnalyticsSummaryBanner from "@/components/dashboard/analytics-summary";
import Todos from "@/components/dashboard/todos"
import { usePage } from "@inertiajs/react"
import ContactSupport from "@/components/dashboard/contact-support"
import Suggestions from "@/components/dashboard/suggestions"
import UpcomingPrograms from "@/components/dashboard/dash-upcoming-programs"
import { useEffect } from "react";

const Home = () => {
  const { props } = usePage(); // Get all shared Inertia props
 useEffect(() => {
  console.log("Active Branch ID:", props.activeBranchId);
}, []);
  
  return (
    <div className={ styles["home"] }>
      <div className={ styles["home__content"] }>
       <div className={ styles["home__content--greeting"] }>
        <MemberGreeting />
       </div>
        <AnalyticsSummaryBanner path="/dashboard/finance" />
        <Todos />
        <AnalyticsWrapper />
        <UpcomingPrograms />
      </div>

      <div className={ styles["home__right"] }>
        <ContactSupport />
        <Suggestions />
      </div>
    </div>
  )
}

Home.layout = (page: any) => <DashboardLayout title={"Dashboard overview"} children={page} />

export default Home