Step 23.7: Move everything to typescript

imports/ui/components/auth/auth.ts

@@ -0,0 +1,52 @@
+import * as angular from 'angular';
+import * as angularMeteor from 'angular-meteor';
+
+import { Meteor } from 'meteor/meteor';
+import { Accounts } from 'meteor/accounts-base';
+
+import template from './auth.html';
+import DisplayNameFilter from '../../filters/displayNameFilter';
+import { LoginNg1Module } from '../login/login';
+import { RegisterNg1Module } from '../register/register';
+import { PasswordNg1Module } from '../password/password';
+
+const name = 'auth';
+
+class Auth {
+  constructor($scope, $reactive) {
+    'ngInject';
+
+    $reactive(this).attach($scope);
+
+    this.helpers({
+      isLoggedIn() {
+        return !!Meteor.userId();
+      },
+      currentUser() {
+        return Meteor.user();
+      }
+    });
+  }
+
+  logout() {
+    Accounts.logout();
+  }
+}
+
+// create a module
+export const AuthNg1Module = angular.module(name, [
+  angularMeteor,
+  DisplayNameFilter.name,
+  LoginNg1Module.name,
+  RegisterNg1Module.name,
+  PasswordNg1Module.name
+]);
+
+export function registerAuth() {
+  AuthNg1Module
+    .component(name, {
+      template,
+      controllerAs: name,
+      controller: Auth
+    });
+}

imports/ui/components/login/login.js → imports/ui/components/login/login.ts

@@ -1,29 +1,33 @@
-import angular from 'angular';
-import angularMeteor from 'angular-meteor';
-import uiRouter from 'angular-ui-router';
+import * as angular from 'angular';
+import * as angularMeteor from 'angular-meteor';
+import * as uiRouter from 'angular-ui-router';
 
 import { Meteor } from 'meteor/meteor';
 
 import webTemplate from './web.html';
-import { Login as LoginWeb } from './web';
+import LoginWeb from './web';
 import mobileTemplate from './mobile.html';
-import { Login as LoginMobile } from './mobile';
+import LoginMobile from './mobile';
 
 const name = 'login';
 const template = Meteor.isCordova ? mobileTemplate : webTemplate;
 const controller = Meteor.isCordova ? LoginMobile : LoginWeb;
 
 // create a module
-export default angular.module(name, [
+export const LoginNg1Module = angular.module(name, [
   angularMeteor,
   uiRouter
-])
-  .component(name, {
-    template,
-    controller,
-    controllerAs: name
-  })
-  .config(config);
+]);
+
+export function registerLogin() {
+  LoginNg1Module
+    .component(name, {
+      template,
+      controller,
+      controllerAs: name
+    })
+    .config(config);
+}
 
 function config($stateProvider) {
   'ngInject';

imports/ui/components/navigation/navigation.ts

@@ -0,0 +1,19 @@
+import * as angular from 'angular';
+import * as angularMeteor from 'angular-meteor';
+
+import template from './navigation.html';
+
+const name = 'navigation';
+
+// create a module
+export const NavigationNg1Module = angular.module(name, [
+  angularMeteor
+]);
+
+export function registerNavigation() {
+  NavigationNg1Module
+    .component(name, {
+      template,
+      controllerAs: name
+    });
+}

imports/ui/components/partiesList/client/partiesList.tests.js → imports/ui/components/partiesList/client/partiesList.tests.ts

@@ -1,17 +1,17 @@
-import { name as PartiesList } from '../partiesList';
+import PartiesList from '../partiesList';
 import 'angular-mocks';
 
 describe('PartiesList', () => {
   beforeEach(() => {
-    window.module(PartiesList);
+    window.module(PartiesList.name);
   });
 
   describe('controller', () => {
     let controller;
 
     beforeEach(() => {
       inject(($rootScope, $componentController) => {
-        controller = $componentController(PartiesList, {
+        controller = $componentController(PartiesList.name, {
           $scope: $rootScope.$new(true)
         });
       });

imports/ui/components/partiesList/partiesList.js → imports/ui/components/partiesList/partiesList.ts

@@ -1,22 +1,22 @@
-import angular from 'angular';
-import angularMeteor from 'angular-meteor';
-import uiRouter from 'angular-ui-router';
-import utilsPagination from 'angular-utils-pagination';
+import * as angular from 'angular';
+import * as angularMeteor from 'angular-meteor';
+import * as uiRouter from 'angular-ui-router';
+import * as utilsPagination from 'angular-utils-pagination';
 
 import { Counts } from 'meteor/tmeasday:publish-counts';
 import { Meteor } from 'meteor/meteor';
 
 import webTemplate from './web.html';
 import mobileTemplate from './mobile.html';
 import { Parties } from '../../../api/parties';
-import { name as PartiesSort } from '../partiesSort/partiesSort';
-import { name as PartiesMap } from '../partiesMap/partiesMap';
-import { name as PartyAddButton } from '../partyAddButton/partyAddButton';
-import { name as PartyRemove } from '../partyRemove/partyRemove';
-import { name as PartyCreator } from '../partyCreator/partyCreator';
-import { name as PartyRsvp } from '../partyRsvp/partyRsvp';
-import { name as PartyRsvpsList } from '../partyRsvpsList/partyRsvpsList';
-import { name as PartyImage } from '../partyImage/partyImage';
+import { PartiesSortNg1Module } from '../partiesSort/partiesSort';
+import { PartiesMapNg1Module } from '../partiesMap/partiesMap';
+import { PartyAddButtonNg1Module } from '../partyAddButton/partyAddButton';
+import { PartyRemoveNg1Module } from '../partyRemove/partyRemove';
+import { PartyCreatorNg1Module } from '../partyCreator/partyCreator';
+import { PartyRsvpNg1Module } from '../partyRsvp/partyRsvp';
+import { PartyRsvpsListNg1Module } from '../partyRsvpsList/partyRsvpsList';
+import { PartyImageNg1Module } from '../partyImage/partyImage';
 
 class PartiesList {
   constructor($scope, $reactive) {
@@ -76,24 +76,29 @@ const name = 'partiesList';
 const template = Meteor.isCordova ? mobileTemplate : webTemplate;
 
 // create a module
-export default angular.module(name, [
+export const PartiesListNg1Module = angular.module(name, [
   angularMeteor,
   uiRouter,
   utilsPagination,
-  PartiesSort,
-  PartiesMap,
-  PartyAddButton,
-  PartyRemove,
-  PartyCreator,
-  PartyRsvp,
-  PartyRsvpsList,
-  PartyImage
-]).component(name, {
-  template,
-  controllerAs: name,
-  controller: PartiesList
-})
-  .config(config);
+  PartiesSortNg1Module.name,
+  PartiesMapNg1Module.name,
+  PartyAddButtonNg1Module.name,
+  PartyRemoveNg1Module.name,
+  PartyCreatorNg1Module.name,
+  PartyRsvpNg1Module.name,
+  PartyRsvpsListNg1Module.name,
+  PartyImageNg1Module.name
+]);
+
+export function registerPartiesList() {
+  PartiesListNg1Module
+    .component(name, {
+      template,
+      controllerAs: name,
+      controller: PartiesList
+    })
+    .config(config);
+}
 
 function config($stateProvider) {
   'ngInject';

imports/ui/components/partiesMap/partiesMap.js → imports/ui/components/partiesMap/partiesMap.ts

@@ -1,5 +1,5 @@
-import angular from 'angular';
-import angularMeteor from 'angular-meteor';
+import * as angular from 'angular';
+import * as angularMeteor from 'angular-meteor';
 import 'angular-simple-logger';
 import 'angular-google-maps';
 
@@ -23,15 +23,20 @@ class PartiesMap {
 const name = 'partiesMap';
 
 // create a module
-export default angular.module(name, [
+export const PartiesMapNg1Module = angular.module(name, [
   angularMeteor,
   'nemLogging', // https://github.com/angular-ui/angular-google-maps/issues/1633
   'uiGmapgoogle-maps'
-]).component(name, {
-  template,
-  controllerAs: name,
-  bindings: {
-    parties: '='
-  },
-  controller: PartiesMap
-});
+]);
+
+export function registerPartiesMap() {
+  PartiesMapNg1Module
+    .component(name, {
+      template,
+      controllerAs: name,
+      bindings: {
+        parties: '='
+      },
+      controller: PartiesMap
+    });
+}