github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-22 09:46:30 -05:00
Code Issues Projects Releases Packages Wiki Activity

Add condition to modal

Browse source 
This way we prevent unwanted data loading, invisible updates
and visual artifacts when the modal isn't visible.

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2022-01-06 22:36:28 +01:00
parent 89eac12a38
commit 9500887ee6
1 changed files with 20 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
src/components/common/modals/common-modal.tsx
View file

@ -48,23 +48,25 @@ export const CommonModal: React.FC<CommonModalProps> = ({
}, [title, titleIsI18nKey])
return (
<Modal
{...cypressId(props)}
show={show}
onHide={onHide}
animation={true}
dialogClassName={`text-dark ${additionalClasses ?? ''}`}
size={modalSize}>
<Modal.Header closeButton={!!showCloseButton}>
<Modal.Title>
<ShowIf condition={!!titleIcon}>
<ForkAwesomeIcon icon={titleIcon as IconName} />
&nbsp;
</ShowIf>
{titleElement}
</Modal.Title>
</Modal.Header>
{children}
</Modal>
<ShowIf condition={show}>
<Modal
{...cypressId(props)}
show={show}
onHide={onHide}
animation={true}
dialogClassName={`text-dark ${additionalClasses ?? ''}`}
size={modalSize}>
<Modal.Header closeButton={!!showCloseButton}>
<Modal.Title>
<ShowIf condition={!!titleIcon}>
<ForkAwesomeIcon icon={titleIcon as IconName} />
&nbsp;
</ShowIf>
{titleElement}
</Modal.Title>
</Modal.Header>
{children}
</Modal>
</ShowIf>
)
}