// src/components/PropertyOwnerProfile/OpenHouseCard.tsx

import React from 'react';
import { Card, CardContent, Typography, Box } from '@mui/material';
import { OpenHouseAPI } from 'types';
import { format } from 'date-fns';

interface OpenHouseCardProps {
  openHouse: OpenHouseAPI;
}

const OpenHouseDialogContent: React.FC<OpenHouseCardProps> = ({ openHouse }) => {
  const startTime = new Date(`${openHouse.start_time}`);
  const endTime = new Date(`${openHouse.end_time}`);

  console.log(endTime);

  return (
    <Card sx={{ mb: 2 }}>
      <CardContent>
        <Typography variant="h6" component="div">
          Open House at Property: {openHouse.property.address_line_1}
        </Typography>
        <Box sx={{ mt: 1 }}>
          <Typography variant="body2" color="textSecondary">
            {openHouse.start_time}
          </Typography>
          <Typography variant="body2" color="textSecondary">
            {openHouse.end_time}
          </Typography>
        </Box>
      </CardContent>
    </Card>
  );
};

export default OpenHouseDialogContent;
