import React, { useState, useEffect, useContext } from 'react';
import { Container, Typography, Box, Button, Divider, Paper, Alert, Grid } from '@mui/material';
import { PropertiesAPI, UserAPI } from 'types';
import AddPropertyDialog from 'components/sections/dashboard/Home/Profile/AddPropertyDialog';
import PropertyCard from 'components/sections/dashboard/Home/Profile/PropertyCard.';
import ProfileCard from 'components/sections/dashboard/Home/Profile/ProfileCard';
import { AccountContext } from 'contexts/AccountContext';
import { AxiosResponse } from 'axios';
import { axiosInstance } from '../../axiosApi';
import PropertyOwnerProfile from 'components/sections/dashboard/Home/Profile/PropertyOwnerProfile';
import VendorProfile from 'components/sections/dashboard/Home/Profile/VendorProfile';
import DashboardLoading from 'components/sections/dashboard/Home/Dashboard/DashboardLoading';
import DashboardErrorPage from 'components/sections/dashboard/Home/Dashboard/DashboardErrorPage';
import AttorneyProfile from 'components/sections/dashboard/Home/Profile/AttorneyProfile';

export type ProfileProps = {
  account: UserAPI;
};

const ProfilePage: React.FC = () => {
  const { account, accountLoading } = useContext(AccountContext);

  if (accountLoading) {
    return <DashboardLoading />;
  }

  if (!account) {
    return <DashboardErrorPage />;
  }
  if (account.user_type === 'property_owner') {
    return <PropertyOwnerProfile account={account} />;
  } else if (account.user_type === 'vendor') {
    return <VendorProfile account={account} />;
  } else if (account.user_type === 'attorney') {
    return <AttorneyProfile account={account} />;
  } else if (account.user_type === 'real_estate_agent') {
    return <>TODO</>;
    //return (<VendorProfile account={account} />)
  }
};

export default ProfilePage;
