MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Added tenant css configuration on login pipeline after principal/me

This commit is contained in:
Diamantis Tziotzios 2024-06-19 18:57:52 +03:00
parent 02a60a35b4
commit 0174981a70
5 changed files with 41 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
dmp-frontend/src/app/app.component.html
View File

@ -10,17 +10,6 @@
</div>
</mat-sidenav-content>
</mat-sidenav-container>
<!-- <div class="sidebar sidebar-shadow" data-color="danger" data-background-color="white" data-image="./assets/images/logan-troxell-9187-unsplash.jpg">
<app-sidebar></app-sidebar>
<div class="sidebar-background" style="background-image: url(./assets/images/logan-troxell-9187-unsplash.jpg)">
</div>
</div>
<div class="main-panel">
<app-navbar></app-navbar>
<div>
<router-outlet (activate)='onActivate($event)' (deactivate)='onDeactivate($event)'></router-outlet>
</div>
</div> -->
</div>
<app-notification *ngIf="!showOnlyRouterOutlet"></app-notification>
<router-outlet *ngIf="showOnlyRouterOutlet"></router-outlet>

30
dmp-frontend/src/app/app.component.ts
View File

@ -23,6 +23,7 @@ import { SideNavService } from './core/services/sidenav/side-nav.sevice';
import { TenantConfigurationService } from './core/services/tenant-configuration/tenant-configuration.service';
import { TimezoneService } from './core/services/timezone/timezone-service';
import { BreadcrumbService } from './ui/misc/breadcrumb/breadcrumb.service';
import { TenantHandlingService } from './core/services/tenant/tenant-handling.service';
declare const gapi: any;
@ -41,6 +42,7 @@ export class AppComponent implements OnInit, AfterViewInit {
helpContentEnabled: boolean;
private statusChangeSubscription: Subscription;
showOnlyRouterOutlet = false;
cssConfigLoaded = false;
@ViewChild('sidenav') sidenav: MatSidenav;
@ -58,7 +60,7 @@ export class AppComponent implements OnInit, AfterViewInit {
private language: LanguageService,
private configurationService: ConfigurationService,
private matomoService: MatomoService,
private tenantConfigurationService: TenantConfigurationService,
private tenantHandlingService: TenantHandlingService,
private sidenavService: SideNavService,
private breadcrumbService: BreadcrumbService
) {
@ -260,33 +262,9 @@ export class AppComponent implements OnInit, AfterViewInit {
this.authentication.getAuthenticationStateObservable().subscribe(authenticationState => {
if (authenticationState.loginStatus === LoginStatus.LoggedIn) {
this.loadCssColors();
this.tenantHandlingService.loadAndApplyTenantCssColors();
}
});
this.loadCssColors();
}
private loadCssColors() {
if (this.authentication.currentAccountIsAuthenticated() && this.authentication.selectedTenant()) {
this.tenantConfigurationService.getCurrentTenantType(TenantConfigurationType.CssColors, [
nameof<TenantConfiguration>(x => x.type),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor2)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor3)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.secondaryColor)].join('.'),
])
.pipe(map(data => data as TenantConfiguration))
.subscribe(
data => {
if (data?.cssColors) {
if (data.cssColors.primaryColor) document.documentElement.style.setProperty(`--primary-color`, data.cssColors.primaryColor);
if (data.cssColors.primaryColor2) document.documentElement.style.setProperty(`--primary-color-2`, data.cssColors.primaryColor2);
if (data.cssColors.primaryColor3) document.documentElement.style.setProperty(`--primary-color-3`, data.cssColors.primaryColor3);
if (data.cssColors.secondaryColor) document.documentElement.style.setProperty(`--secondary-color`, data.cssColors.secondaryColor);
}
},
);
}
}
toggleNavbar(event) {

2
dmp-frontend/src/app/core/services/auth/auth.service.ts
View File

@ -173,9 +173,11 @@ export class AuthService extends BaseService {
exhaustMap(() => forkJoin([
this.accessToken ? this.ensureTenant(tenantCode ?? this.selectedTenant() ?? 'default') : of(false),
this.accessToken ? this.principalService.me(httpParams) : of(null),
this.accessToken ? this.tenantHandlingService.loadTenantCssColors() : of(null),
])),
map((item) => {
this.currentAccount(item[1]);
this.tenantHandlingService.applyTenantCssColors(item[2]);
return true;
})
);

37
dmp-frontend/src/app/core/services/tenant/tenant-handling.service.ts
View File

@ -1,16 +1,24 @@
import { DOCUMENT, LocationStrategy } from '@angular/common';
import { Inject, Injectable } from '@angular/core';
import { PRIMARY_OUTLET, Router, UrlSegment, UrlSegmentGroup, UrlSerializer, UrlTree } from '@angular/router';
import { TenantConfigurationType } from '@app/core/common/enum/tenant-configuration-type';
import { CssColorsTenantConfiguration, TenantConfiguration } from '@app/core/model/tenant-configuaration/tenant-configuration';
import { BaseService } from '@common/base/base.service';
import { Observable, takeUntil } from 'rxjs';
import { nameof } from 'ts-simple-nameof';
import { TenantConfigurationService } from '../tenant-configuration/tenant-configuration.service';
@Injectable()
export class TenantHandlingService {
export class TenantHandlingService extends BaseService {
constructor(
@Inject(DOCUMENT) private readonly document: Document,
private readonly locationStrategy: LocationStrategy,
private readonly router: Router,
private urlSerializer: UrlSerializer
private urlSerializer: UrlSerializer,
private tenantConfigurationService: TenantConfigurationService
) {
super();
}
extractTenantCodeFromUrlPath(path: string): string {
@ -56,4 +64,29 @@ export class TenantHandlingService {
getBaseUrl(): string {
return this.document.location.origin + this.locationStrategy.getBaseHref();
}
public loadAndApplyTenantCssColors() {
this.loadTenantCssColors().pipe(takeUntil(this._destroyed)).subscribe(x => this.applyTenantCssColors(x))
}
public loadTenantCssColors(): Observable<TenantConfiguration> {
return this.tenantConfigurationService.getCurrentTenantType(TenantConfigurationType.CssColors, [
nameof<TenantConfiguration>(x => x.type),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor2)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.primaryColor3)].join('.'),
[nameof<TenantConfiguration>(x => x.cssColors), nameof<CssColorsTenantConfiguration>(x => x.secondaryColor)].join('.'),
]);
}
public applyTenantCssColors(data: TenantConfiguration) {
if (data?.cssColors) {
if (data.cssColors.primaryColor) document.documentElement.style.setProperty(`--primary-color`, data.cssColors.primaryColor);
if (data.cssColors.primaryColor2) document.documentElement.style.setProperty(`--primary-color-2`, data.cssColors.primaryColor2);
if (data.cssColors.primaryColor3) document.documentElement.style.setProperty(`--primary-color-3`, data.cssColors.primaryColor3);
if (data.cssColors.secondaryColor) document.documentElement.style.setProperty(`--secondary-color`, data.cssColors.secondaryColor);
}
}
}

1
dmp-frontend/src/assets/config/config.json
View File

@ -52,7 +52,6 @@
"lockInterval": 60000,
"guideAssets": "assets/images/guide",
"allowOrganizationCreator": true,
"useSplash": false,
"orcidPath": "https://orcid.org/",
"maxFileSizeInMB": 10,
"authProviders": {