refactor(react/dialogs): don't render modals unless they are actually shown

This commit is contained in:
Elian Doran 2025-08-10 14:55:41 +03:00
parent f7093c035b
commit 48eebbe2fe
No known key found for this signature in database

View File

@ -116,7 +116,7 @@ export default function Modal({ children, className, size, title, header, footer
return ( return (
<div className={`modal fade mx-auto ${className}`} tabIndex={-1} style={dialogStyle} role="dialog" ref={modalRef}> <div className={`modal fade mx-auto ${className}`} tabIndex={-1} style={dialogStyle} role="dialog" ref={modalRef}>
<div className={`modal-dialog modal-${size} ${scrollable ? "modal-dialog-scrollable" : ""}`} style={documentStyle} role="document"> {show && <div className={`modal-dialog modal-${size} ${scrollable ? "modal-dialog-scrollable" : ""}`} style={documentStyle} role="document">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header"> <div className="modal-header">
{!title || typeof title === "string" ? ( {!title || typeof title === "string" ? (
@ -144,7 +144,7 @@ export default function Modal({ children, className, size, title, header, footer
</ModalInner> </ModalInner>
)} )}
</div> </div>
</div> </div>}
</div> </div>
); );
} }