diff --git a/frontend/src/component/admin/apiToken/ConfirmToken/ConfirmToken.tsx b/frontend/src/component/admin/apiToken/ConfirmToken/ConfirmToken.tsx index 109cd95614..333c7f6f0e 100644 --- a/frontend/src/component/admin/apiToken/ConfirmToken/ConfirmToken.tsx +++ b/frontend/src/component/admin/apiToken/ConfirmToken/ConfirmToken.tsx @@ -7,6 +7,7 @@ import { TokenType } from 'interfaces/token'; interface IConfirmUserLink { open: boolean; + setOpen: (status: boolean) => void; closeConfirm: () => void; token: string; type?: string; @@ -14,6 +15,7 @@ interface IConfirmUserLink { export const ConfirmToken = ({ open, + setOpen, closeConfirm, token, type, @@ -21,6 +23,7 @@ export const ConfirmToken = ({ return ( { { + const mockSetOpen = vi.fn(); + render( + + ); + + expect(screen.getByText('New dialogue created')).toBeInTheDocument(); + + const dialogue = screen.getByRole('presentation'); + fireEvent.keyDown(dialogue, { key: 'Escape', code: 'Escape' }); + + expect(mockSetOpen).toHaveBeenCalledWith(false); +}); diff --git a/frontend/src/component/common/Dialogue/Dialogue.tsx b/frontend/src/component/common/Dialogue/Dialogue.tsx index 14c4dea020..e09217e619 100644 --- a/frontend/src/component/common/Dialogue/Dialogue.tsx +++ b/frontend/src/component/common/Dialogue/Dialogue.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { KeyboardEvent } from 'react'; import { Button, Dialog, @@ -45,6 +45,7 @@ interface IDialogue { primaryButtonText?: string; secondaryButtonText?: string; open: boolean; + setOpen?: (status: boolean) => void; onClick?: (e: React.SyntheticEvent) => void; onClose?: (e: React.SyntheticEvent, reason?: string) => void; style?: object; @@ -53,12 +54,13 @@ interface IDialogue { maxWidth?: 'lg' | 'sm' | 'xs' | 'md' | 'xl'; disabledPrimaryButton?: boolean; formId?: string; - permissionButton?: JSX.Element; + permissionButton?: React.JSX.Element; } export const Dialogue: React.FC = ({ children, open, + setOpen, onClick, onClose, title, @@ -78,10 +80,18 @@ export const Dialogue: React.FC = ({ } } : onClick; + + const onKeyDown = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + setOpen?.(false); + } + }; return ( { = ({ }) => ( { if (!muiCloseReason) {