All files / app/modals/request-diagnostics request-diagnostic-modal.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { AllowDiagnosticsLayout } from '../../components/request-diagnostics.layout';
import { Modal } from '@modals/components/base-modal';
import { ModalHeader } from '@modals/components/modal-header';
import { Box } from '@stacks/ui';
import { grantDiagnosticsPermission, revokeDiagnosticPermission } from '@store/settings';
import React, { FC } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { useDispatch } from 'react-redux';
import { useHistory, useLocation } from 'react-router';
 
export const RequestDiagnosticsModal: FC = () => {
  const history = useHistory();
  const dispatch = useDispatch();
  const location = useLocation();
 
  const goToCurrentUrlOneRouteUpWithoutDiagnosticsModal = () =>
    history.push(location.pathname.replace('/request-diagnostics', ''));
 
  const userAllowDiagnosticAction = () => {
    dispatch(grantDiagnosticsPermission());
    goToCurrentUrlOneRouteUpWithoutDiagnosticsModal();
  };
 
  const userProhibitDiagnosticAction = () => {
    dispatch(revokeDiagnosticPermission());
    goToCurrentUrlOneRouteUpWithoutDiagnosticsModal();
  };
 
  useHotkeys('esc', () => userProhibitDiagnosticAction());
 
  return (
    <Modal handleClose={() => null} minWidth="488px" isOpen>
      <ModalHeader border={0} onSelectClose={() => userProhibitDiagnosticAction()}>
        Help us improve
      </ModalHeader>
      <Box mx="extra-loose" mb="extra-loose">
        <AllowDiagnosticsLayout
          onUserAllowDiagnostics={() => userAllowDiagnosticAction()}
          onUserDenyDiagnosticsPermissions={() => userProhibitDiagnosticAction()}
        />
      </Box>
    </Modal>
  );
};