import { Grid } from '@mui/material';
import { useQuery } from '@tanstack/react-query';
import CircularLoader from 'components/CircularLoader';
import Loader from 'components/Loader';
import MainCard from 'components/MainCard';
import { getusers } from 'pages/api/api';

const ViewProfile = () => {
  const {
    data: userdata,
    isLoading,
    isError,
    error
  } = useQuery({
    queryKey: ['getuser'],
    queryFn: getusers
  });
  return (
    <>
      {isLoading && (
        <>
          <Loader />
          <CircularLoader />
        </>
      )}
      <MainCard>
        <Grid container spacing={3}>
          <Grid item xs={12} sm={6} md={4}>
            {userdata?.firstname}
          </Grid>
          <Grid item xs={12} sm={6} md={4}>
            {' '}
          </Grid>
          <Grid item xs={12} sm={6} md={4}>
            {' '}
          </Grid>
        </Grid>
      </MainCard>
    </>
  );
};

export default ViewProfile;
