Replace keyboard input handling.

package.json

@@ -61,6 +61,7 @@
     "react-dom": "^17.0.2",
     "react-final-form": "^6.5.7",
     "react-final-form-listeners": "^1.0.3",
+    "react-hotkeys-hook": "^3.4.4",
     "react-media-hook": "^0.4.9",
     "react-papaparse": "^3.18.2",
     "react-redux": "^7.2.5",

src/components/AppBreadcrumb.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import { useLocation } from 'react-router-dom'
 
-import routes from '../routes'
+import routes from 'src/routes'
 
 import { CBreadcrumb, CBreadcrumbItem } from '@coreui/react'
 

src/components/AppHeader.js

@@ -11,11 +11,11 @@ import {
 } from '@coreui/react'
 import { faBars } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { AppBreadcrumb } from './index'
+import AppBreadcrumb from 'src/components/AppBreadcrumb'
 import AppHeaderDropdown from 'src/components/header/AppHeaderDropdown'
 import AppHeaderSearch from 'src/components/header/AppHeaderSearch'
 import cyberdrainlogo from 'src/assets/images/CIPP.png'
-import { toggleSidebarShow } from '../store/features/app'
+import { toggleSidebarShow } from 'src/store/features/app'
 
 const AppHeader = () => {
   const dispatch = useDispatch()

src/components/AppSidebar.js

@@ -2,12 +2,12 @@ import React from 'react'
 import { useSelector, useDispatch } from 'react-redux'
 import { CSidebar, CSidebarBrand, CSidebarNav } from '@coreui/react'
 import { CImage } from '@coreui/react'
-import { AppSidebarNav } from './AppSidebarNav'
+import { AppSidebarNav } from 'src/components/AppSidebarNav'
 import cyberdrainlogo from 'src/assets/images/CIPP.png'
 import SimpleBar from 'simplebar-react'
 import 'simplebar/dist/simplebar.min.css'
-import navigation from '../_nav'
-import { setSidebarVisible } from '../store/features/app'
+import navigation from 'src/_nav'
+import { setSidebarVisible } from 'src/store/features/app'
 
 const AppSidebar = () => {
   const dispatch = useDispatch()

src/components/CippPage.js

@@ -1,12 +1,12 @@
 import React, { useEffect } from 'react'
 import PropTypes from 'prop-types'
-import TenantSelector from './cipp/TenantSelector'
+import TenantSelector from 'src/components/cipp/TenantSelector'
 import { CAlert, CCard, CCardBody, CCardHeader } from '@coreui/react'
-import CippDatatable from './cipp/CippDatatable'
+import CippDatatable from 'src/components/cipp/CippDatatable'
 import { useDispatch, useSelector } from 'react-redux'
 import { useSearchParams } from 'react-router-dom'
-import { setCurrentTenant } from '../store/features/app'
-import { useListTenantsQuery } from '../store/api/tenants'
+import { setCurrentTenant } from 'src/store/features/app'
+import { useListTenantsQuery } from 'src/store/api/tenants'
 
 export function CippPage({ tenantSelector = true, title, children, titleButton = null }) {
   const { data: tenants = [], isSuccess } = useListTenantsQuery()