import React from 'react'
import {HeaderBox} from "@/components/HeaderBox";
import TotalBalanceBox from "@/components/TotalBalanceBox";
import {RightSidebar} from "@/components/RightSidebar";

const Home = () => {
    const loggedIn = { firstName: 'Beyonce' , lastName: "Knowles", email: "beyonce@gmail.com" }

    return (
      <section className="home">
            <div className="home-content text-white">
               <header className="home-header">
                   <HeaderBox
                       type="greeting"
                       title="Welcome"
                       user={loggedIn?.firstName || 'Guest'}
                       subtext="Access and manage your accounts the you way."
                   />
                   <TotalBalanceBox
                       accounts={[]}
                       totalBanks={1}
                       totalCurrentBalance={45.55}
                   />
               </header>


                RECENT TRANSACTIONS
            </div>

            <RightSidebar
                user={loggedIn}
                transactions={[]}
                banks = {[{ currentBalance: 123.50 },{ currentBalance: 55.40 }]}
            />
      </section>

    )
}
export default Home