single entrypoint for Webpack

karma.conf.js

@@ -28,7 +28,7 @@ module.exports = function(config) {
       'static/lib/**/*.js',
 
       // Application resources
-      'static/js/**/*.ts',
+      'static/js/**/*.ts*',
 
       // Tests utils
       'static/test/**/*.js',
@@ -39,7 +39,7 @@ module.exports = function(config) {
     preprocessors: {
       'static/lib/ngReact/react.ngReact.min.js': ['webpack'],
       'static/lib/angular-moment.min.js': ['webpack'],
-      'static/js/**/*.ts': ['karma-typescript'],
+      'static/js/**/*.ts*': ['karma-typescript'],
     },
     webpack: {
       resolve: webpackConfig.resolve,

static/js/app.tsx

@@ -1,5 +0,0 @@
-// Import Components
-import {rpDirectives as repoPage} from "./directives/components/pages/repo-page/main";
-
-// Init for each page
-repoPage();

static/js/constants/pages.constant.ts

@@ -0,0 +1,28 @@
+export default {
+  '_pages': {},
+
+  'create': function (pageName, templateName, opt_controller, opt_flags, opt_profiles) {
+    var profiles = opt_profiles || ['old-layout', 'layout'];
+    for (var i = 0; i < profiles.length; ++i) {
+      this._pages[profiles[i] + ':' + pageName] = {
+        'name': pageName,
+        'controller': opt_controller,
+        'templateName': templateName,
+        'flags': opt_flags || {}
+      };
+    }
+  },
+
+  'get': function (pageName, profiles) {
+    for (var i = 0; i < profiles.length; ++i) {
+      var current = profiles[i];
+      var key = current.id + ':' + pageName;
+      var page = this._pages[key];
+      if (page) {
+        return [current, page];
+      }
+    }
+
+    return null;
+  }
+};

static/js/directives/components/pages/repo-page/main.tsx

@@ -1,22 +1,31 @@
-import "sass/repo-page/repo-page.scss";
-import * as angular from "angular";
-import quayPages from '../../../../quay-pages.module';
-
+import "../../../../../css/directives/components/pages/repo-page/repo-page.scss";
 import repoHeader from "./header";
 import repoSidebar from "./sidebar";
 import repoBody from "./body";
 
-export function rpDirectives(){
-  angular.module(quayPages).directive('rpHeader', function(reactDirective) {
-    return reactDirective(repoHeader);
-  });
+rpHeaderDirective.$inject = [
+  'reactDirective',
+];
 
-  angular.module(quayPages).directive('rpSidebar', function(reactDirective) {
-    return reactDirective(repoSidebar);
-  });
-
-  angular.module(quayPages).directive('rpBody', function(reactDirective, ApiService) {
-    return reactDirective(repoBody, undefined, {}, {api: ApiService});
-  });
+export function rpHeaderDirective(reactDirective) {
+  return reactDirective(repoHeader);
 }
 
+
+rpSidebarDirective.$inject = [
+  'reactDirective',
+];
+
+export function rpSidebarDirective(reactDirective) {
+  return reactDirective(repoSidebar);
+}
+
+
+rpBodyDirective.$inject = [
+  'reactDirective',
+  'ApiService',
+];
+
+export function rpBodyDirective(reactDirective, ApiService) {
+  return reactDirective(repoBody, undefined, {}, {api: ApiService});
+}

static/js/directives/ui/namespace-input.js

@@ -17,7 +17,7 @@ angular.module('quay').directive('namespaceInput', function () {
     },
     controller: function($scope, $element, namePatterns) {
       $scope.USERNAME_PATTERN = namePatterns.USERNAME_PATTERN;
-      $scope.usernamePattern = new RegExp(USERNAME_PATTERN);
+      $scope.usernamePattern = new RegExp(namePatterns.USERNAME_PATTERN);
 
       $scope.$watch('binding', function(binding) {
         if (!binding) {

static/js/quay-pages.module.ts

@@ -1,34 +1,12 @@
 import * as angular from 'angular';
+import { rpHeaderDirective, rpBodyDirective, rpSidebarDirective } from './directives/components/pages/repo-page/main';
+import pages from './constants/pages.constant';
 
 
 export default angular
   .module('quayPages', [])
-  .constant('pages', {
-    '_pages': {},
-
-    'create': function(pageName, templateName, opt_controller, opt_flags, opt_profiles) {
-      var profiles = opt_profiles || ['old-layout', 'layout'];
-      for (var i = 0; i < profiles.length; ++i) {
-        this._pages[profiles[i] + ':' + pageName] = {
-          'name': pageName,
-          'controller': opt_controller,
-          'templateName': templateName,
-          'flags': opt_flags || {}
-        };
-      }
-    },
-
-    'get': function(pageName, profiles) {
-      for (var i = 0; i < profiles.length; ++i) {
-        var current = profiles[i];
-        var key = current.id + ':' + pageName;
-        var page = this._pages[key];
-        if (page) {
-          return [current, page];
-        }
-      }
-
-      return null;
-    }
-  })
+  .constant('pages', pages)
+  .directive('rpHeader', rpHeaderDirective)
+  .directive('rpSidebar', rpSidebarDirective)
+  .directive('rpBody', rpBodyDirective)
   .name;

webpack.config.js

@@ -2,7 +2,7 @@ var webpack = require('webpack');
 var path = require("path");
 
 var config = {
-  entry: ["./static/js/app.tsx", "./static/js/quay.module.ts"],
+  entry: "./static/js/quay.module.ts",
   output: {
     path: path.resolve(__dirname, "static/js/build"),
     filename: "bundle.js"