prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix confirmation modal

Browse source
This commit is contained in:
Jackson Harper 2024-03-08 17:41:49 +08:00
parent e093738dcc
commit 50a7315185
1 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
packages/web/components/patterns/ConfirmationModal.tsx
View file

@ -19,8 +19,18 @@ type ConfirmationModalProps = {
}
export function ConfirmationModal(props: ConfirmationModalProps): JSX.Element {
const safeOnOpenChange = useCallback(
(open: boolean) => {
props.onOpenChange(open)
setTimeout(() => {
document.body.style.removeProperty('pointer-events')
}, 200)
},
[props]
)
return (
<ModalRoot defaultOpen onOpenChange={props.onOpenChange}>
<ModalRoot defaultOpen onOpenChange={safeOnOpenChange}>
<ModalOverlay />
<ModalContent css={{ bg: '$grayBg', maxWidth: '20em', zIndex: '20' }}>
<VStack alignment="center" distribution="center" css={{ p: '15px' }}>
@ -46,11 +56,15 @@ export function ConfirmationModal(props: ConfirmationModalProps): JSX.Element {
</Button>
<Button
style="ctaDarkYellow"
onClick={props.onAccept}
onClick={() => {
props.onAccept()
document.body.style.removeProperty('pointer-events')
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
event.preventDefault()
props.onAccept()
document.body.style.removeProperty('pointer-events')
}
}}
>