import React from 'react';
import {
  Box,
  Typography,
  Card,
  CardContent,
  Divider,
  Grid,
  List,
  ListItem,
  ListItemText,
} from '@mui/material';

// Reuse the interfaces from the SellerDisclosureDialog for consistency
interface Property {
  id: number;
  address: string;
  city: string;
  state: string;
  zip_code: string;
}

interface SellerDisclosureData {
  propertyId: number;
  general_defects: string;
  roof_condition: string;
  roof_age: number | null;
  known_roof_leaks: boolean;
  plumbing_issues: string;
  electrical_issues: string;
  hvac_condition: string;
  hvac_age: number | null;
  known_lead_paint: boolean;
  known_asbestos: boolean;
  known_radon: boolean;
  past_water_damage: string;
  structural_issues: string;
  neighborhood_nuisances: string;
  property_line_disputes: string;
  appliances_included: string;
}

interface SellerDisclosureDisplayProps {
  disclosureData: SellerDisclosureData;
  property: Property; // The property associated with this disclosure
}

const SellerDisclosureDisplay: React.FC<SellerDisclosureDisplayProps> = ({
  disclosureData,
  property,
}) => {
  console.log(disclosureData);
  if (!disclosureData || !property) {
    return (
      <Box sx={{ p: 3 }}>
        <Typography variant="h6" color="error">
          No disclosure information available to display.
        </Typography>
      </Box>
    );
  }

  // Helper to format boolean values
  const formatBoolean = (value: boolean) => (value ? 'Yes' : 'No');

  const {
    general_defects,
    roof_condition,
    roof_age,
    known_roof_leaks,
    plumbing_issues,
    electrical_issues,
    hvac_condition,
    hvac_age,
    known_lead_paint,
    known_asbestos,
    known_radon,
    past_water_damage,
    structural_issues,
    neighborhood_nuisances,
    property_line_disputes,
    appliances_included,
  } = disclosureData;

  return (
    <Card elevation={3} sx={{ my: 4, borderRadius: 2 }}>
      <CardContent>
        <Typography variant="h5" component="div" gutterBottom sx={{ fontWeight: 'bold' }}>
          Seller's Property Disclosure
        </Typography>
        <Typography variant="subtitle1" color="text.secondary" sx={{ mb: 2 }}>
          For Property: {property.address}, {property.city}, {property.state} {property.zip_code}
        </Typography>

        <Divider sx={{ my: 2 }} />

        {/* General Information */}
        <Box sx={{ mb: 3 }}>
          <Typography variant="h6" gutterBottom>
            General Information
          </Typography>
          <List dense>
            <ListItem>
              <ListItemText
                primary="General Known Defects/Issues"
                secondary={general_defects || 'None disclosed'}
              />
            </ListItem>
            <ListItem>
              <ListItemText
                primary="Appliances Included in Sale"
                secondary={appliances_included || 'None listed'}
              />
            </ListItem>
          </List>
        </Box>

        <Divider sx={{ my: 2 }} />

        {/* Property Systems */}
        <Box sx={{ mb: 3 }}>
          <Typography variant="h6" gutterBottom>
            Property Systems
          </Typography>
          <Grid container spacing={2}>
            <Grid size={{ xs: 12, sm: 6 }}>
              <List dense>
                <ListItem>
                  <ListItemText
                    primary="Roof Condition"
                    secondary={roof_condition || 'Not disclosed'}
                  />
                </ListItem>
                <ListItem>
                  <ListItemText
                    primary="Approximate Roof Age"
                    secondary={roof_age ? `${roof_age} years` : 'Not disclosed'}
                  />
                </ListItem>
                <ListItem>
                  <ListItemText
                    primary="Known Roof Leaks"
                    secondary={formatBoolean(known_roof_leaks)}
                  />
                </ListItem>
              </List>
            </Grid>
            <Grid size={{ xs: 12, sm: 6 }}>
              <List dense>
                <ListItem>
                  <ListItemText
                    primary="Plumbing System Issues"
                    secondary={plumbing_issues || 'None disclosed'}
                  />
                </ListItem>
                <ListItem>
                  <ListItemText
                    primary="Electrical System Issues"
                    secondary={electrical_issues || 'None disclosed'}
                  />
                </ListItem>
                <ListItem>
                  <ListItemText
                    primary="HVAC Condition"
                    secondary={hvac_condition || 'Not disclosed'}
                  />
                </ListItem>
                <ListItem>
                  <ListItemText
                    primary="Approximate HVAC Age"
                    secondary={hvac_age ? `${hvac_age} years` : 'Not disclosed'}
                  />
                </ListItem>
              </List>
            </Grid>
          </Grid>
        </Box>

        <Divider sx={{ my: 2 }} />

        {/* Environmental & Other Issues */}
        <Box>
          <Typography variant="h6" gutterBottom>
            Environmental & Other Issues
          </Typography>
          <List dense>
            <ListItem>
              <ListItemText
                primary="Known Lead-Based Paint"
                secondary={formatBoolean(known_lead_paint)}
              />
            </ListItem>
            <ListItem>
              <ListItemText primary="Known Asbestos" secondary={formatBoolean(known_asbestos)} />
            </ListItem>
            <ListItem>
              <ListItemText primary="Known Radon" secondary={formatBoolean(known_radon)} />
            </ListItem>
            <ListItem>
              <ListItemText
                primary="Past or Present Water Damage"
                secondary={past_water_damage || 'None disclosed'}
              />
            </ListItem>
            <ListItem>
              <ListItemText
                primary="Structural Issues"
                secondary={structural_issues || 'None disclosed'}
              />
            </ListItem>
            <ListItem>
              <ListItemText
                primary="Neighborhood Nuisances"
                secondary={neighborhood_nuisances || 'None disclosed'}
              />
            </ListItem>
            <ListItem>
              <ListItemText
                primary="Property Line Disputes"
                secondary={property_line_disputes || 'None disclosed'}
              />
            </ListItem>
          </List>
        </Box>
      </CardContent>
    </Card>
  );
};

export default SellerDisclosureDisplay;
