compose-button.jsx
1 import { useHotkeys } from 'react-hotkeys-hook'; 2 3 import openCompose from '../utils/open-compose'; 4 import states from '../utils/states'; 5 6 import Icon from './icon'; 7 8 export default function ComposeButton() { 9 function handleButton(e) { 10 if (e.shiftKey) { 11 const newWin = openCompose(); 12 13 if (!newWin) { 14 alert('Looks like your browser is blocking popups.'); 15 states.showCompose = true; 16 } 17 } else { 18 states.showCompose = true; 19 } 20 } 21 22 useHotkeys('c, shift+c', handleButton, { 23 ignoreEventWhen: (e) => { 24 const hasModal = !!document.querySelector('#modal-container > *'); 25 return hasModal; 26 }, 27 }); 28 29 return ( 30 <button type="button" id="compose-button" onClick={handleButton}> 31 <Icon icon="quill" size="xl" alt="Compose" /> 32 </button> 33 ); 34 }