made sidebar's footer-items configurable

dmp-frontend/src/app/ui/sidebar/sidebar-footer/sidebar-footer.component.html

@@ -1,45 +1,9 @@
 <div class="sidebar-footer col-12">
-	<div class="row ml-2">
-		<div class="col-auto">
-			<p class="option" (click)="navigate()" [ngClass]="{'option-active': this.router.url === '/about'}">
-				{{'FOOTER.ABOUT' | translate}}</p>
-		</div>
-		<div class="col-auto ml-3">
-			<p class="option" [routerLink]="routerUtils.generateUrl('/terms-and-conditions')" [routerLinkActive]="['option-active']">
-				{{'FOOTER.TERMS-OF-SERVICE' | translate}}</p>
-		</div>
-	</div>
 
-	<div class="row ml-2">
+	<div *ngFor="let footerItems of nestedFooterItems" class="row ml-2">
-		<div class="col-auto">
+		<div *ngFor="let item of footerItems; let index = index;" class="col-auto" [ngClass]="{'ml-3': index%2==1}">
-			<p class="option" [routerLink]="routerUtils.generateUrl('/glossary')" [routerLinkActive]="['option-active']">
+			<p class="option" [ngClass]="{'option-active': this.router.url === item.routerPath}" [routerLink]="routerUtils.generateUrl(item.routerPath)">
-				{{'FOOTER.GLOSSARY' | translate}}</p>
+				{{ item.title | translate}}</p>
-			<!-- <p class="option" (click)="openGlossaryDialog()" [ngClass]="{'option-active': this.router.url === '/glossary'}">
+		</div>
-				{{'FOOTER.GLOSSARY' | translate}}</p> -->
-		</div>
-		<div class="col-auto">
-			<p class="option" [routerLink]="routerUtils.generateUrl('/user-guide')" [routerLinkActive]="['option-active']">
-				{{'FOOTER.GUIDE' | translate}}</p>
-			<!-- <p class="option" (click)="openUserGuideDialog()" [ngClass]="{'option-active': this.router.url === '/user-guide'}">
-										{{'FOOTER.GUIDE' | translate}}</p> -->
-		</div>
-
-		<!-- <div class="col-6 text-center">
-			<p class="option" (click)="openFaqDialog()" [ngClass]="{'option-active': this.router.url === '/faq'}">
-				{{'FOOTER.FAQ' | translate}}</p>
-		</div> -->
-	</div>
-	<div class="row ml-2">
-		<div *ngIf="isAuthenticated()" class="col-auto">
-			<p class="option" [routerLink]="routerUtils.generateUrl('/contact-support')" [routerLinkActive]="['option-active']">
-				{{'FOOTER.CONTACT-SUPPORT' | translate}}</p>
-			<!-- <p class="option" (click)="openContactDialog()" [ngClass]="{'option-active': this.router.url === '/contact-support'}">
-								{{'FOOTER.CONTACT-SUPPORT' | translate}}</p> -->
-		</div>
-		<!-- <div class="col-auto text-center">
-			<a class="option" [routerLink]="['/privacy-policy']" [routerLinkActive]="['option-active']">
-				<i class="fa fa-user-secret pr-2 pt-1"></i>
-				{{'FOOTER.PRIVACY-POLICY' | translate}}</a>
-		</div> -->
 	</div>
 </div>

dmp-frontend/src/app/ui/sidebar/sidebar-footer/sidebar-footer.component.ts

@@ -15,10 +15,12 @@ import { TranslateService } from '@ngx-translate/core';
 import { takeUntil } from 'rxjs/operators';
 import { AuthService } from "@app/core/services/auth/auth.service";
 import { UserGuideDialogComponent } from '@app/ui/user-guide/dialog/user-guide-dialog.component';
-import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { HttpErrorResponse } from '@angular/common/http';
 import { AnalyticsService } from '@app/core/services/matomo/analytics-service';
 import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/http-error-handling.service';
 import { RouterUtilsService } from '@app/core/services/router/router-utils.service';
+import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
+import { AccessLevel, SidebarItem } from '@app/core/model/configuration-models/sidebar.model';
 
 @Component({
 	selector: 'app-sidebar-footer',
@@ -27,6 +29,7 @@ import { RouterUtilsService } from '@app/core/services/router/router-utils.servi
 })
 export class SidebarFooterComponent extends BaseComponent implements OnInit {
 
+	nestedFooterItems: SidebarItem[][];
 	private contactEmailFormModel: ContactEmailFormModel;
 	private formGroup: UntypedFormGroup;
 
@@ -39,9 +42,9 @@ export class SidebarFooterComponent extends BaseComponent implements OnInit {
 		private uiNotificationService: UiNotificationService,
 		private formService: FormService,
 		private authentication: AuthService,
-		private httpClient: HttpClient,
 		private analyticsService: AnalyticsService,
-		private httpErrorHandlingService: HttpErrorHandlingService
+		private httpErrorHandlingService: HttpErrorHandlingService,
+		private configurationService: ConfigurationService,
 	) {
 		super();
 	}
@@ -49,6 +52,17 @@ export class SidebarFooterComponent extends BaseComponent implements OnInit {
 	ngOnInit() {
 		this.analyticsService.trackPageView(AnalyticsService.SidebarFooter);
 
+		const flattenedFooterItems = this.configurationService.sidebar?.footerItems ?? [];
+
+		this.nestedFooterItems = flattenedFooterItems.reduce((prev, current, index) => {
+			if (current.accessLevel == AccessLevel.Authenticated && !this.isAuthenticated()) return prev;
+			if (current.accessLevel == AccessLevel.Unauthenticated && this.isAuthenticated()) return prev;
+
+			if (index%2==0) prev.push([current]);
+			else prev[prev.length-1].push(current);
+			return prev;
+		}, []);
+
 		this.contactEmailFormModel = new ContactEmailFormModel();
 		this.formGroup = this.contactEmailFormModel.buildForm();
 	}