extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2024-11-25 01:14:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(#1222): trigger modal's handleConfirm on ENTER key down (#1223)

Browse Source 
* feat(#1222): trigger modal's handleConfirm on ENTER key down

* Update index.js

---------

Co-authored-by: Anoop M D <anoop.md1421@gmail.com>
This commit is contained in:
juprem 2024-09-15 22:05:44 +02:00 committed by GitHub
parent 19501812fc
commit 4419634db7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/bruno-app/src/components/Modal/index.js
View File

@ -2,6 +2,9 @@ import React, { useEffect, useState, useRef } from 'react';
import StyledWrapper from './StyledWrapper'; import StyledWrapper from './StyledWrapper';
import useFocusTrap from 'hooks/useFocusTrap'; import useFocusTrap from 'hooks/useFocusTrap';
const ESC_KEY_CODE = 27;
const ENTER_KEY_CODE = 13;
const ModalHeader = ({ title, handleCancel, customHeader, hideClose }) => ( const ModalHeader = ({ title, handleCancel, customHeader, hideClose }) => (
<div className="bruno-modal-header"> <div className="bruno-modal-header">
{customHeader ? customHeader : <>{title ? <div className="bruno-modal-header-title">{title}</div> : null}</>} {customHeader ? customHeader : <>{title ? <div className="bruno-modal-header-title">{title}</div> : null}</>}
@ -72,10 +75,17 @@ const Modal = ({
}) => { }) => {
const modalRef = useRef(null); const modalRef = useRef(null);
const [isClosing, setIsClosing] = useState(false); const [isClosing, setIsClosing] = useState(false);
const escFunction = (event) => {
const escKeyCode = 27; const handleKeydown = ({ keyCode }) => {
if (event.keyCode === escKeyCode) { switch (keyCode) {
closeModal({ type: 'esc' }); case ESC_KEY_CODE: {
return closeModal({ type: 'esc' });
}
case ENTER_KEY_CODE: {
if(handleConfirm) {
return handleConfirm();
}
}
} }
}; };
@ -88,9 +98,9 @@ const Modal = ({
useEffect(() => { useEffect(() => {
if (disableEscapeKey) return; if (disableEscapeKey) return;
document.addEventListener('keydown', escFunction, false); document.addEventListener('keydown', handleKeydown, false);
return () => { return () => {
document.removeEventListener('keydown', escFunction, false); document.removeEventListener('keydown', handleKeydown);
}; };
}, [disableEscapeKey, document]); }, [disableEscapeKey, document]);