Change microfrontend build destination to not conflict with existing …

…patterns

.gitignore

@@ -19,7 +19,7 @@ ui/cacheAndroidDist
 ui/cacheChromeDist
 ui/app/styles/**/*.css
 ui/app/styles/*.css
-ui/app/common/mfe-build
+ui/app/micro-frontends-dist
 **/.DS_Store
 test_out
 omod/src/main/webapp/*
@@ -30,5 +30,5 @@ node_modules
 **/.idea/*
 ui/common.background.min.js
 
-micro-frontends/dist
-micro-frontends/node_modules
+micro-frontends/node_modules
+ui/app/micro-frontends-dist

micro-frontends/README.md

@@ -24,3 +24,23 @@ yarn link bahmni-carbon-ui
 ```
 
 ### Debug changes
+#### build
+```
+$ yarn build
+```
+
+The build output is generated into `../ui/app/micro-frontends-dist/`. This is done so that the 
+main bahmni-apps can reference the built files from there
+
+
+## Understanding the build output
+Here is a description of all the files built
+
+```
+<mfe-name>.min.js         // angular module containing components from a single mfe
+<mfe-name>.min.css        // all the CSS for a given mfe
+
+mfe_polyfills_angular_1_4.min.js    // a polyfill required to load any <mfe-name>.min.js
+```
+
+Currently, we only have the `ipd.min.js` and `ipd.min.css`;

micro-frontends/webpack.config.js

@@ -18,7 +18,7 @@ module.exports = {
     mfe_polyfills_angular_1_4: "./src/polyfill.js",
   },
   output: {
-    path: path.resolve(__dirname, "../ui/app/common/mfe-build"),
+    path: path.resolve(__dirname, "../ui/app/micro-frontends-dist"),
     filename: "[name].min.js",
     clean: true,
   },

ui/Gruntfile.js

@@ -21,7 +21,7 @@ module.exports = function (grunt) {
         'components/ng-tags-input/ng-tags-input.bootstrap.min.css',
         'components/ng-tags-input/ng-tags-input.min.css',
         'components/jquery-ui/themes/smoothness/jquery-ui.min.css',
-        'common/mfe-build/ipd.min.css'
+        'micro-frontends-dist/ipd.min.css'
     ];
 
     var libraryJSFiles = [
@@ -65,8 +65,8 @@ module.exports = function (grunt) {
         'components/jquery-ui/ui/minified/jquery-ui.custom.min.js',
         'components/angular-ivh-treeview/dist/ivh-treeview.min.js',
 
-        'common/mfe-build/ipd.min.js',
-        'common/mfe-build/mfe_polyfills_angular_1_4.min.js'
+        'micro-frontends-dist/mfe_polyfills_angular_1_4.min.js',
+        'micro-frontends-dist/ipd.min.js'
     ];
 
     try {
@@ -487,7 +487,7 @@ module.exports = function (grunt) {
             files: {
                 expand: true,
                 cwd: '<%= yeoman.dist %>',
-                src: ['**/*.min.*.js', '!common/mfe-build/**/*.js'],
+                src: ['**/*.min.*.js', '!micro-frontends-dist/**/*.js'],
                 dest: '<%= yeoman.dist %>'
             }
         },

ui/app/clinical/index.html

@@ -18,7 +18,7 @@
         <link rel="stylesheet" href="../components/ng-tags-input/ng-tags-input.min.css"/>
 
         <!-- All styles from the microfrontends available -->
-        <link rel="stylesheet" href="../common/mfe-build/mfe-styles.css"/>
+        <link rel="stylesheet" href="../micro-frontends-dist/ipd.min.css"/>
 
         <!-- build:css clinical.min.css -->
         <link rel="stylesheet" href="../styles/clinical.css"/>
@@ -90,10 +90,10 @@ <h3 class="close" ng-click="closeTeleConsultation()">
 
 
         <!-- polyfill to add angular feature which will allow easy loading of mfe into angular component -->
-        <script src="../common/mfe-build/mfe_polyfills_angular_1_4.min.js"></script>
+        <script src="../micro-frontends-dist/mfe_polyfills_angular_1_4.min.js"></script>
 
         <!-- load the ipd mfe as angular components -->
-        <script src="../common/mfe-build/ipd.min.js"></script>
+        <script src="../micro-frontends-dist/ipd.min.js"></script>
 
         <!-- build:js clinical.min.js -->
         <script src="../common/constants.js"></script>

ui/test/__mocks__/micro-frontends.js

@@ -0,0 +1 @@
+angular.module("bahmni.mfe.ipd", []);

ui/test/config/karma.conf.js

@@ -9,14 +9,10 @@ module.exports = function (config) {
         files: [
             {pattern: 'test/data/*.json', watched: true, served: true, included: false},
             {pattern: 'app/images/*', included: false, served: true},
-            // angular core
             'app/components/q/q.js',
             'app/components/angular/angular.js',
-            'app/common/mfe-build/mfe_polyfills_angular_1_4.min.js',
-            // react core
-            'app/components/react/react.production.min.js',
-            'app/components/react-dom/react-dom.production.min.js',
-            // other stuff
+            // mock out all the micro-frontends
+            'test/__mocks__/micro-frontends.js',
             'app/components/ngDialog/js/ngDialog.js',
             'app/components/angular-route/angular-route.js',
             'app/components/angular-sanitize/angular-sanitize.js',
@@ -52,7 +48,6 @@ module.exports = function (config) {
             'app/components/angular-translate-storage-cookie/angular-translate-storage-cookie.js',
             'app/components/angular-translate-loader-static-files/angular-translate-loader-static-files.js',
             'app/components/hustle/hustle.js',
-            'app/components/mfe-build/ipd.min.js',
             'app/lib/modernizr.custom.80690.js',
             'app/lib/angular-workers/dist/angular-workers.js',
             'app/common/constants.js',