91 lines
2.2 KiB
JavaScript
91 lines
2.2 KiB
JavaScript
import { useState } from "react";
|
|
import Button from "../../pageElements/Button";
|
|
import Modal from "react-bootstrap/Modal";
|
|
import TextInput from "../../pageElements/TextInput";
|
|
import { ExclamationTriangle } from "react-bootstrap-icons";
|
|
import { db } from "../../firebase";
|
|
|
|
const ConfirmModal = ({
|
|
onCancel,
|
|
onConfirm,
|
|
buttonLabelText,
|
|
modalText,
|
|
isBusy,
|
|
isReport,
|
|
appUserId,
|
|
caseId,
|
|
documentId,
|
|
issueText,
|
|
setIssueText,
|
|
reportDoc,
|
|
titleText,
|
|
isPromoModal,
|
|
cancelButtonText,
|
|
}) => {
|
|
const title = titleText ? titleText : "Confirmation";
|
|
|
|
return (
|
|
<Modal show="true" onHide={onCancel} size="lg">
|
|
<Modal.Header closeButton>
|
|
{isReport ? (
|
|
<Modal.Title>Report an issue</Modal.Title>
|
|
) : (
|
|
<Modal.Title>
|
|
{titleText && !isPromoModal ? (
|
|
<ExclamationTriangle
|
|
style={{
|
|
color: "red",
|
|
marginRight: "8px",
|
|
marginBottom: "6px",
|
|
}}
|
|
/>
|
|
) : (
|
|
<></>
|
|
)}
|
|
{title}
|
|
</Modal.Title>
|
|
)}
|
|
</Modal.Header>
|
|
<Modal.Body>
|
|
<span>{modalText}</span>
|
|
{isReport || isPromoModal ? (
|
|
<div style={{ marginTop: "16px" }}>
|
|
<TextInput
|
|
key={"captionTwo"}
|
|
name={"captionTwo"}
|
|
value={issueText}
|
|
message={"data.captionTwo.message"}
|
|
onChange={(e) => setIssueText(e.target.value)}
|
|
label={
|
|
issueText
|
|
? ""
|
|
: isPromoModal
|
|
? "Enter your promotional code"
|
|
: "Description of issue"
|
|
}
|
|
/>
|
|
</div>
|
|
) : (
|
|
<></>
|
|
)}
|
|
</Modal.Body>
|
|
<Modal.Footer>
|
|
<Button
|
|
disabled={isBusy}
|
|
className="secondary-button"
|
|
onClick={onCancel}
|
|
labelText={cancelButtonText ? cancelButtonText : "Cancel"}
|
|
/>
|
|
<Button
|
|
disabled={isBusy}
|
|
className="primary-button"
|
|
onClick={onConfirm}
|
|
labelText={buttonLabelText}
|
|
/>
|
|
</Modal.Footer>
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default ConfirmModal;
|