custom error shortcuts

packages/web/src/modals/CommandModal.svelte

@@ -0,0 +1,49 @@
+<script lang="ts">
+  import _ from 'lodash';
+
+  import FormStyledButton from '../elements/FormStyledButton.svelte';
+
+  import FormProvider from '../forms/FormProvider.svelte';
+  import FormSubmit from '../forms/FormSubmit.svelte';
+  import FormTextField from '../forms/FormTextField.svelte';
+  import { customKeyboardShortcuts } from '../stores';
+  import ModalBase from './ModalBase.svelte';
+  import { closeCurrentModal } from './modalTools';
+
+  export let command;
+</script>
+
+<FormProvider initialValues={command}>
+  <ModalBase {...$$restProps}>
+    <svelte:fragment slot="header">Configure commmand</svelte:fragment>
+
+    <FormTextField label="Category" name="category" disabled />
+    <FormTextField label="Name" name="name" disabled />
+    <FormTextField label="Keyboard shortcut" name="keyText" />
+
+    <svelte:fragment slot="footer">
+      <FormSubmit
+        value="OK"
+        on:click={e => {
+          closeCurrentModal();
+          customKeyboardShortcuts.update(list => ({
+            ...list,
+            [command.id]: {
+              keyText: e.detail.keyText,
+              customKeyboardShortcut: true,
+            },
+          }));
+        }}
+      />
+      <FormStyledButton
+        type="button"
+        value="Reset"
+        on:click={() => {
+          closeCurrentModal();
+          customKeyboardShortcuts.update(list => _.omit(list, [command.id]));
+        }}
+      />
+      <FormStyledButton type="button" value="Close" on:click={closeCurrentModal} />
+    </svelte:fragment>
+  </ModalBase>
+</FormProvider>

packages/web/src/modals/DropDownMenu.svelte

@@ -48,7 +48,7 @@
   import clickOutside from '../utility/clickOutside';
   import { createEventDispatcher } from 'svelte';
   import { onMount } from 'svelte';
-  import { commands } from '../stores';
+  import { commands, commandsCustomized } from '../stores';
   import { extractMenuItems } from '../utility/contextMenu';
 
   export let items;
@@ -70,7 +70,7 @@
   });
 
   $: extracted = extractMenuItems(items);
-  $: compacted = _.compact(extracted.map(x => mapItem(x, $commands)));
+  $: compacted = _.compact(extracted.map(x => mapItem(x, $commandsCustomized)));
   $: filtered = compacted.filter(x => !x.disabled || !x.hideDisabled);
 </script>