Visualize aborted keybindings

lib/keybinding-resolver-view.js

@@ -13,6 +13,7 @@ export default class KeyBindingResolverView {
     this.unusedKeyBindings = []
     this.unmatchedKeyBindings = []
     this.partiallyMatchedBindings = []
+    this.abortedBindings = []
     etch.initialize(this)
   }
 
@@ -41,20 +42,21 @@ export default class KeyBindingResolverView {
       this.panel = null
     }))
 
-    this.disposables.add(atom.keymaps.onDidMatchBinding(({keystrokes, binding, keyboardEventTarget, eventType}) => {
+    this.disposables.add(atom.keymaps.onDidMatchBinding(({keystrokes, binding, keyboardEventTarget, eventType, abortedBindings}) => {
       if (eventType === 'keyup' && binding == null) {
         return
       }
 
       const unusedKeyBindings = atom.keymaps
         .findKeyBindings({keystrokes, target: keyboardEventTarget})
         .filter((b) => b !== binding)
+        .filter((b) => !abortedBindings.includes(b))
 
       const unmatchedKeyBindings = atom.keymaps
         .findKeyBindings({keystrokes})
-        .filter((b) => b !== binding && !unusedKeyBindings.includes(b))
+        .filter((b) => b !== binding && !unusedKeyBindings.includes(b) && !abortedBindings.includes(b))
 
-      this.update({usedKeyBinding: binding, unusedKeyBindings, unmatchedKeyBindings, keystrokes})
+      this.update({usedKeyBinding: binding, unusedKeyBindings, unmatchedKeyBindings, keystrokes, abortedBindings})
     }))
 
     this.disposables.add(atom.keymaps.onDidPartiallyMatchBindings(({keystrokes, partiallyMatchedBindings}) => {
@@ -87,6 +89,7 @@ export default class KeyBindingResolverView {
     this.unusedKeyBindings = props.unusedKeyBindings || []
     this.unmatchedKeyBindings = props.unmatchedKeyBindings || []
     this.partiallyMatchedBindings = props.partiallyMatchedBindings || []
+    this.abortedBindings = props.abortedBindings || []
     return etch.update(this)
   }
 
@@ -145,6 +148,13 @@ export default class KeyBindingResolverView {
         <table className='table-condensed'>
           <tbody>
           {usedKeyBinding}
+          {this.abortedBindings.map((binding) => (
+            <tr className='aborted'>
+              <td className='command'>{binding.command}</td>
+              <td className='selector'>{binding.selector}</td>
+              <td className='source' onclick={() => this.openKeybindingFile(binding.source)}>{binding.source}</td>
+            </tr>
+          ))}
           {this.unusedKeyBindings.map((binding) => (
             <tr className='unused'>
               <td className='command'>{binding.command}</td>

styles/keybinding-resolver.less

@@ -14,6 +14,10 @@
       color: @text-color-success;
     }
 
+    .aborted {
+      color: @text-color-warning;
+    }
+
     .unused {
       color: @text-color;
     }
@@ -22,10 +26,14 @@
       color: @text-color-subtle;
     }
 
-    .used .command, .unused .command{
+    .used .command, .unused .command {
       .octicon(check);
     }
 
+    .aborted .command {
+      .octicon(stop);
+    }
+
     .unmatched .command {
       .octicon(x);
     }