Feat/social consent

src/app/api-connector/news.service.ts

@@ -2,6 +2,7 @@ import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable, of } from 'rxjs';
 import { map, catchError } from 'rxjs/operators';
+import { SocialConsent } from 'app/shared/shared_modules/testimonial-forms/social-consent.model';
 import { ApiSettings } from './api-settings.service';
 import { FacilityNews } from '../facility_manager/newsmanagement/facility-news';
 import { News } from '../news/news.model';
@@ -94,6 +95,15 @@ export class NewsService {
 		});
 	}
 
+	getPossibleSocialConsents(): Observable<any> {
+		const params: HttpParams = new HttpParams();
+
+		return this.http.get<any>(`${ApiSettings.getApiBaseURL()}wagtail-management/testimonial/social_consents/`, {
+			params,
+			withCredentials: true,
+		});
+	}
+
 	sendTestimonialDraft(
 		title: string,
 		text: string,
@@ -104,8 +114,12 @@ export class NewsService {
 		simple_vm: boolean,
 		image_url: string,
 		project_application_id: string,
+		soc_consents: SocialConsent[],
 		file: File,
 	): Observable<any> {
+		const consents_list = soc_consents.map(soc => soc.id);
+		const consents = JSON.stringify(consents_list);
+
 		const formData: FormData = new FormData();
 		formData.append('file', file);
 		formData.append('title', title);
@@ -116,6 +130,7 @@ export class NewsService {
 		formData.append('workgroup', workgroup);
 		formData.append('simple_vm', JSON.stringify(simple_vm));
 		formData.append('project_application_id', project_application_id);
+		formData.append('consents', consents);
 		console.log(formData);
 
 		return this.http.post<any>(`${ApiSettings.getApiBaseURL()}wagtail-management/testimonial/`, formData, {
@@ -132,7 +147,11 @@ export class NewsService {
 		workgroup: string,
 		simple_vm: boolean,
 		project_application_id: string,
+		soc_consents: SocialConsent[],
 	): Observable<any> {
+		const consents_list = soc_consents.map(soc => soc.id);
+		const consents = JSON.stringify(consents_list);
+
 		const testimonialData: any = {
 			title,
 			text,
@@ -142,6 +161,7 @@ export class NewsService {
 			workgroup,
 			simple_vm,
 			project_application_id,
+			consents,
 		};
 
 		return this.http.post<any>(

src/app/pipe-module/pipe-module.module.ts

@@ -15,6 +15,7 @@ import { IsFutureTimePipe } from './pipes/futureTime.pipe';
 import { IsMigratedProjectIdPipe } from './pipes/migratedList';
 import { HasStatusNotInListPipe } from './pipes/has-status-not-in-list.pipe';
 import { SignificancePipe } from '../shared/shared_modules/components/maintenance-notification/significance-pipe/significance.pipe';
+import { SocialConsentGivenPipe } from './pipes/social-consent-given.pipe';
 import { IsMigratedProjectPipe } from './pipes/isMigratedProject';
 
 /**
@@ -40,6 +41,7 @@ import { IsMigratedProjectPipe } from './pipes/isMigratedProject';
 		IsMigratedProjectIdPipe,
 		HasStatusNotInListPipe,
 		SignificancePipe,
+		SocialConsentGivenPipe,
 		IsMigratedProjectPipe,
 	],
 	exports: [
@@ -61,6 +63,7 @@ import { IsMigratedProjectPipe } from './pipes/isMigratedProject';
 		IsMigratedProjectIdPipe,
 		HasStatusNotInListPipe,
 		SignificancePipe,
+		SocialConsentGivenPipe,
 		IsMigratedProjectPipe,
 	],
 	imports: [CommonModule],

src/app/pipe-module/pipes/social-consent-given.pipe.ts

@@ -0,0 +1,19 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { SocialConsent } from 'app/shared/shared_modules/testimonial-forms/social-consent.model';
+
+/**
+ * Generic Pipe to check if element is in list.
+ */
+@Pipe({
+	name: 'socialConsentGiven',
+})
+export class SocialConsentGivenPipe implements PipeTransform {
+	transform(list: SocialConsent[], value: SocialConsent): boolean {
+		const idx: number = list.findIndex(consent => consent.id === value.id);
+		if (idx !== -1) {
+			return true;
+		} else {
+			return false;
+		}
+	}
+}

src/app/shared/shared_modules/testimonial-forms/social-consent.model.ts

@@ -0,0 +1,12 @@
+/**
+ * Social Consent  class.
+ */
+export class SocialConsent {
+	id: number;
+	name: string;
+	description: string;
+
+	constructor(socialConsent?: Partial<SocialConsent>) {
+		Object.assign(this, socialConsent);
+	}
+}

src/app/shared/shared_modules/testimonial-forms/testimonial-form.component.html

@@ -268,6 +268,51 @@ <h5 class="card-title">Add testimonial draft</h5>
 				</div>
 			</div>
 		</div>
+		<div class="form-group row">
+			<div class="col-md-3">
+				<label class="form-control-label">
+					<strong>
+						Publication Consent*
+						<i
+							class="icon-question"
+							data-toggle="tooltip"
+							title="Specifies which channels we can use to publish the submitted testimonial."
+						>
+						</i>
+					</strong>
+				</label>
+			</div>
+			<div class="col-md-9">
+				<div class="input-group">
+					<div class="form-check mx-2">
+						<input class="form-check-input" type="checkbox" disabled checked id="website_checkbox" />
+						<label class="form-check-label" for="website_checkbox"
+							>Website
+							<i class="icon-question" data-toggle="tooltip" title="Any content on the de.NBI and de.NBI Cloud Website">
+							</i
+						></label>
+					</div>
+					<div class="form-check mx-2" *ngFor="let socialConsent of possibleSocialConsents">
+						<input
+							class="form-check-input"
+							type="checkbox"
+							[value]="socialConsent.id"
+							[checked]="selectedSocialConsents | socialConsentGiven: socialConsent"
+							[id]="'checkbox_' + socialConsent.id"
+							(change)="updateSelectedOptions(socialConsent)"
+						/>
+						<label class="form-check-label" for="checkbox_{{ socialConsent.id }}"
+							>{{ socialConsent.name }}
+							<i class="icon-question" data-toggle="tooltip" title="{{ socialConsent.description }}"> </i
+						></label>
+					</div>
+				</div>
+				<div class="form-text">
+					Please indicate here on which channels/platforms we may publish your testimonial or information about your
+					testimonial. The website channels are selected by default and cannot be deselected as a channel.
+				</div>
+			</div>
+		</div>
 	</form>
 </div>
 <div class="card-body" *ngIf="hideTestimonialForm">

src/app/shared/shared_modules/testimonial-forms/testimonial-form.component.ts

@@ -7,6 +7,7 @@ import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms
 import { TESTIMONIAL_PAGE_LINK, CLOUD_PORTAL_SUPPORT_MAIL, SINGLE_TESTIMONIAL_PAGE_LINK } from '../../../../links/links';
 import { NewsService } from '../../../api-connector/news.service';
 import { Application } from '../../../applications/application.model/application.model';
+import { SocialConsent } from './social-consent.model';
 
 @Component({
 	selector: 'app-testimonial-form',
@@ -42,6 +43,8 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 	@Input() testimonialSent: boolean;
 	initialLoadingSuccessful: boolean = false;
 	image_url: string = '';
+	possibleSocialConsents: SocialConsent[] = [];
+	selectedSocialConsents: SocialConsent[] = [];
 	submissionSuccessful: boolean = false;
 	autosaveTimer: ReturnType<typeof setTimeout>;
 	autosaveTimeout: number = 60000;
@@ -62,6 +65,9 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 		this.setInitialData();
 		this.subscription = new Subscription();
 		this.getTestimonialData();
+		this.newsService.getPossibleSocialConsents().subscribe((consents: SocialConsent[]) => {
+			this.possibleSocialConsents = consents;
+		});
 	}
 
 	createFormGroup(): void {
@@ -102,6 +108,19 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 			this.checkAutosaveNeed();
 		});
 	}
+	/**
+	 * updateSelectedOptions does not work yet
+	 * @param socialConsent the object that got checked/unchecked
+	 */
+	updateSelectedOptions(socialConsent: SocialConsent): void {
+		const idx: number = this.selectedSocialConsents.findIndex(consent => consent.id === socialConsent.id);
+
+		if (idx !== -1) {
+			this.selectedSocialConsents.splice(idx, 1);
+		} else {
+			this.selectedSocialConsents.push(socialConsent);
+		}
+	}
 
 	setInitialData(): void {
 		this.initialTitle = this.title;
@@ -173,6 +192,7 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 		this.institution = result['institution'];
 		this.workgroup = result['workgroup'];
 		this.contributor = result['contributor'];
+		this.selectedSocialConsents = result['publication_channels'];
 	}
 
 	stopAutosaveTimer(): void {
@@ -212,6 +232,7 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 							this.workgroup,
 							this.simple_vm,
 							this.project_application.project_application_id.toString(),
+							this.selectedSocialConsents,
 						)
 						.subscribe(
 							(): void => {
@@ -259,6 +280,7 @@ export class TestimonialFormComponent implements OnInit, OnDestroy {
 					this.simple_vm,
 					this.image_url,
 					this.project_application.project_application_id.toString(),
+					this.selectedSocialConsents,
 					this.file,
 				)
 				.subscribe((result: any): any => {