Mark duplicate hotkeys

tabby-settings/src/components/multiHotkeyInput.component.ts

@@ -1,6 +1,7 @@
 import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { HotkeyInputModalComponent } from './hotkeyInputModal.component'
+import { Hotkey } from 'tabby-core/src/api/hotkeyProvider'
 
 /** @hidden */
 @Component({
@@ -10,37 +11,41 @@ import { HotkeyInputModalComponent } from './hotkeyInputModal.component'
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MultiHotkeyInputComponent {
-    @Input() model: string[][] = []
-    @Output() modelChange = new EventEmitter()
+    @Input() hotkeys: Hotkey[] = []
+    @Output() hotkeysChange = new EventEmitter()
 
     constructor (
         private ngbModal: NgbModal,
     ) { }
 
     ngOnChanges (): void {
-        if (typeof this.model === 'string') {
-            this.model = [this.model]
-        }
-        this.model = this.model.map(item => typeof item === 'string' ? [item] : item)
+        this.hotkeys = this.hotkeys.map(hotkey => typeof hotkey.strokes === 'string' ? { ...hotkey, strokes: [hotkey.strokes] } : hotkey)
     }
 
-    editItem (item: string[]): void {
-        this.ngbModal.open(HotkeyInputModalComponent).result.then((value: string[]) => {
-            this.model[this.model.findIndex(x => x === item)] = value
-            this.model = this.model.slice()
-            this.modelChange.emit(this.model)
+    editItem (item: Hotkey): void {
+        this.ngbModal.open(HotkeyInputModalComponent).result.then((newStrokes: string[]) => {
+            this.hotkeys.find(hotkey => this.isEqual(hotkey, item))!.strokes = newStrokes
+            this.storeUpdatedHotkeys()
         })
     }
 
     addItem (): void {
         this.ngbModal.open(HotkeyInputModalComponent).result.then((value: string[]) => {
-            this.model = this.model.concat([value])
-            this.modelChange.emit(this.model)
+            this.hotkeys.push({ strokes: value, isDuplicate: false })
+            this.storeUpdatedHotkeys()
         })
     }
 
-    removeItem (item: string[]): void {
-        this.model = this.model.filter(x => x !== item)
-        this.modelChange.emit(this.model)
+    removeItem (item: Hotkey): void {
+        this.hotkeys = this.hotkeys.filter(x => x !== item)
+        this.storeUpdatedHotkeys()
+    }
+
+    private storeUpdatedHotkeys () {
+        this.hotkeysChange.emit(this.hotkeys)
+    }
+
+    private isEqual (h: Hotkey, item: Hotkey) {
+        return JSON.stringify(h.strokes) === JSON.stringify(item.strokes)
     }
 }