@coolon/angular-ui-powerups 3.0.3 → 3.1.0

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [3.1.0](https://bitbucket.org/coolon/angular-ui-powerups/compare/v3.0.3...v3.1.0) (2020-09-18)
+
+
+### Features
+
+* updated bootstrap-app to generate application root component ([6562f41](https://bitbucket.org/coolon/angular-ui-powerups/commit/6562f41166006d778782a4b2254cc869e7ed6b53))
+
 ### [3.0.3](https://bitbucket.org/coolon/angular-ui-powerups/compare/v3.0.2...v3.0.3) (2020-09-13)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coolon/angular-ui-powerups",
-  "version": "3.0.3",
+  "version": "3.1.0",
   "schematics": "./schematics/collection.json",
   "dependencies": {
     "@coolon/typescript-utilities": "^2.0.0",

package/schematics/bootstrap-app/index.d.ts

@@ -1,3 +1,4 @@
-import { Rule } from '@angular-devkit/schematics';
+import { Rule, Source } from '@angular-devkit/schematics';
 import { Schema } from './schema';
 export declare function bootstrapApp(_options: Schema): Rule;
+export declare function applyWithOverwrite(source: Source, rules: Rule[]): Rule;

package/schematics/bootstrap-app/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.bootstrapApp = void 0;
+exports.applyWithOverwrite = exports.bootstrapApp = void 0;
 const core_1 = require("@angular-devkit/core");
 const schematics_1 = require("@angular-devkit/schematics");
 const package_util_1 = require("../package-util");
@@ -18,13 +18,12 @@ function bootstrapApp(_options) {
         if (!_options.project) {
             _options.project = workspace.defaultProject;
         }
-        const templateSource = schematics_1.apply(schematics_1.url('./templates'), [
+        const templateSource = applyWithOverwrite(schematics_1.url('./templates'), [
             schematics_1.applyTemplates(Object.assign(Object.assign({}, _options), core_1.strings)),
-            schematics_1.move(`apps/${_options.project}/src`),
+            schematics_1.move(`apps/${_options.project}/src`)
         ]);
-        const fileMerge = schematics_1.mergeWith(templateSource, schematics_1.MergeStrategy.Overwrite);
         const rule = schematics_1.chain([
-            fileMerge,
+            templateSource,
             updatePackageJsonScripts(_options)
         ]);
         return rule(tree, _context);
@@ -34,10 +33,27 @@ exports.bootstrapApp = bootstrapApp;
 function updatePackageJsonScripts(_options) {
     return (tree, _) => {
         return package_util_1.updatePackageJson(tree, draft => {
-            draft.scripts = Object.assign(Object.assign({}, draft.scripts), { [`place-routes:${_options.project}`]: `ng generate @coolon/angular-ui-powerups:place-routes --project ${_options.project}`, [`i18n:${_options.project}`]: `i18n-resource-generator apps/${_options.project}/src/i18n apps/${_options.project}/src/app` });
+            draft.scripts = Object.assign(Object.assign({}, draft.scripts), { [`i18n:${_options.project}`]: `i18n-resource-generator apps/${_options.project}/src/i18n apps/${_options.project}/src/app`, [`place-routes:${_options.project}`]: `ng generate @coolon/angular-ui-powerups:place-routes --project ${_options.project}`, [`build:${_options.project}`]: 'nx build --prod --project ${_options.project}', [`start:${_options.project}`]: 'nx serve --project ${_options.project}' });
         });
     };
 }
+// See https://stackoverflow.com/a/53230034
+function applyWithOverwrite(source, rules) {
+    return (tree, _context) => {
+        const rule = schematics_1.mergeWith(schematics_1.apply(source, [
+            ...rules,
+            schematics_1.forEach((fileEntry) => {
+                if (tree.exists(fileEntry.path)) {
+                    tree.overwrite(fileEntry.path, fileEntry.content);
+                    return null;
+                }
+                return fileEntry;
+            })
+        ]));
+        return rule(tree, _context);
+    };
+}
+exports.applyWithOverwrite = applyWithOverwrite;
 // function generateApp(name: string): Rule {
 //   return externalSchematic('@nrwl/angular', 'application', {
 //     name,

package/schematics/bootstrap-app/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/angular-ui-powerups/schematics/bootstrap-app/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6D;AAC7D,2DAUoC;AACpC,kDAAoD;AAGpD,yFAAyF;AAEzF,SAAgB,YAAY,CAAC,QAAgB;IAE3C,OAAO,CAAC,IAAU,EAAE,QAA0B,EAAE,EAAE;QAGhD,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACnD,IAAI,CAAC,eAAe,EAAE;YACpB,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;SACnE;QAED,8BAA8B;QAC9B,MAAM,gBAAgB,GAAG,eAAe,CAAC,QAAQ,EAAE,CAAC;QAEpD,0CAA0C;QAC1C,MAAM,SAAS,GAA2C,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;QAEvF,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;YACrB,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,cAAc,CAAC;SAC7C;QAED,MAAM,cAAc,GAAG,kBAAK,CAC1B,gBAAG,CAAC,aAAa,CAAC,EAAE;YAClB,2BAAc,iCAAM,QAAQ,GAAK,cAAO,EAAG;YAC3C,iBAAI,CAAC,QAAQ,QAAQ,CAAC,OAAO,MAAM,CAAC;SACrC,CAAC,CAAC;QACL,MAAM,SAAS,GAAG,sBAAS,CAAC,cAAc,EAAE,0BAAa,CAAC,SAAS,CAAC,CAAC;QAErE,MAAM,IAAI,GAAG,kBAAK,CAAC;YACjB,SAAS;YACT,wBAAwB,CAAC,QAAQ,CAAC;SACnC,CAAC,CAAC;QAEH,OAAO,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAS,CAAC;IACtC,CAAC,CAAC;AACJ,CAAC;AAlCD,oCAkCC;AAED,SAAS,wBAAwB,CAAC,QAAgB;IAChD,OAAO,CAAC,IAAU,EAAE,CAAmB,EAAQ,EAAE;QAC/C,OAAO,gCAAiB,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE;YACrC,KAAK,CAAC,OAAO,mCACR,KAAK,CAAC,OAAO,KAChB,CAAC,gBAAgB,QAAQ,CAAC,OAAO,EAAE,CAAC,EAAE,kEAAkE,QAAQ,CAAC,OAAO,EAAE,EAC1H,CAAC,QAAQ,QAAQ,CAAC,OAAO,EAAE,CAAC,EAAE,gCAAgC,QAAQ,CAAC,OAAO,kBAAkB,QAAQ,CAAC,OAAO,UAAU,GAC3H,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC;AAGD,6CAA6C;AAC7C,+DAA+D;AAC/D,YAAY;AACZ,wBAAwB;AACxB,uBAAuB;AACvB,qBAAqB;AACrB,qBAAqB;AACrB,0BAA0B;AAC1B,4BAA4B;AAC5B,QAAQ;AACR,IAAI;AAGJ,kDAAkD;AAClD,gCAAgC;AAChC,EAAE;AACF,yDAAyD;AACzD,EAAE;AACF,qDAAqD;AACrD,8CAA8C;AAC9C,UAAU;AACV,4EAA4E;AAC5E,EAAE;AACF,2BAA2B;AAC3B,kBAAkB;AAClB,UAAU;AACV,EAAE;AACF,2CAA2C;AAC3C,OAAO;AACP,IAAI;AAGJ,oDAAoD;AACpD,yDAAyD;AACzD,2EAA2E;AAC3E,mBAAmB;AACnB,OAAO;AACP,IAAI;AACJ,EAAE;AACF,qDAAqD;AACrD,yDAAyD;AACzD,oEAAoE;AACpE,mBAAmB;AACnB,OAAO;AACP,IAAI"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/angular-ui-powerups/schematics/bootstrap-app/index.ts"],"names":[],"mappings":"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"}

package/schematics/bootstrap-app/templates/app/app.component.html.template

@@ -0,0 +1,7 @@
+<mat-toolbar>App Home</mat-toolbar>
+<aup-place-outlet #outlet
+                  [animate]="false"
+                  [placeAnimationOrder]="places"></aup-place-outlet>
+
+
+

package/schematics/bootstrap-app/templates/app/app.component.scss.template

@@ -0,0 +1,12 @@
+/*
+ * Remove template code below
+ */
+:host {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+}
+
+aup-place-outlet {
+  flex:1
+}

package/schematics/bootstrap-app/templates/app/app.component.ts.template

@@ -0,0 +1,18 @@
+import {Component} from "@angular/core";
+import {HomeComponent} from "./places/home/home.component";
+
+@Component({
+  selector: "<%= dasherize(project)%>-root",
+  templateUrl: "./app.component.html",
+  styleUrls: ["./app.component.scss"],
+})
+export class AppComponent {
+
+  readonly places = [
+      HomeComponent
+  ];
+
+  constructor() {
+  }
+
+}

package/schematics/bootstrap-app/templates/app/app.module.ts.template

@@ -0,0 +1,84 @@
+import {DOCUMENT} from "@angular/common";
+import {HttpClientModule} from "@angular/common/http";
+import {ApplicationRef, DoBootstrap, Inject, LOCALE_ID, NgModule} from "@angular/core";
+import {FlexModule} from "@angular/flex-layout";
+import {MAT_MOMENT_DATE_FORMATS, MomentDateAdapter} from "@angular/material-moment-adapter";
+import {DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE} from "@angular/material/core";
+import {MatDialogModule} from "@angular/material/dialog";
+import {MatIconRegistry} from "@angular/material/icon";
+import {BrowserModule, DomSanitizer} from "@angular/platform-browser";
+import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
+import {
+    AngularUiPowerupsModule,
+    DIALOG_INTERACTION_SERVICE_DEFAULTS,
+    DialogInteractionContextFactory,
+    ModalInteractionContextFactory,
+    PlaceModule
+} from "@coolon/angular-ui-powerups";
+import {
+    CoolonCloudAuthModule,
+    COGNITO_CONFIGURATION,
+    OidcClientAuthService,
+    AuthService
+} from "@coolon/mars/cloud-auth";
+import {Logger} from "@coolon/pectin";
+import {setAutoFreeze} from "immer";
+import {environment} from "../environments/environment";
+import {AppRoutingModuleTs} from "./app-routing.module";
+
+import {AppComponent} from "./app.component";
+
+@NgModule({
+    declarations: [AppComponent],
+    imports: [
+        BrowserModule,
+        BrowserAnimationsModule,
+        MatDialogModule,
+        AppRoutingModuleTs,
+        PlaceModule,
+        AngularUiPowerupsModule,
+        FlexModule,
+        CoolonCloudAuthModule,
+        HttpClientModule
+    ],
+    providers: [
+        {provide: DIALOG_INTERACTION_SERVICE_DEFAULTS, useValue: {restoreFocus: true}},
+        {provide: ModalInteractionContextFactory, useClass: DialogInteractionContextFactory},
+        {provide: LOCALE_ID, useValue: 'en-AU'},
+        {provide: MAT_DATE_LOCALE, useExisting: LOCALE_ID},
+        {provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
+        {provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS},
+        {provide: COGNITO_CONFIGURATION, useValue: environment.cognito}
+    ],
+    bootstrap: [],
+})
+export class AppModule implements DoBootstrap {
+    constructor(readonly authService: AuthService,
+                @Inject(DOCUMENT) private document: any,
+                iconRegistry: MatIconRegistry,
+                domSanitizer: DomSanitizer) {
+        Logger.logToConsole();
+
+        // Immer version 7 is barfing with this error https://github.com/immerjs/immer/issues/537.
+        setAutoFreeze(false);
+
+        // iconRegistry.addSvgIcon('check_box_outline', domSanitizer.bypassSecurityTrustResourceUrl('assets/icons/check_box_outline-24px.svg'));
+    }
+
+    ngDoBootstrap(appRef: ApplicationRef): void {
+
+        this.authService
+            .init()
+            .then((authorised) => {
+                if (authorised) {
+                    this.document.body.classList.add("ready")
+                }
+                console.log('[ngDoBootstrap] cognito initialised, starting app.');
+                appRef.bootstrap(AppComponent);
+            })
+            .catch(error => {
+                this.document.body.classList.add("auth-failure")
+                console.error('[ngDoBootstrap] cognito initialisation failed', error);
+            });
+    }
+}

package/schematics/bootstrap-app/templates/app/auth/auth.module.ts.template

@@ -1,5 +1,5 @@
 import { NgModule } from '@angular/core';
-import { AuthGuard } from './auth.guard.ts.template';
+import { AuthGuard } from './auth.guard';
 
 @NgModule({
   declarations: [],

package/schematics/bootstrap-app/templates/app/places/home/home.component.spec.ts.template

@@ -1,6 +1,6 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { HomeComponent } from './home.component.ts.template';
+import { HomeComponent } from './home.component';
 
 describe('HomeComponent', () => {
   let component: HomeComponent;

package/schematics/bootstrap-app/templates/app/places/home/home.component.ts.template

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { Place, PlaceComponent } from '@coolon/angular-ui-powerups';
-import { I18n } from '../../i18n.ts.template';
+import { I18n } from '../../i18n';
 
 @Place({
   path: 'home',

package/schematics/bootstrap-app/templates/app/places/places.module.ts.template

@@ -0,0 +1,19 @@
+import {NgModule} from '@angular/core';
+import {ComponentsModule, InteractionModule} from "@coolon/angular-ui-powerups";
+import {HomeComponent} from './home/home.component';
+
+@NgModule({
+    declarations: [
+        HomeComponent
+    ],
+    imports: [
+        ComponentsModule,
+        InteractionModule
+    ],
+    providers: [],
+})
+export class PlacesModule {
+    constructor() {
+
+    }
+}

package/schematics/bootstrap-app/templates/styles/global-variables.scss.template

@@ -0,0 +1,12 @@
+
+:root {
+  --nav-bar-height: 56px;
+  --default-padding: 16px;
+
+  --pinstripe-border-color: rgba(0, 0, 0, 0.2);
+  --pinstripe-border: 1px solid var(--pinstripe-border-color);
+  --pinstripe-border-dashed: 1px dashed var(--pinstripe-border-color);
+
+  --sub-header-height: 48px;
+}
+

package/schematics/bootstrap-app/templates/styles/theme.scss.template

@@ -0,0 +1,37 @@
+@import '~@angular/material/theming';
+// Plus imports for other components in your app.
+
+// Include the common styles for Angular Material. We include this here so that you only
+// have to load a single css file for Angular Material in your app.
+// Be sure that you only ever include this mixin once!
+@include mat-core();
+
+// Define the palettes for your theme using the Material Design palettes available in palette.scss
+// (imported above). For each palette, you can optionally specify a default, lighter, and darker
+// hue. Available color palettes: https://material.io/design/color/
+$tester-app-primary: mat-palette($mat-indigo);
+$tester-app-accent:  mat-palette($mat-pink, A200, A100, A400);
+
+// The warn palette is optional (defaults to red).
+$tester-app-warn:    mat-palette($mat-red);
+
+// Create the theme object (a Sass map containing all of the palettes).
+$tester-app-theme: mat-light-theme($tester-app-primary, $tester-app-accent, $tester-app-warn);
+
+// Include theme styles for core and each component used in your app.
+// Alternatively, you can import and @include the theme mixins for each component
+// that you are using.
+@include angular-material-theme($tester-app-theme);
+
+:root {
+  --theme-primary-color: #{mat-color(map-get($tester-app-theme, primary))};
+  --theme-forground-color: #{mat-color(map-get($tester-app-theme, foreground))};
+  --theme-background-color: #{mat-color(map-get($tester-app-theme, background))};
+  --theme-warn-color: #{mat-color(map-get($tester-app-theme, warn))};
+  //--theme-warn-background-color: #{mat-color(map-get($tester-app-theme, warn))};
+  --theme-warn-background-color: #{mat-color(map-get($tester-app-theme, warn), 0.4)};
+  --theme-warn-color-default-contrast: #{mat-color(map-get($tester-app-theme, warn), default-contrast)};
+  --theme-selected-item-background-color: #{mat-color(map-get($tester-app-theme, primary), 0.15)};
+  --theme-selected-item-border-color: #{mat-color(map-get($tester-app-theme, primary), 0.6)};
+  --theme-selected-item-background-hover-color: #{mat-color(map-get($tester-app-theme, primary), 0.05)};
+}