Feature decorate disabled pkg keymap

lib/package-keymap-view.js

@@ -161,6 +161,24 @@ export default class PackageKeymapView {
       sourceTd.textContent = KeybindingsPanel.determineSource(source)
       keyBindingRow.appendChild(sourceTd)
 
+      // if the keybinding from the source file is not installed, mark it as inactive
+      var sourceRegex = new RegExp(source)
+      var isBindingInstalled = atom.keymaps.keyBindings.find((kb) => {
+        let matched = kb.selector === selector &&
+          sourceRegex.test(kb.source) &&
+          kb.command === command &&
+          kb.keystrokes === keystrokes
+        return matched
+      })
+
+      if (!isBindingInstalled) {
+        keyBindingRow.classList.add('text-subtle')
+        keystrokesTd.classList.add('icon', 'icon-circle-slash')
+        this.disposables.add(atom.tooltips.add(keystrokesTd, {
+          title: 'Disabled. This binding it not in the list of active bindings'
+        }))
+      }
+
       this.refs.keybindingItems.appendChild(keyBindingRow)
     }
   }

spec/installed-package-view-spec.coffee

@@ -270,6 +270,44 @@ describe "InstalledPackageView", ->
           }
         """
 
+  describe "when a package keybinding is installed", ->
+    it "does not decorate its row with and first column with text-subtle and icon.inoc-circle-slash classes", ->
+      waitsForPromise ->
+        atom.packages.activatePackage(path.join(__dirname, 'fixtures', 'language-test'))
+
+      runs ->
+        pack = atom.packages.getActivePackage('language-test')
+        card = new PackageKeymapView(pack)
+        jasmine.attachToDOM(card.element)
+
+        normalKeyRows = card.element.querySelectorAll('.package-keymap-table tr.text-subtle')
+        expect(normalKeyRows.length).toBe 0
+
+        disabledKeysByIcon = card.element.querySelectorAll('.package-keymap-table td.icon.icon-circle-slash')
+        expect(disabledKeysByIcon.length).toBe 0
+
+  describe "when a package keybinding is not installed", ->
+    it "decorates its row with and first column with text-subtle and icon.inoc-circle-slash classes", ->
+    it "decorates rows with a disabled keybinding", ->
+      waitsForPromise ->
+        atom.packages.activatePackage(path.join(__dirname, 'fixtures', 'language-test'))
+
+      runs ->
+        atom.keymaps.keyBindings = atom.keymaps.keyBindings.filter (keyBinding) ->
+          return not (/language-test/.test(keyBinding.source) or keyBinding.selector is 'test')
+
+        pack = atom.packages.getActivePackage('language-test')
+        card = new PackageKeymapView(pack)
+        jasmine.attachToDOM(card.element)
+
+        disabledKeyRows = card.element.querySelectorAll('.package-keymap-table tr.text-subtle')
+        expect(disabledKeyRows.length).toBe 1
+
+        disabledKeysByIcon = card.element.querySelectorAll('.package-keymap-table td.icon.icon-circle-slash')
+        expect(disabledKeysByIcon.length).toBe 1
+
+
+
   describe "when the package is active", ->
     it "displays the correct enablement state", ->
       packageCard = null