Convert `<svg-icon>` to a component

src/sidebar/app.js

@@ -152,6 +152,7 @@ module.exports = angular.module('h', [
   .component('sidebarTutorial', require('./directive/sidebar-tutorial').component)
   .component('shareDialog', require('./directive/share-dialog'))
   .component('sortDropdown', require('./directive/sort-dropdown'))
+  .component('svgIcon', require('./directive/svg-icon'))
   .component('timestamp', require('./directive/timestamp'))
 
   .directive('excerpt', require('./directive/excerpt').directive)
@@ -164,7 +165,6 @@ module.exports = angular.module('h', [
   .directive('markdown', require('./directive/markdown'))
   .directive('spinner', require('./directive/spinner'))
   .directive('statusButton', require('./directive/status-button'))
-  .directive('svgIcon', require('./directive/svg-icon'))
   .directive('tagEditor', require('./directive/tag-editor'))
   .directive('threadList', require('./directive/thread-list'))
   .directive('topBar', require('./directive/top-bar'))

src/sidebar/directive/svg-icon.js

@@ -21,15 +21,11 @@ function SvgIconController($element) {
   $element[0].innerHTML = icons[this.name];
 }
 
-module.exports = function () {
-  return {
-    bindToController: true,
-    controllerAs: 'vm',
-    restrict: 'E',
-    controller: SvgIconController,
-    scope: {
-      /** The name of the icon to load. */
-      name: '<',
-    },
-  };
+module.exports = {
+  controllerAs: 'vm',
+  controller: SvgIconController,
+  bindings: {
+    /** The name of the icon to load. */
+    name: '<',
+  },
 };

src/sidebar/directive/test/svg-icon-test.js

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