Add desktop only setup of custom keymaps

Fix cloud and desktop app global search shortcut - Add desktop app changeable shortcut in menu - Fix cloud having multiple global search shortucts bound
BoostIO · Dec 5, 2021 · 574db47 · 574db47
1 parent 7f3a4bc
commit 574db47
Show file tree

Hide file tree

Showing 7 changed files with 63 additions and 45 deletions.
diff --git a/src/cloud/components/Application.tsx b/src/cloud/components/Application.tsx
@@ -142,9 +142,7 @@ const Application = ({
 
  useEffect(() => {
  const handler = () => {
- if (usingElectron) {
- setShowFuzzyNavigation((prev) => !prev)
- }
+ setShowFuzzyNavigation((prev) => !prev)
  }
  searchEventEmitter.listen(handler)
  return () => {

diff --git a/src/cloud/components/molecules/KeymapItemSection.tsx b/src/cloud/components/molecules/KeymapItemSection.tsx
@@ -14,6 +14,7 @@ import styled from '../../../design/lib/styled'
 import { inputStyle } from '../../../design/lib/styled/styleFunctions'
 import cc from 'classcat'
 import { useToast } from '../../../design/lib/stores/toast'
+import { useElectron } from '../../lib/stores/electron'
 
 const invalidShortcutInputs = [' ']
 const rejectedShortcutInputs = [' ', 'control', 'alt', 'shift', 'meta']
@@ -28,6 +29,7 @@ interface KeymapItemSectionProps {
  ) => Promise<void>
  removeKeymap: (key: string) => void
  description: string
+ desktopOnly: boolean
 }
 
 const KeymapItemSection = ({
@@ -36,6 +38,7 @@ const KeymapItemSection = ({
  updateKeymap,
  removeKeymap,
  description,
+ desktopOnly,
 }: KeymapItemSectionProps) => {
  const [inputError, setInputError] = useState<boolean>(false)
  const [shortcutInputValue, setShortcutInputValue] = useState<string>('')
@@ -53,6 +56,7 @@ const KeymapItemSection = ({
  const shortcutInputRef = useRef<HTMLInputElement>(null)
 
  const { pushMessage } = useToast()
+ const { usingElectron } = useElectron()
 
  const fetchInputShortcuts: KeyboardEventHandler<HTMLInputElement> = (
  event
@@ -137,6 +141,9 @@ const KeymapItemSection = ({
  ? getGenericShortcutString(currentKeymapItem)
  : ''
  }, [currentKeymapItem, currentShortcut])
+
+ const isEditableKeymap = !desktopOnly || (desktopOnly && usingElectron)
+
  return (
  <KeymapItemSectionContainer>
  <div>{description}</div>
@@ -155,18 +162,22 @@ const KeymapItemSection = ({
  onKeyDown={fetchInputShortcuts}
  />
  )}
- <Button variant={'primary'} onClick={toggleChangingShortcut}>
- {currentShortcut == null
- ? 'Assign'
- : changingShortcut
- ? 'Apply'
- : 'Change'}
- </Button>
- {changingShortcut && (
+ {!isEditableKeymap ? (
+ <div>Desktop App Only</div>
+ ) : (
+ <Button variant={'primary'} onClick={toggleChangingShortcut}>
+ {currentShortcut == null
+ ? 'Assign'
+ : changingShortcut
+ ? 'Apply'
+ : 'Change'}
+ </Button>
+ )}
+ {isEditableKeymap && changingShortcut && (
  <Button onClick={handleCancelKeymapChange}>Cancel</Button>
  )}
 
- {currentShortcut != null && !changingShortcut && (
+ {isEditableKeymap && currentShortcut != null && !changingShortcut && (
  <Button onClick={handleRemoveKeymap}>Un-assign</Button>
  )}
  </KeymapItemInputSection>

diff --git a/src/cloud/components/settings/KeymapTab.tsx b/src/cloud/components/settings/KeymapTab.tsx
@@ -57,6 +57,11 @@ const KeymapTab = () => {
  description={keymapEntry[1].description}
  updateKeymap={updateKeymap}
  removeKeymap={removeKeymap}
+ desktopOnly={
+ keymapEntry[1].desktopOnly == null
+ ? false
+ : keymapEntry[1].desktopOnly
+ }
  />
  )
  })}

diff --git a/src/cloud/lib/stores/electron.ts b/src/cloud/lib/stores/electron.ts
@@ -272,10 +272,6 @@ const useElectronStore = (): ElectronStore => {
  event.preventDefault()
  toggleSettingsEventEmitter.dispatch()
  return
- case 'p':
- event.preventDefault()
- searchEventEmitter.dispatch()
- return
  case '0':
  if (event.shiftKey) {
  event.preventDefault()

diff --git a/src/electron/index.ts b/src/electron/index.ts
@@ -20,12 +20,12 @@ let ready = false
 const singleInstance = app.requestSingleInstanceLock()
 
 export const keymap = new Map<string, string>([
- ['toggleGlobalSearch', 'CmdOrCtrl + P'],
+ ['toggleGlobalSearch', 'CmdOrCtrl + p'],
  ['toggleSplitEditMode', 'CmdOrCtrl + \\'],
- ['togglePreviewMode', 'CmdOrCtrl + E'],
- ['editorSaveAs', 'CmdOrCtrl + S'],
- ['createNewDoc', 'CmdOrCtrl + N'],
- ['createNewFolder', 'CmdOrCtrl + Shift + N'],
+ ['togglePreviewMode', 'CmdOrCtrl + e'],
+ ['editorSaveAs', 'CmdOrCtrl + s'],
+ ['createNewDoc', 'CmdOrCtrl + n'],
+ // ['createNewFolder', 'CmdOrCtrl + Shift + N'],
  ['resetZoom', 'CmdOrCtrl + 0'],
  ['zoomOut', 'CmdOrCtrl + -'],
  ['zoomIn', 'CmdOrCtrl + Plus'],

diff --git a/src/electron/menu.ts b/src/electron/menu.ts
@@ -22,7 +22,7 @@ export function getTemplateFromKeymap(
  }
 
  menu.push(getFileMenu(keymap))
- menu.push(getEditMenu())
+ menu.push(getEditMenu(keymap))
  menu.push(getViewMenu(keymap))
  menu.push(getWindowMenu())
  menu.push(getCommunityMenu())
@@ -154,7 +154,7 @@ function getFileMenu(keymap: Map<string, string>): MenuItemConstructorOptions {
  }
 }
 
-function getEditMenu(): MenuItemConstructorOptions {
+function getEditMenu(keymap: Map<string, string>): MenuItemConstructorOptions {
  const submenuItems: MenuItemConstructorOptions[] = [
  { role: 'undo' },
  { role: 'redo' },
@@ -167,7 +167,7 @@ function getEditMenu(): MenuItemConstructorOptions {
  type: 'normal',
  label: 'Search',
  click: createEmitIpcMenuItemHandler('search'),
- accelerator: mac ? 'Cmd + P' : 'Ctrl + P',
+ accelerator: keymap.get('toggleGlobalSearch'),
  },
  { type: 'separator' },
  { role: 'delete' },

diff --git a/src/lib/keymap.ts b/src/lib/keymap.ts
@@ -18,14 +18,15 @@ export interface KeymapItem {
  shortcutSecondStroke?: KeymapItemEditableProps
  description: string
  isMenuType?: boolean
+ desktopOnly?: boolean
 }
 
 export const defaultKeymap = new Map<string, KeymapItem>([
  [
  'createNewDoc',
  {
  shortcutMainStroke: {
- key: 'N',
+ key: 'n',
  keycode: 78,
  modifiers:
  osName === 'macos'
@@ -36,26 +37,29 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  },
  description: 'Create new document',
  isMenuType: true,
+ desktopOnly: true,
  },
  ],
- [
- 'createNewFolder',
- {
- shortcutMainStroke: {
- key: 'N',
- keycode: 78,
- modifiers:
- osName === 'macos'
- ? { meta: true, shift: true }
- : {
- ctrl: true,
- shift: true,
- },
- },
- description: 'Create new folder',
- isMenuType: true,
- },
- ],
+ // todo: [komediruzecki-2021-12-5] Enable when available
+ // [
+ // 'createNewFolder',
+ // {
+ // shortcutMainStroke: {
+ // key: 'N',
+ // keycode: 78,
+ // modifiers:
+ // osName === 'macos'
+ // ? { meta: true, shift: true }
+ // : {
+ // ctrl: true,
+ // shift: true,
+ // },
+ // },
+ // description: 'Create new folder',
+ // isMenuType: true,
+ // desktopOnly: true,
+ // },
+ // ],
  [
  'toggleSideNav',
  {
@@ -77,7 +81,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  'toggleGlobalSearch',
  {
  shortcutMainStroke: {
- key: 'P',
+ key: 'p',
  keycode: 80,
  modifiers:
  osName === 'macos'
@@ -105,6 +109,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  },
  },
  description: 'Toggle in-page search modal dialog',
+ desktopOnly: true,
  },
  ],
  // todo: [komediruzecki-2021-11-7] enable once implemented
@@ -163,7 +168,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  'togglePreviewMode',
  {
  shortcutMainStroke: {
- key: 'E',
+ key: 'e',
  keycode: 69,
  modifiers:
  osName === 'macos'
@@ -208,6 +213,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  },
  description: 'Zoom in window',
  isMenuType: true,
+ desktopOnly: true,
  },
  ],
  [
@@ -225,6 +231,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  },
  description: 'Zoom out window',
  isMenuType: true,
+ desktopOnly: true,
  },
  ],
  [
@@ -242,6 +249,7 @@ export const defaultKeymap = new Map<string, KeymapItem>([
  },
  description: 'Reset window zoom',
  isMenuType: true,
+ desktopOnly: true,
  },
  ],
  // todo: [komediruzecki-2021-11-7] Enable once implemented