feat(core): adding AppConfigService to support remote dynamic config

xmlking · xmlking · commit fc82a8e0023c · 2019-05-26T12:46:33.000-07:00
diff --git a/PLAYBOOK.md b/PLAYBOOK.md
@@ -249,22 +249,27 @@ ng update @nrwl/nest --next
 
 > Add `--dry-run` or `-d` option to following commands to see which artifacts will be created, without actually creating them.
 
-```bash
 
-## generate `Lazy-loaded Feature Modules` (angular framwork)
+##### generate Lazy-loaded Feature Modules
+>  with angular schematics (a.k.a. @nrwl/angular which is default in `angular.json`)
+
+```bash
 ng g lib home           --routing --lazy --prefix=ngx --parent-module=apps/webapp/src/app/app.module.ts             --defaults --tags=layout,entry-module
 ng g lib dashboard      --routing --lazy --prefix=ngx --parent-module=apps/webapp/src/app/app.module.ts             --defaults --tags=layout,entry-module
 ng g lib admin          --routing --lazy --prefix=ngx --parent-module=apps/webapp/src/app/app.module.ts             --defaults --tags=layout,entry-module
 ng g lib NotFound       --routing --lazy --prefix=ngx --parent-module=apps/webapp/src/app/app.module.ts             --defaults --tags=entry-module
 ng g lib experiments    --routing --lazy --prefix=ngx --parent-module=libs/dashboard/src/lib/dashboard.module.ts    --defaults --tags=child-module
 ng g lib widgets        --routing --lazy --prefix=ngx --parent-module=libs/dashboard/src/lib/dashboard.module.ts    --defaults --tags=child-module
 ng g lib grid           --routing --lazy --prefix=ngx --parent-module=libs/dashboard/src/lib/dashboard.module.ts    --defaults --tags=child-module
+```
 
-
-## generate shared libs (with no framwork)
+##### generate shared neutral libs
+>  with no-framework  (a.k.a. @nrwl/workspace schematics)
+```bash
 ng g @nrwl/workspace:lib Tree       --tags=utils --defaults -d 
 ng g @nrwl/workspace:lib utils      --tags=utils --defaults -d
 ng g @nrwl/workspace:lib animations --tags=utils --defaults -d
+
 # system wide `models` module
 ng g @nrwl/workspace:lib models     --tags=utils --defaults -d 
 ng g interface User  --project=models --type=model -d
@@ -281,23 +286,28 @@ ng g interface Membership  --project=models --type=model -d
 ng g interface ResourceQuota  --project=models --type=model -d
 ng g interface Project  --project=models --type=model -d
 ng g interface Cluster  --project=models --type=model -d
+```
 
-## generate shared libs (with angular framwork)
-
+#####  generate shared angular libs
+>  with angular schematics (a.k.a. @nrwl/angular which is default in `angular.json`)
+```bash
 # add `core` module which will be only inported into root/app module.
 ng g lib core --tags=core-module --defaults -d
 # add  global services for `core` Module
-ng g service services/InMemoryData   --project=core   --skip-tests -d
-ng g service services/PageTitle      --project=core   -d
-ng g service services/ServiceWorker  --project=core   -d
-ng g service services/MediaQuery     --project=core   -d
-ng g service services/DeepLink       --project=core   -d
-ng g service services/Feature        --project=core   -d
-ng g service services/GoogleAnalytics --project=core  -d
-ng g service  PushNotification        --project=core  -d
-ng g service  services/Profile        --project=core  --skip-tests -d
-ng g @ngxs/schematics:state --name=preference --spec=false --project=core --sourceRoot=libs/core/src/lib -d
-ng g @ngxs/schematics:state --name=profile --spec=false --project=core --sourceRoot=libs/core/src/lib -d
+
+ng g service services/PageTitle       --project=core   -d
+ng g service services/ServiceWorker   --project=core   -d
+ng g service services/MediaQuery      --project=core   -d
+ng g service services/DeepLink        --project=core   -d
+ng g service services/Feature         --project=core   -d
+ng g service services/GoogleAnalytics --project=core   -d
+ng g service  PushNotification        --project=core   -d
+ng g service services/InMemoryData    --project=core   --skip-tests -d
+ng g service  services/Profile        --project=core   --skip-tests -d
+ng g service  services/hammer         --project=core   --skip-tests --type=config -d
+ng g service  services/AppConfig      --project=core   --skip-tests -d
+ng g @ngxs/schematics:state state/preference --spec=false --sourceRoot=libs/core/src/lib --project=core -d
+ng g @ngxs/schematics:state profile --path=state --spec=false --sourceRoot=libs/core/src/lib --project=core -d
 
 # add `shared` module which will encapsulate angular and 3rd party modules, needed for all `Lazy-loaded Feature Modules`
 ng g lib shared --prefix=ngx --tags=shared-module --defaults -d
@@ -503,8 +513,8 @@ ng g component containers/virtualScroll         --project=experiments -d
 ng g component containers/StickyTable           --project=experiments -d
 ng g component containers/clapButton            --project=experiments -s  -t --skip-tests  -d
 ng g component containers/knobDemo              --project=experiments -d
-ng g component containers/ledDemo               --project=experiments  -d
-ng g component containers/ImageComp             --project=experiments  -d
+ng g component containers/ledDemo               --project=experiments -d
+ng g component containers/ImageComp             --project=experiments -d
 ng g component containers/layout                --project=experiments -d
 ng g component containers/dashing               --project=experiments -d
 ng g component components/card                  --project=experiments -d
diff --git a/apps/webapp/ngsw-config.json b/apps/webapp/ngsw-config.json
@@ -45,9 +45,9 @@
     {
       "name": "keycloak",
       "urls": [
-        "https://keycloak-ngx1.1d35.starter-us-east-1.openshiftapps.com/auth/realms/ngx/.well-known/openid-configuration",
-        "https://keycloak-ngx1.1d35.starter-us-east-1.openshiftapps.com/auth/realms/ngx/protocol/openid-connect/certs",
-        "https://keycloak-ngx1.1d35.starter-us-east-1.openshiftapps.com/auth/realms/ngx/protocol/openid-connect/login-status-iframe.html"
+        "https://keycloak-ngx.apps.us-west-1.online-starter.openshift.com/auth/realms/ngx/.well-known/openid-configuration",
+        "https://keycloak-ngx.apps.us-west-1.online-starter.openshift.com/auth/realms/ngx/protocol/openid-connect/certs",
+        "https://keycloak-ngx.apps.us-west-1.online-starter.openshift.com/auth/realms/ngx/protocol/openid-connect/login-status-iframe.html"
       ],
       "cacheConfig": {
         "strategy": "performance",
diff --git a/apps/webapp/src/app/app.module.ts b/apps/webapp/src/app/app.module.ts
@@ -1,6 +1,5 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
-import { HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
 import { AppComponent } from './app.component';
 import { RouterModule } from '@angular/router';
 import { ServiceWorkerModule } from '@angular/service-worker';
@@ -9,7 +8,6 @@ import { QuicklinkModule, QuicklinkStrategy } from '@xmlking/ngx-quicklink';
 import { CoreModule } from '@ngx-starter-kit/core';
 
 import { environment } from '@env/environment';
-import { HammerConfig } from './hammer.config';
 
 @NgModule({
   imports: [
@@ -54,12 +52,6 @@ import { HammerConfig } from './hammer.config';
     ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }),
     CoreModule, // IMP: Please keep CoreModule after RouterModule
   ],
-  providers: [
-    {
-      provide: HAMMER_GESTURE_CONFIG,
-      useClass: HammerConfig,
-    },
-  ],
   declarations: [AppComponent],
   bootstrap: [AppComponent],
 })
diff --git a/apps/webapp/src/assets/data/ui-config.json b/apps/webapp/src/assets/data/ui-config.json
@@ -0,0 +1,3 @@
+{
+  "DOCS_BASE_URL": "http://sumo.com/docs"
+}
diff --git a/apps/webapp/src/environments/environment.mock.ts b/apps/webapp/src/environments/environment.mock.ts
@@ -6,6 +6,7 @@ export const environment: IEnvironment = {
   production: true,
   envName: 'mock',
 
+  REMOTE_CONFIG_URL: '/assets/data/ui-config.json',
   DOCS_BASE_URL: 'http://localhost:8000',
   API_BASE_URL: 'http://localhost:3000/api',
   WS_EVENT_BUS_URL: 'ws://localhost:3000/eventbus',
diff --git a/apps/webapp/src/environments/environment.prod.ts b/apps/webapp/src/environments/environment.prod.ts
@@ -6,6 +6,7 @@ export const environment: IEnvironment = {
   production: true,
   envName: 'prod',
 
+  REMOTE_CONFIG_URL: '/assets/data/ui-config.json',
   DOCS_BASE_URL: 'http://localhost:8000',
   API_BASE_URL: 'https://ngxapi.traefik.k8s/api',
   WS_EVENT_BUS_URL: 'wss://ngxapi.traefik.k8s/eventbus',
diff --git a/apps/webapp/src/environments/environment.ts b/apps/webapp/src/environments/environment.ts
@@ -9,6 +9,7 @@ export const environment: IEnvironment = {
   production: false,
   envName: 'dev',
 
+  REMOTE_CONFIG_URL: '/assets/data/ui-config.json',
   DOCS_BASE_URL: 'http://localhost:8000',
   API_BASE_URL: 'http://localhost:3000/api',
   WS_EVENT_BUS_URL: 'ws://localhost:3000/eventbus',
diff --git a/apps/webapp/src/environments/ienvironment.ts b/apps/webapp/src/environments/ienvironment.ts
@@ -5,6 +5,7 @@ export type LogLevel = 'debug' | 'info' | 'warn' | 'error';
 export interface IEnvironment {
   production: boolean;
   envName: string;
+  REMOTE_CONFIG_URL: string;
 
   // Enables use of ng.profiler.timeChangeDetection(); in browser console
   enableDebugTools?: boolean;
diff --git a/libs/chat-box/src/lib/services/dialogflow.service.ts b/libs/chat-box/src/lib/services/dialogflow.service.ts
@@ -22,7 +22,7 @@ export class DialogflowService {
 
   public getResponse(query: string): Observable<Dialogflow> {
     const data = {
-      query: query,
+      query,
       lang: 'en',
       sessionId: this.sessionId,
     };
diff --git a/libs/core/src/index.ts b/libs/core/src/index.ts
@@ -4,6 +4,7 @@ export * from './lib/state/app.state';
 export * from './lib/state/profile.state';
 export { PageTitleService } from './lib/services/page-title.service';
 export { ProfileService } from './lib/services/profile.service';
+export { AppConfigService } from './lib/services/app-config.service';
 export { ServiceWorkerService } from './lib/services/service-worker.service';
 export { MediaQueryService } from './lib/services/media-query.service';
 export { DeepLinkService } from './lib/services/deep-link.service';
diff --git a/libs/core/src/lib/core.module.ts b/libs/core/src/lib/core.module.ts
@@ -21,10 +21,14 @@ import { MenuState, NavigatorModule } from '@ngx-starter-kit/navigator';
 import { NgxsWebsocketPluginModule } from '@ngx-starter-kit/socketio-plugin';
 import { environment } from '@env/environment';
 
+import { GoogleAnalyticsService } from './services/google-analytics.service';
 import { InMemoryDataService } from './services/in-memory-data.service';
+import { AppConfigService } from './services/app-config.service';
 import { ErrorInterceptor } from './interceptors/error.interceptor';
 import { CustomRouterStateSerializer } from './state/custom-router-state.serializer';
 import { _window, WINDOW } from './services/window.token';
+import { HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
+import { HammerConfig } from './services/hammer.config';
 
 import { defaultMenu } from './menu-data';
 
@@ -35,7 +39,15 @@ import { ProfileState } from './state/profile.state';
 import { AppHandler } from './state/app.handler';
 import { RouteHandler } from './state/route.handler';
 import { EventBusHandler } from './state/eventbus.handler';
-import { GoogleAnalyticsService } from './services/google-analytics.service';
+
+
+
+// appConfig initializer factory function
+const appConfigInitializerFn = (appConfig: AppConfigService) => {
+  return () => {
+    return appConfig.load();
+  };
+};
 
 // Noop handler for factory function
 export function noop() {
@@ -104,12 +116,22 @@ library.add(faTwitter, faGithub, faGoogle);
       useClass: ErrorInterceptor,
       multi: true,
     },
+    {
+      provide: APP_INITIALIZER,
+      useFactory: appConfigInitializerFn,
+      deps: [AppConfigService],
+      multi: true,
+    },
     {
       provide: APP_INITIALIZER,
       useFactory: noop,
       deps: [EventBusHandler, RouteHandler],
       multi: true,
     },
+    {
+      provide: HAMMER_GESTURE_CONFIG,
+      useClass: HammerConfig,
+    },
     {
       provide: RouterStateSerializer,
       useClass: CustomRouterStateSerializer,
diff --git a/libs/core/src/lib/services/app-config.service.ts b/libs/core/src/lib/services/app-config.service.ts
@@ -0,0 +1,27 @@
+import { Injectable } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { environment } from '@env/environment';
+import { IEnvironment } from '@env/ienvironment';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class AppConfigService {
+  private configUrl = environment.REMOTE_CONFIG_URL;
+  private configPrivate = environment;
+
+  constructor(private http: HttpClient) {}
+
+  async load(configUrl = this.configUrl) {
+    try {
+      const remoteConfig = await this.http.get<IEnvironment>(configUrl).toPromise();
+      this.configPrivate = { ...environment, ...remoteConfig };
+    } catch {
+      console.error(`Unable to load remote config url ${configUrl}`);
+    }
+  }
+  get config() {
+    return this.configPrivate;
+  }
+
+}
diff --git a/libs/core/src/lib/services/hammer.config.ts b/libs/core/src/lib/services/hammer.config.ts
diff --git a/libs/core/src/lib/state/profile.state.spec.ts b/libs/core/src/lib/state/profile.state.spec.ts
@@ -0,0 +1,25 @@
+import { TestBed, async } from '@angular/core/testing';
+import { NgxsModule, Store } from '@ngxs/store';
+import { ProfileState, ProfileStateModel } from './profile.state';
+
+describe('Profile state', () => {
+    let store: Store;
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            imports: [NgxsModule.forRoot([ProfileState])]
+        }).compileComponents();
+        store = TestBed.get(Store);
+    }));
+
+    it('should create an empty state', () => {
+        const actual = store.selectSnapshot(ProfileState.getState);
+        const expected: ProfileStateModel = {
+          profile: undefined,
+          error: undefined,
+          loading: false,
+          progress: undefined,
+        };
+        expect(actual).toEqual(expected);
+    });
+
+});

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "DOCS_BASE_URL": "http://sumo.com/docs"`
	`3`	`+}`