chore(*): Make all code ng-strict-di compliant

app/bootstrap/ngmodule.js

@@ -15,7 +15,7 @@ import {visualizer} from "@uirouter/visualizer";
 export const ngmodule = angular.module("demo", [uiRouter]);
 
 // Show ui-router-visualizer
-ngmodule.run($uiRouter => visualizer($uiRouter));
+ngmodule.run(['$uiRouter', $uiRouter => visualizer($uiRouter)]);
 
 const BLANK_MODULE = {
   states: [],
@@ -37,7 +37,7 @@ const BLANK_MODULE = {
 export function loadNg1Module(ngModule, appModule) {
   let module = Object.assign({}, BLANK_MODULE, appModule);
 
-  ngModule.config(['$stateProvider', $stateProvider => module.states.forEach(state => $stateProvider.state(state))]);
+  ngModule.config(['$stateRegistryProvider', $stateRegistryProvider => module.states.forEach(state => $stateRegistryProvider.register(state))]);
 
   Object.keys(module.components).forEach(name => ngModule.component(name, module.components[name]));
 

app/contacts/contacts.states.js

@@ -12,7 +12,7 @@ export const contactsState = {
   url: "/contacts",
   resolve: {
     // Resolve all the contacts.  The resolved contacts are injected into the controller.
-    contacts: (Contacts) => Contacts.all()
+    contacts: ['Contacts', (Contacts) => Contacts.all()]
   },
   data: { requiresAuth: true },
   component: 'contacts'
@@ -28,7 +28,7 @@ export const viewContactState = {
   resolve: {
     // Resolve the contact, based on the contactId parameter value.
     // The resolved contact is provided to the contactComponent's contact binding
-    contact: (Contacts, $transition$) => Contacts.get($transition$.params().contactId)
+    contact: ['Contacts', '$transition$', (Contacts, $transition$) => Contacts.get($transition$.params().contactId)]
   },
   component: 'contactView'
 };

app/contacts/editContact.component.js

@@ -58,6 +58,7 @@ class EditContactController {
         .then(() => this.$state.go("^", null, { reload: true }));
   }
 }
+EditContactController.$inject = ['$state', 'DialogService', 'Contacts'];
 
 /**
  * This component edits a single contact.

app/global/auth.service.js

@@ -48,3 +48,4 @@ export class AuthService {
     this.AppConfig.save();
   }
 }
+AuthService.$inject = ['AppConfig', '$q', '$timeout'];

app/global/dataSources.service.js

@@ -23,13 +23,15 @@ export class Contacts extends SessionStorage {
     super($http, $timeout, $q, "contacts", "data/contacts.json", AppConfig);
   }
 }
+Contacts.$inject = ['$http', '$timeout', '$q', 'AppConfig'];
 
 /** A fake Folders REST client API */
 export class Folders extends SessionStorage {
   constructor($http, $timeout, $q, AppConfig) {
     super($http, $timeout, $q, 'folders', 'data/folders.json', AppConfig);
   }
 }
+Folders.$inject = ['$http', '$timeout', '$q', 'AppConfig'];
 
 /** A fake Messages REST client API */
 export class Messages extends SessionStorage {
@@ -45,3 +47,4 @@ export class Messages extends SessionStorage {
     return this.search(searchObject);
   }
 }
+Messages.$inject = ['$http', '$timeout', '$q', 'AppConfig'];

app/global/dialog.directive.js

@@ -1,4 +1,5 @@
-export const dialog = function($timeout, $q) {
+dialog.$inject = ['$timeout', '$q'];
+export function dialog($timeout, $q) {
   return {
     link: (scope, elem) => {
       $timeout(() => elem.addClass('active'));
@@ -22,4 +23,4 @@ export const dialog = function($timeout, $q) {
       </div>
 `
   }
-};
+}

app/global/dialog.service.js

@@ -11,4 +11,5 @@ export class DialogService {
       return elem.data("promise").finally(() => elem.removeClass('active').remove());
     }
   }
-}
+}
+DialogService.$inject = ['$document', '$compile', '$rootScope'];

app/global/requiresAuth.hook.js

@@ -6,6 +6,7 @@
  * - The user is not authenticated
  * - The user is navigating to a state that requires authentication
  */
+authHookRunBlock.$inject = ['$transitions', 'AuthService'];
 export function authHookRunBlock($transitions, AuthService) {
   // Matches if the destination state's data property has a truthy 'requiresAuth' property
   let requiresAuthCriteria = {

app/main/app.component.js

@@ -17,6 +17,7 @@ class AuthedController {
     return $state.go('welcome', {}, { reload: true });
   }
 }
+AuthedController.$inject = ['AppConfig', 'AuthService', '$state'];
 
 /**
  * This is the main app component for an authenticated user.

app/main/app.states.js

@@ -63,7 +63,8 @@ export const loginState = {
  * they were redirected from.  Otherwise, if they transitioned directly, return the fromState/params.  Otherwise
  * return the main "home" state.
  */
-function returnTo ($transition$) {
+returnTo.$inject = ['$transition$'];
+function returnTo($transition$) {
   if ($transition$.redirectedFrom() != null) {
     // The user was redirected to the login state (e.g., via the requiresAuth hook when trying to activate contacts)
     // Return to the original attempted target state (e.g., contacts)

app/main/login.component.js

@@ -33,6 +33,7 @@ class LoginController {
     }
   }
 }
+LoginController.$inject = ['AppConfig', 'AuthService', '$state'];
 
 /**
  * This component renders a faux authentication UI

app/mymessages/compose.component.js

@@ -62,6 +62,7 @@ class ComposeController {
         .then(() => this.gotoPreviousState());
   }
 }
+ComposeController.$inject = ['$state', 'DialogService', 'AppConfig', 'Messages'];
 
 /**
  * This component composes a message

app/mymessages/directives/messageTable.component.js

@@ -10,10 +10,7 @@
 export const messageTable = {
   bindings: { columns: '<', messages: '<' },
 
-  controller: function(AppConfig) {
-    this.AppConfig = AppConfig;
-    this.colVisible = (name) => this.columns.indexOf(name) !== -1;
-  },
+  controller: messageTableController,
 
   template: `
     <table>
@@ -39,4 +36,10 @@ export const messageTable = {
       </tbody>
   
     </table>
-`};
+`};
+
+messageTableController.$inject = ['AppConfig'];
+function messageTableController(AppConfig) {
+  this.AppConfig = AppConfig;
+  this.colVisible = (name) => this.columns.indexOf(name) !== -1;
+}

app/mymessages/filters/messageBody.filter.js

@@ -1,4 +1,5 @@
 /** Angular filter to format fake emails as HTML*/
-export const messageBody = function($sce) {
+messageBody.$inject = ['$sce'];
+export function messageBody($sce) {
   return (msgText = '') => $sce.trustAsHtml(msgText.split(/\n/).map(p => `<p>${p}</p>`).join('\n'));
-};
+}

app/mymessages/message.component.js

@@ -88,6 +88,7 @@ class MessageController {
         .then(() => this.$state.go(nextState, params, { reload: 'mymessages.messagelist' }));
   };
 }
+MessageController.$inject = ['$state', 'DialogService', 'Messages'];
 
 /**
  * This component renders a single message

app/mymessages/mymessages.states.js

@@ -30,7 +30,7 @@ export const mymessagesState = {
   url: "/mymessages",
   resolve: {
     // All the folders are fetched from the Folders service
-    folders: (Folders) => Folders.all()
+    folders: ['Folders', (Folders) => Folders.all()]
   },
   // If mymessages state is directly activated, redirect the transition to the child state 'mymessages.messagelist'
   redirectTo: 'mymessages.messagelist',
@@ -49,9 +49,9 @@ export const messageState = {
   url: '/:messageId',
   resolve: {
     // Fetch the message from the Messages service using the messageId parameter
-    message: (Messages, $stateParams) => Messages.get($stateParams.messageId),
+    message: ['Messages', '$stateParams', (Messages, $stateParams) => Messages.get($stateParams.messageId)],
     // Provide the component with a function it can query that returns the closest message id
-    nextMessageGetter: (MessageListUI, messages) => MessageListUI.proximalMessageId.bind(MessageListUI, messages)
+    nextMessageGetter: ['MessageListUI', 'messages', (MessageListUI, messages) => MessageListUI.proximalMessageId.bind(MessageListUI, messages)]
   },
   views: {
     // Relatively target the parent-state's parent-state's 'messagecontent' ui-view
@@ -73,11 +73,11 @@ export const messageListState = {
   params: {folderId: "inbox"},
   resolve: {
     // Fetch the current folder from the Folders service, using the folderId parameter
-    folder: (Folders, $stateParams) => Folders.get($stateParams.folderId),
+    folder: ['Folders', '$stateParams', (Folders, $stateParams) => Folders.get($stateParams.folderId)],
 
     // The resolved folder object (from the resolve above) is injected into this resolve
     // The list of message for the folder are fetched from the Messages service
-    messages: (Messages, folder) => Messages.byFolder(folder)
+    messages: ['Messages', 'folder', (Messages, folder) => Messages.byFolder(folder)]
   },
   views: {
     // This targets the "messagelist" named ui-view added to the DOM in the parent state 'mymessages'

app/mymessages/services/messagesListUI.service.js

@@ -12,4 +12,5 @@ export class MessageListUI {
     var proximalIdx = sorted.length > idx + 1 ? idx + 1 : idx - 1;
     return proximalIdx >= 0 ? sorted[proximalIdx]._id : undefined;
   }
-}
+}
+MessageListUI.$inject = ['$filter', 'AppConfig'];

app/prefs/prefs.component.js

@@ -24,6 +24,7 @@ class PrefsController {
     document.location.reload(true);
   }
 }
+PrefsController.$inject = ['AppConfig'];
 
 /**
  * A component which shows and updates app preferences

app/util/ga.js

@@ -11,7 +11,7 @@ ga('create', 'UA-73329341-1', 'auto');
 ga('send', 'pageview');
 
 
-ngmodule.config($transitionsProvider => {
+ngmodule.config(['$transitionsProvider', $transitionsProvider => {
   $transitionsProvider.onBefore({}, $transition$ => {
     let path = $transition$.treeChanges().to
         .map(node=>node.state.self.url)
@@ -29,4 +29,4 @@ ngmodule.config($transitionsProvider => {
 
     $transition$.promise.then(success, error);
   })
-});
+}]);

app/util/sessionStorage.js

@@ -117,4 +117,5 @@ export class SessionStorage {
       return this._commit(items).then(() => item);
     });
   }
-}
+}
+SessionStorage.$inject = ['$http', '$timeout', '$q', 'sessionStorageKey', 'sourceUrl', 'AppConfig'];

index.html

@@ -6,7 +6,8 @@
           integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
     <link rel="stylesheet" href="styles/app.css">
 </head>
-<body ng-app="demo">
+
+<body ng-app="demo" ng-strict-di>
     <!-- the app goes here -->
     <div ui-view></div>