import { Modal, Button } from "react-bootstrap";
import { Suggestion } from "../../../../types";

type Props = {
  suggestion?: Suggestion;
  onClose: () => void;
};

/** Modální dialog zobrazující celý detail návrhu na vylepšení. */
export default function SuggestionDetailModal({ suggestion, onClose }: Readonly<Props>) {
  return (
    <Modal show={!!suggestion} onHide={onClose} size="lg">
      <Modal.Header closeButton>
        <Modal.Title><h2>{suggestion?.title}</h2></Modal.Title>
      </Modal.Header>
      <Modal.Body>
        <p className="text-muted mb-3">
          Navrhovatel: <strong>{suggestion?.author}</strong> · Hlasy: <strong>{suggestion?.voteScore}</strong>
          {suggestion?.resolved && <> · <strong>Vyřešeno</strong></>}
        </p>
        <p style={{ whiteSpace: "pre-wrap" }}>{suggestion?.description}</p>
      </Modal.Body>
      <Modal.Footer>
        <Button variant="secondary" onClick={onClose}>
          Zavřít
        </Button>
      </Modal.Footer>
    </Modal>
  );
}