Convert `<search-status-bar>` to a component

src/sidebar/app.js

@@ -146,6 +146,7 @@ module.exports = angular.module('h', [
   .component('loginControl', require('./directive/login-control'))
   .component('loginForm', require('./directive/login-form').component)
   .component('publishAnnotationBtn', require('./directive/publish-annotation-btn'))
+  .component('searchStatusBar', require('./directive/search-status-bar'))
   .component('timestamp', require('./directive/timestamp'))
 
   .directive('excerpt', require('./directive/excerpt').directive)
@@ -156,7 +157,6 @@ module.exports = angular.module('h', [
   .directive('hOnTouch', require('./directive/h-on-touch'))
   .directive('hTooltip', require('./directive/h-tooltip'))
   .directive('markdown', require('./directive/markdown'))
-  .directive('searchStatusBar', require('./directive/search-status-bar'))
   .directive('shareDialog', require('./directive/share-dialog'))
   .directive('sidebarTutorial', require('./directive/sidebar-tutorial').directive)
   .directive('searchInput', require('./directive/search-input'))

src/sidebar/directive/search-status-bar.js

@@ -2,27 +2,22 @@
 
 var uiConstants = require('../ui-constants');
 
-// @ngInject
-module.exports = function () {
-  return {
-    bindToController: true,
-    controllerAs: 'vm',
-    controller: function () {
-      this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
-      this.TAB_NOTES = uiConstants.TAB_NOTES;
-      this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
-    },
-    restrict: 'E',
-    scope: {
-      filterActive: '<',
-      filterMatchCount: '<',
-      onClearSelection: '&',
-      searchQuery: '<',
-      selectedTab: '<',
-      selectionCount: '<',
-      totalAnnotations: '<',
-      totalNotes: '<',
-    },
-    template: require('../templates/search_status_bar.html'),
-  };
+module.exports = {
+  controllerAs: 'vm',
+  controller: function () {
+    this.TAB_ANNOTATIONS = uiConstants.TAB_ANNOTATIONS;
+    this.TAB_NOTES = uiConstants.TAB_NOTES;
+    this.TAB_ORPHANS = uiConstants.TAB_ORPHANS;
+  },
+  bindings: {
+    filterActive: '<',
+    filterMatchCount: '<',
+    onClearSelection: '&',
+    searchQuery: '<',
+    selectedTab: '<',
+    selectionCount: '<',
+    totalAnnotations: '<',
+    totalNotes: '<',
+  },
+  template: require('../templates/search_status_bar.html'),
 };

src/sidebar/directive/test/search-status-bar-test.js

@@ -7,7 +7,7 @@ var util = require('./util');
 describe('searchStatusBar', function () {
   before(function () {
     angular.module('app', [])
-      .directive('searchStatusBar', require('../search-status-bar'));
+      .component('searchStatusBar', require('../search-status-bar'));
   });
 
   beforeEach(function () {