/ src / components / compose-button.jsx
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  }