argos/dmp-frontend/src/app/ui/dmp/editor/dmp-deposit-dropdown/dmp-deposit-dropdown.component.ts

import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { DomSanitizer, SafeResourceUrl } from "@angular/platform-browser";
import { DepositConfigurationStatus } from '@app/core/common/enum/deposit-configuration-status';
import { DepositConfiguration } from '@app/core/model/deposit/deposit-configuration';
import { DepositAuthenticateRequest, DepositRequest } from '@app/core/model/deposit/deposit-request';
import { Dmp } from '@app/core/model/dmp/dmp';
import { EntityDoi } from '@app/core/model/entity-doi/entity-doi';
import { DepositService } from '@app/core/services/deposit/deposit.service';
import {
	SnackBarNotificationLevel,
	UiNotificationService
} from '@app/core/services/notification/ui-notification-service';
import { Oauth2DialogService } from '@app/ui/misc/oauth2-dialog/service/oauth2-dialog.service';
import { BaseComponent } from '@common/base/base.component';
import { MultipleChoiceDialogComponent } from '@common/modules/multiple-choice-dialog/multiple-choice-dialog.component';
import { TranslateService } from '@ngx-translate/core';
import { takeUntil } from 'rxjs/operators';

@Component({
	selector: 'app-dmp-deposit-dropdown',
	templateUrl: './dmp-deposit-dropdown.component.html',
	styleUrls: ['./dmp-deposit-dropdown.component.scss']
})
export class DmpDepositDropdown extends BaseComponent implements OnInit {
	@Input() inputRepos: DepositConfiguration[];
	@Input() dmp: Dmp;
	outputRepos = [];
	logos: Map<string, SafeResourceUrl> = new Map<string, SafeResourceUrl>();
	@Output() outputReposEmitter: EventEmitter<EntityDoi[]> = new EventEmitter<EntityDoi[]>();
	private oauthLock: boolean;

	constructor(
		private depositRepositoriesService: DepositService,
		private dialog: MatDialog,
		private language: TranslateService,
		private translate: TranslateService,
		private uiNotificationService: UiNotificationService,
		private oauth2DialogService: Oauth2DialogService,
		private sanitizer: DomSanitizer
	) {
		super();
	}

	hasDoi(repo, dois, i) {
		return repo.repositoryId !== dois[i].repositoryId;
	}

	ngOnInit(): void {
		for (var i = 0; i < this.dmp?.entityDois?.length; i++) {
			this.inputRepos = this.inputRepos.filter(r => this.hasDoi(r, this.dmp.entityDois, i));
		}
		this.inputRepos.forEach(repo => {
			if (repo.hasLogo) {
				this.depositRepositoriesService.getLogo(repo.repositoryId).subscribe(logo => {
					this.logos.set(repo.repositoryId, this.sanitizer.bypassSecurityTrustResourceUrl('data:image/png;base64, ' + logo));
				})
			}
		})
	}

	deposit(repo: DepositConfiguration) {

		if (repo.depositType == DepositConfigurationStatus.BothSystemAndUser) {

			const dialogRef = this.dialog.open(MultipleChoiceDialogComponent, {
				maxWidth: '600px',
				restoreFocus: false,
				data: {
					message: this.language.instant('DMP-OVERVIEW.DEPOSIT.ACCOUNT-LOGIN'),
					titles: [this.language.instant('DMP-OVERVIEW.DEPOSIT.LOGIN', { 'repository': repo.repositoryId }), this.language.instant('DMP-OVERVIEW.MULTIPLE-DIALOG.USE-DEFAULT')]
				}
			});
			dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
				switch (result) {
					case 0:
						this.showOauth2Dialog(repo.repositoryAuthorizationUrl + '?client_id=' + repo.repositoryClientId
							+ '&response_type=code&scope=deposit:write+deposit:actions+user:email&state=astate&redirect_uri='
							+ repo.redirectUri, repo, this.dmp);
						break;
					case 1:
						const depositRequest: DepositRequest = {
							repositoryId: repo.repositoryId,
							dmpId: this.dmp.id,
							accessToken: null
						};
						this.depositRepositoriesService.deposit(depositRequest)
							.pipe(takeUntil(this._destroyed))
							.subscribe(doi => {
								this.onDOICallbackSuccess();
								this.outputRepos.push(doi);
								this.outputReposEmitter.emit(this.outputRepos);
							}, error => this.onDOICallbackError(error));
						break;
				}
			});

		} else if (repo.depositType == DepositConfigurationStatus.System) {
			const depositRequest: DepositRequest = {
				repositoryId: repo.repositoryId,
				dmpId: this.dmp.id,
				accessToken: null
			};
			this.depositRepositoriesService.deposit(depositRequest)
				.pipe(takeUntil(this._destroyed))
				.subscribe(doi => {
					this.onDOICallbackSuccess();
					this.outputRepos.push(doi);
					this.outputReposEmitter.emit(this.outputRepos);
				}, error => this.onDOICallbackError(error));
		}
	}

	onDOICallbackSuccess(): void {
		this.uiNotificationService.snackBarNotification(this.language.instant('DMP-EDITOR.SNACK-BAR.SUCCESSFUL-DOI'), SnackBarNotificationLevel.Success);
	}

	onDOICallbackError(error) {
		this.uiNotificationService.snackBarNotification(error.error.message ? error.error.message : this.language.instant('DMP-EDITOR.SNACK-BAR.UNSUCCESSFUL-DOI'), SnackBarNotificationLevel.Error);
	}

	showOauth2Dialog(url: string, repo: DepositConfiguration, dmp: Dmp) {
		this.oauth2DialogService.login(url)
			.pipe(takeUntil(this._destroyed))
			.subscribe(result => {
				if (result !== undefined) {
					if (result.oauthCode !== undefined && result.oauthCode !== null && !this.oauthLock) {
						const depositAuthenticateRequest: DepositAuthenticateRequest = {
							repositoryId: repo.repositoryId,
							code: result.oauthCode
						};
						this.depositRepositoriesService.getAccessToken(depositAuthenticateRequest)
							.pipe(takeUntil(this._destroyed))
							.subscribe(token => {
								const depositRequest: DepositRequest = {
									repositoryId: repo.repositoryId,
									dmpId: dmp.id,
									accessToken: token
								};
								this.depositRepositoriesService.deposit(depositRequest)
									.pipe(takeUntil(this._destroyed))
									.subscribe(doi => {
										this.onDOICallbackSuccess();
										this.outputRepos.push(doi);
										this.outputReposEmitter.emit(this.outputRepos);
									}, error => this.onDOICallbackError(error));
							});
						this.oauthLock = true;
					}
				} else {
					this.oauthLock = false;
				}
			});
	}

}