import DashboardLayout from '@/components/dashboard/dashboard-layout'
import { Stack, Typography} from '@mui/material'
import { useUserContext } from '@/context/UserContext'

const Index = () => {
  const { userData } = useUserContext();
  return (
    <DashboardLayout>
      <Stack
        flexDirection={'column'}
      >
        <Typography variant='h2'>Hi, {userData.firstName?.charAt(0).toUpperCase() + userData.firstName?.slice(1)}</Typography>
        <Typography variant='subtitle1'>Welcome to your dashboard {userData.firstName}</Typography>
        
      </Stack>
    </DashboardLayout>
  )
}

export default Index