SHIBUI-1711 Added ability to use runtime context prop

TIER · Jan 21, 2020 · 4a1f24f · 4a1f24f
1 parent f2833c8
commit 4a1f24f
Show file tree

Hide file tree

Showing 34 changed files with 166 additions and 57 deletions.
diff --git a/ui/package.json b/ui/package.json
@@ -4,7 +4,7 @@
   "license": "MIT",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --proxy-config proxy.conf.json",
+    "start": "ng serve --proxy-config proxy.conf.json --base-href /shibui/",
     "build": "ng build",
     "test": "ng test --code-coverage --source-map=true",
     "lint": "ng lint",

diff --git a/ui/proxy.conf.json b/ui/proxy.conf.json
@@ -1,22 +1,34 @@
 {
-    "/api": {
+    "/shibui/api": {
         "target": "http://localhost:8080",
         "secure": false,
-        "logLevel": "debug"
+        "logLevel": "debug",
+        "pathRewrite": {
+            "^/shibui": ""
+        }
     },
-    "/actuator": {
+    "/shibui/actuator": {
         "target": "http://localhost:8080",
         "secure": false,
-        "logLevel": "debug"
+        "logLevel": "debug",
+        "pathRewrite": {
+            "^/shibui": ""
+        }
     },
-    "/login": {
+    "/shibui/login": {
         "target": "http://localhost:8080",
         "secure": false,
-        "logLevel": "debug"
+        "logLevel": "debug",
+        "pathRewrite": {
+            "^/shibui": ""
+        }
     },
-    "/logout": {
+    "/shibui/logout": {
         "target": "http://localhost:8080",
         "secure": false,
-        "logLevel": "debug"
+        "logLevel": "debug",
+        "pathRewrite": {
+            "^/shibui": ""
+        }
     }
 }
diff --git a/ui/src/app/admin/service/admin.service.spec.ts b/ui/src/app/admin/service/admin.service.spec.ts
@@ -3,6 +3,7 @@ import { AdminService } from './admin.service';
 import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
 import { HttpRequest, HttpClientModule } from '@angular/common/http';
 import { Admin } from '../model/admin';
+import API_BASE_PATH from '../../app.constant';
 
 let users = <Admin[]>[
     {
@@ -43,7 +44,7 @@ describe('Admin Service', () => {
                 service.query().subscribe();
 
                 backend.expectOne((req: HttpRequest<any>) => {
-                    return req.url === '/api/admin/users'
+                    return req.url === `${API_BASE_PATH}/admin/users`
                         && req.method === 'GET';
                 }, `GET admin collection`);
             }
@@ -55,7 +56,7 @@ describe('Admin Service', () => {
                 service.update({...users[0]}).subscribe();
 
                 backend.expectOne((req: HttpRequest<any>) => {
-                    return req.url === '/api/admin/users/abc'
+                    return req.url === `${API_BASE_PATH}/admin/users/abc`
                         && req.method === 'PATCH';
                 }, `PATCH admin user`);
             }
@@ -67,7 +68,7 @@ describe('Admin Service', () => {
                 service.remove(users[0].username).subscribe();
 
                 backend.expectOne((req: HttpRequest<any>) => {
-                    return req.url === '/api/admin/users/abc'
+                    return req.url === `${API_BASE_PATH}/admin/users/abc`
                         && req.method === 'DELETE';
                 }, `DELETE admin user`);
             }

diff --git a/ui/src/app/admin/service/admin.service.ts b/ui/src/app/admin/service/admin.service.ts
@@ -4,11 +4,13 @@ import { Admin } from '../model/admin';
 import { HttpClient } from '@angular/common/http';
 import { map, catchError } from 'rxjs/operators';
 
+import API_BASE_PATH from '../../app.constant';
+
 @Injectable()
 export class AdminService {
 
     private endpoint = '/admin/users';
-    private base = '/api';
+    private base = API_BASE_PATH;
 
     constructor(
         private http: HttpClient

diff --git a/ui/src/app/app.brand.ts b/ui/src/app/app.brand.ts
@@ -6,9 +6,9 @@ export const brand: Brand = {
         title: 'brand.header.title'
     },
     logo: {
-        default: '/assets/shibboleth_logowordmark_color.png',
-        small: '/assets/shibboleth_icon_color_130x130.png',
-        large: '/assets/shibboleth_logowordmark_color.png',
+        default: 'assets/shibboleth_logowordmark_color.png',
+        small: 'assets/shibboleth_icon_color_130x130.png',
+        large: 'assets/shibboleth_logowordmark_color.png',
         alt: 'brand.logo-alt',
         link: {
             label: 'brand.logo-link-label', // shibboleth

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
@@ -84,11 +84,11 @@
             <div class="d-flex align-items-end justify-content-end p-2">
                 <translate-i18n key="brand.in-partnership-with" class="flex-item mr-2">In partnership with</translate-i18n>&nbsp;
                 <a href="https://www.unicon.net" target="_blank" title="Unicon" class="flex-item">
-                    <img src="/assets/logo_unicon.png" class="img-fluid float-right" alt="Unicon Logo">
+                    <img src="assets/logo_unicon.png" class="img-fluid float-right" alt="Unicon Logo">
                 </a>
                 &nbsp;<translate-i18n key="brand.and" class="flex-item mx-2">and</translate-i18n>&nbsp;
                 <a href="https://www.internet2.edu/" target="_blank" title="Internet 2" class="flex-item">
-                    <img src="/assets/logo_internet2.png" class="img-fluid float-right" alt="Internet 2 Logo">
+                    <img src="assets/logo_internet2.png" class="img-fluid float-right" alt="Internet 2 Logo">
                 </a>
             </div>
         </div>

diff --git a/ui/src/app/app.constant.ts b/ui/src/app/app.constant.ts
@@ -0,0 +1,2 @@
+export const API_BASE_PATH = 'api';
+export default API_BASE_PATH;
diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts
@@ -1,6 +1,6 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
-import { StoreModule, Store } from '@ngrx/store';
+import { StoreModule } from '@ngrx/store';
 import { EffectsModule } from '@ngrx/effects';
 import { StoreDevtoolsModule } from '@ngrx/store-devtools';
 import { StoreRouterConnectingModule, RouterStateSerializer } from '@ngrx/router-store';
@@ -24,6 +24,8 @@ import { WizardModule } from './wizard/wizard.module';
 import { FormModule } from './schema-form/schema-form.module';
 import { environment } from '../environments/environment.prod';
 import { I18nModule } from './i18n/i18n.module';
+import { ApiPathInterceptor } from './core/service/api-path.interceptor';
+import { APP_BASE_HREF } from '@angular/common';
 
 @NgModule({
     declarations: [
@@ -63,7 +65,17 @@ import { I18nModule } from './i18n/i18n.module';
         AppRoutingModule
     ],
     providers: [
-        { provide: RouterStateSerializer, useClass: CustomRouterStateSerializer },
+        {
+            provide: APP_BASE_HREF,
+            useFactory: () => {
+                const url = new URL(document.getElementsByTagName('base')[0].href);
+                return url.pathname;
+            }
+        },
+        {
+            provide: RouterStateSerializer,
+            useClass: CustomRouterStateSerializer
+        },
         {
             provide: HTTP_INTERCEPTORS,
             useClass: AuthorizedInterceptor,
@@ -73,6 +85,11 @@ import { I18nModule } from './i18n/i18n.module';
             provide: HTTP_INTERCEPTORS,
             useClass: ErrorInterceptor,
             multi: true
+        },
+        {
+            provide: HTTP_INTERCEPTORS,
+            useClass: ApiPathInterceptor,
+            multi: true
         }
     ],
     bootstrap: [AppComponent]

diff --git a/ui/src/app/core/effect/version.effect.ts b/ui/src/app/core/effect/version.effect.ts
@@ -13,7 +13,7 @@ import { VersionInfo } from '../model/version';
 export class VersionEffects {
 
     private endpoint = '/info';
-    private base = '/actuator';
+    private base = 'actuator';
 
     @Effect()
     loadVersionInfo$ = this.actions$

diff --git a/ui/src/app/core/service/api-path.interceptor.spec.ts b/ui/src/app/core/service/api-path.interceptor.spec.ts
@@ -0,0 +1,41 @@
+import { TestBed, async, inject } from '@angular/core/testing';
+import { HTTP_INTERCEPTORS, HttpClientModule, HttpClient, HttpRequest } from '@angular/common/http';
+import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
+
+import { ApiPathInterceptor } from './api-path.interceptor';
+import { APP_BASE_HREF } from '@angular/common';
+
+describe('API Path Interceptor Service', () => {
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [
+                HttpClientModule,
+                HttpClientTestingModule
+            ],
+            providers: [
+                {
+                    provide: APP_BASE_HREF,
+                    useValue: '/shibui/'
+                },
+                {
+                    provide: HTTP_INTERCEPTORS,
+                    useClass: ApiPathInterceptor,
+                    multi: true
+                }
+            ]
+        });
+    });
+
+    describe('query', () => {
+        it(`should send an expected query request`, async(inject([HttpClient, HttpTestingController],
+            (service: HttpClient, backend: HttpTestingController) => {
+                service.get('foo').subscribe();
+
+                backend.expectOne((req: HttpRequest<any>) => {
+                    return req.url === '/shibui/foo'
+                        && req.method === 'GET';
+                }, `GET collection`);
+            }
+        )));
+    });
+});
diff --git a/ui/src/app/core/service/api-path.interceptor.ts b/ui/src/app/core/service/api-path.interceptor.ts
@@ -0,0 +1,16 @@
+import { Injectable, Inject } from '@angular/core';
+import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { APP_BASE_HREF } from '@angular/common';
+
+@Injectable()
+export class ApiPathInterceptor implements HttpInterceptor {
+    constructor(
+        @Inject(APP_BASE_HREF) private baseHref: string
+    ) {}
+    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+        const apiReq = req.clone({ url: `${this.baseHref}${req.url}` });
+        console.log(req);
+        return next.handle(apiReq);
+    }
+}
diff --git a/ui/src/app/core/service/user.service.ts b/ui/src/app/core/service/user.service.ts
@@ -2,12 +2,12 @@ import { Injectable } from '@angular/core';
 import { Observable, of } from 'rxjs';
 import { User } from '../model/user';
 import { HttpClient } from '@angular/common/http';
-import { catchError, map } from 'rxjs/operators';
+import { API_BASE_PATH } from '../../app.constant';
 
 @Injectable()
 export class UserService {
 
-    readonly base = `/api`;
+    readonly base = API_BASE_PATH;
 
     constructor(
         private http: HttpClient

diff --git a/ui/src/app/i18n/service/i18n.service.ts b/ui/src/app/i18n/service/i18n.service.ts
@@ -4,12 +4,13 @@ import { HttpClient, HttpParams } from '@angular/common/http';
 import { NavigatorService } from '../../core/service/navigator.service';
 import { getCurrentLanguage, getCurrentLocale } from '../../shared/util';
 import { Messages } from '../model/Messages';
+import API_BASE_PATH from '../../app.constant';
 
 @Injectable()
 export class I18nService {
 
     readonly path = '/messages';
-    readonly base = '/api';
+    readonly base = API_BASE_PATH;
 
     constructor(
         private http: HttpClient,

diff --git a/ui/src/app/metadata/configuration/container/configuration.component.ts b/ui/src/app/metadata/configuration/container/configuration.component.ts
@@ -25,7 +25,6 @@ export class ConfigurationComponent implements OnDestroy {
         private store: Store<fromConfiguration.ConfigurationState>,
         private routerState: ActivatedRoute
     ) {
-
         this.routerState.params.pipe(
             takeUntil(this.ngUnsubscribe),
             map(({ id, type, version }) => new SetMetadata({

diff --git a/ui/src/app/metadata/configuration/container/metadata-options.component.ts b/ui/src/app/metadata/configuration/container/metadata-options.component.ts
@@ -57,6 +57,9 @@ export class MetadataOptionsComponent implements OnDestroy {
         protected router: Router,
         protected activatedRoute: ActivatedRoute
     ) {
+
+        console.log('metadata options');
+
         this.model$
             .pipe(
                 takeUntil(this.ngUnsubscribe),

diff --git a/ui/src/app/metadata/configuration/service/history.service.ts b/ui/src/app/metadata/configuration/service/history.service.ts
@@ -7,11 +7,12 @@ import { PATHS } from '../../configuration/configuration.values';
 import { MetadataVersion } from '../model/version';
 import { map } from 'rxjs/operators';
 import { Metadata } from '../../domain/domain.type';
+import API_BASE_PATH from '../../../app.constant';
 
 @Injectable()
 export class MetadataHistoryService {
 
-    readonly base = `api`;
+    readonly base = API_BASE_PATH;
     readonly path = `Versions`;
 
     constructor(
@@ -34,9 +35,9 @@ export class MetadataHistoryService {
 
     getVersion(resourceId: string, type: string, versionId: string = null): Observable<Metadata> {
         const api = versionId ?
-            `/${this.base}/${PATHS[type]}/${resourceId}/${this.path}/${versionId}`
+            `${this.base}/${PATHS[type]}/${resourceId}/${this.path}/${versionId}`
             :
-            `/${this.base}/${PATHS[type]}/${resourceId}`;
+            `${this.base}/${PATHS[type]}/${resourceId}`;
         return this.http.get<Metadata>(api);
     }
 

diff --git a/ui/src/app/metadata/domain/model/wizards/metadata-source-editor.ts b/ui/src/app/metadata/domain/model/wizards/metadata-source-editor.ts
@@ -1,9 +1,10 @@
 import { Wizard, WizardStep } from '../../../../wizard/model';
 import { MetadataResolver } from '../metadata-resolver';
 import { MetadataSourceBase } from './metadata-source-base';
+import API_BASE_PATH from '../../../../app.constant';
 
 export class MetadataSourceEditor extends MetadataSourceBase implements Wizard<MetadataResolver> {
-    schema = '/api/ui/MetadataSources';
+    schema = `${API_BASE_PATH}/ui/MetadataSources`;
     steps: WizardStep[] = [
         {
             index: 1,

diff --git a/ui/src/app/metadata/domain/model/wizards/metadata-source-wizard.ts b/ui/src/app/metadata/domain/model/wizards/metadata-source-wizard.ts
@@ -1,9 +1,10 @@
 import { Wizard, WizardStep } from '../../../../wizard/model';
 import { MetadataResolver } from '../metadata-resolver';
 import { MetadataSourceBase } from './metadata-source-base';
+import API_BASE_PATH from '../../../../app.constant';
 
 export class MetadataSourceWizard extends MetadataSourceBase implements Wizard<MetadataResolver> {
-    schema = '/api/ui/MetadataSources';
+    schema = `${API_BASE_PATH}/ui/MetadataSources`;
     steps: WizardStep[] = [
         {
             index: 1,

diff --git a/ui/src/app/metadata/domain/service/attributes.service.ts b/ui/src/app/metadata/domain/service/attributes.service.ts
@@ -3,14 +3,15 @@ import { HttpClient } from '@angular/common/http';
 import { Observable, throwError } from 'rxjs';
 import { catchError, shareReplay, map } from 'rxjs/operators';
 import { ReleaseAttribute } from '../model/properties/release-attribute';
+import API_BASE_PATH from '../../../app.constant';
 
 const CACHE_SIZE = 1;
 
 @Injectable()
 export class AttributesService {
 
     readonly endpoint = '/customAttributes';
-    readonly base = '/api';
+    readonly base = API_BASE_PATH;
 
     private cache$: Observable<ReleaseAttribute[]>;
 

diff --git a/ui/src/app/metadata/domain/service/entity-id.service.ts b/ui/src/app/metadata/domain/service/entity-id.service.ts
@@ -6,13 +6,14 @@ import { map, catchError } from 'rxjs/operators';
 
 import { QueryParams } from '../../../core/model/query';
 import { MDUI } from '../model';
+import API_BASE_PATH from '../../../app.constant';
 
 @Injectable()
 export class EntityIdService {
 
     readonly searchEndpoint = '/EntityIds/search';
     readonly entitiesEndpoint = '/entities';
-    readonly base = '/api';
+    readonly base = API_BASE_PATH;
 
     constructor(
         private http: HttpClient

diff --git a/ui/src/app/metadata/domain/service/filter.service.ts b/ui/src/app/metadata/domain/service/filter.service.ts
@@ -3,13 +3,14 @@ import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 import { MetadataFilter } from '../../domain/model';
+import API_BASE_PATH from '../../../app.constant';
 
 @Injectable()
 export class MetadataFilterService {
 
     readonly endpoint = '/MetadataResolvers';
     readonly order = 'FiltersPositionOrder';
-    readonly base = '/api';
+    readonly base = API_BASE_PATH;
     readonly path = 'Filters';
 
     constructor(