This is an automated email from the ASF dual-hosted git repository. hshpak pushed a commit to branch feat/DATALAB-2864/delete-one-image in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git
commit 5e514022f10b1c557c2a0093a188d9cc35ff78da Author: Hennadii_Shpak <[email protected]> AuthorDate: Mon Aug 22 17:21:52 2022 +0300 initial commit --- .../services/applicationServiceFacade.service.ts | 10 ++- .../app/core/services/user-images-page.service.ts | 18 ++++- .../image-action-dialog.component.html} | 16 +++- .../image-action-dialog.component.scss} | 36 ++++++++- .../image-action-dialog.component.ts | 92 ++++++++++++++++++++++ .../image-action-dialog.module.ts} | 13 +-- .../image-detail-dialog.component.ts | 4 +- .../terminate-image-dialog.component.html} | 19 +++-- .../terminate-image-dialog.component.scss} | 18 ++--- .../terminate-image-dialog.component.ts} | 29 +++---- .../terminate-image-dialog.module.ts} | 38 ++++----- .../src/app/resources/images/images.component.html | 5 +- .../src/app/resources/images/images.component.ts | 23 +++++- .../src/app/resources/images/images.config.ts | 5 ++ .../src/app/resources/images/images.model.ts | 9 ++- .../src/app/resources/images/images.service.ts | 18 +++-- .../webapp/src/app/resources/resources.module.ts | 8 +- .../confirmation-dialog.model.ts | 1 + .../notification-dialog.component.ts | 2 +- 19 files changed, 268 insertions(+), 96 deletions(-) diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts index 5f85bb5fa..c4715c6ae 100644 --- a/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts +++ b/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts @@ -24,7 +24,7 @@ import { HttpClient } from '@angular/common/http'; import { Dictionary } from '../collections'; import { environment } from '../../../environments/environment'; import { HTTPMethod } from '../util'; -import { ImageFilterFormValue, ShareImageAllUsersParams} from '../../resources/images'; +import { ImageActionType, ImageFilterFormValue, ImageParams } from '../../resources/images'; // we can now access environment.apiUrl const API_URL = environment.apiUrl; @@ -195,7 +195,7 @@ export class ApplicationServiceFacade { params); } - buildShareImageAllUsers(params: ShareImageAllUsersParams): Observable<any> { + buildShareImageAllUsers(params: ImageParams): Observable<any> { return this.buildRequest(HTTPMethod.POST, this.requestRegistry.Item(ApplicationServiceFacade.SHARE_ALL), params @@ -454,6 +454,12 @@ export class ApplicationServiceFacade { { observe: 'response', responseType: 'text' }); } + public buildDeleteImage(data: string): Observable<any> { + return this.buildRequest(HTTPMethod.DELETE, + this.requestRegistry.Item(ApplicationServiceFacade.IMAGE), + data, { responseType: 'text', observe: 'response' }); + } + public buildGetExploratorySchedule(data): Observable<any> { return this.buildRequest(HTTPMethod.GET, this.requestRegistry.Item(ApplicationServiceFacade.SCHEDULER), diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/user-images-page.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/user-images-page.service.ts index f1933619d..49d6ace10 100644 --- a/services/self-service/src/main/resources/webapp/src/app/core/services/user-images-page.service.ts +++ b/services/self-service/src/main/resources/webapp/src/app/core/services/user-images-page.service.ts @@ -19,14 +19,15 @@ import { Injectable } from '@angular/core'; import { Observable } from 'rxjs'; -import { catchError } from 'rxjs/operators'; +import { catchError, map } from 'rxjs/operators'; import { ErrorUtils } from '../util'; import { ApplicationServiceFacade } from './applicationServiceFacade.service'; import { - ImageFilterFormValue, + ImageActionType, + ImageFilterFormValue, ImageModel, ProjectImagesInfo, - ShareImageAllUsersParams + ImageParams } from '../../resources/images'; @Injectable() @@ -50,10 +51,19 @@ export class UserImagesPageService { ); } - shareImagesAllUser(shareParams: ShareImageAllUsersParams): Observable<ProjectImagesInfo> { + shareImagesAllUser(shareParams: ImageParams): Observable<ProjectImagesInfo> { return this.applicationServiceFacade.buildShareImageAllUsers(shareParams) .pipe( catchError(ErrorUtils.handleServiceError) ); } + + terminateImage(image: ImageParams, action: ImageActionType): Observable<ProjectImagesInfo> { + const url = `/${image.projectName}/${image.endpoint}/${image.imageName}/${action}`; + + return this.applicationServiceFacade + .buildDeleteImage(JSON.stringify(url)) + .pipe( + catchError(ErrorUtils.handleServiceError)); + } } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.html similarity index 69% copy from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html copy to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.html index c6bdf2c68..7a2615522 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.html @@ -19,22 +19,32 @@ <div id="dialog-box"> <header class="dialog-header"> - <h4 class="modal-title">Share Image</h4> + <h4 class="modal-title">{{title}}</h4> <button type="button" class="close" (click)="dialogRef.close()">×</button> </header> <section class="content"> - <p class="description"> + <p class="description" *ngIf="data.actionType === actionType.share"> The image <span class="image-name">{{imageName}} </span> <span>will be shared with all current user groups on the project with all the data and code.</span> </p> + <div *ngIf="data.actionType === actionType.terminate" class="terminate-action__wrapper"> + <div class="list-header sans terminate-action__header--wrapper"> + <div class="image">Image</div> + <div class="status">Further status</div> + </div> + <div class="scrolling-content scrolling terminate-image-list__wrapper"> + <div class="image-name ellipsis">{{imageName}}</div> + <div class="status terminated">Terminated</div> + </div> + </div> <p class="question center"> Do you want proceed? </p> <div class="text-center m-top-30 m-bott-10"> <button type="button" class="butt mat-raised-button" (click)="dialogRef.close()">No</button> <button type="button" class="butt butt-success mat-raised-button" - (click)="onShare()">Yes + (click)="onYesClick(data.actionType)">Yes </button> </div> </section> diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.scss similarity index 66% copy from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss copy to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.scss index ab75348ab..ce4f8ce64 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.scss @@ -41,5 +41,39 @@ } .image-name { - font-weight: 600; + font-weight: 300; +} + +.image-list { + display: flex; + justify-content: space-between; +} + +.terminate-action__wrapper { + width: 100%; +} + +.terminate-image-list__wrapper { + margin-bottom: 20px; + border-bottom: 1px solid rgba(0,0,0,.08); +} + +.terminate-action__header--wrapper, +.terminate-image-list__wrapper { + display: flex; + justify-content: space-between; + padding: 10px 0; + line-height: 26px; + + & > .status { + text-align: right; + } +} + +.content { + & .terminate-image-list__wrapper { + & > .status { + font-weight: 300; + } + } } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.ts new file mode 100644 index 000000000..b489d6295 --- /dev/null +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.component.ts @@ -0,0 +1,92 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import { Component, Inject, OnInit } from '@angular/core'; +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { ImagesService } from '../../images/images.service'; +import { ImageActions, ImageActionType, ImageModalData, ImageParams, Toaster_Message } from '../../images'; +import { ToastrService } from 'ngx-toastr'; + +@Component({ + selector: 'datalab-image-action-dialog', + templateUrl: './image-action-dialog.component.html', + styleUrls: ['./image-action-dialog.component.scss'] +}) +export class ImageActionDialogComponent implements OnInit { + readonly actionType: typeof ImageActions = ImageActions; + + imageName!: string; + title!: string; + + constructor( + public dialogRef: MatDialogRef<ImageActionDialogComponent>, + @Inject(MAT_DIALOG_DATA) public data: ImageModalData, + private imagesService: ImagesService, + private toastr: ToastrService, + ) { } + + ngOnInit(): void { + this.imageName = this.data.image.name; + this.setTitle(); + } + + onYesClick(actionType: ImageActionType): void { + const actionConfig = this.getActionConfig(); + const actionHandler = actionConfig[actionType].bind(this); + return actionHandler(); + } + + private getActionConfig() { + return { + share: this.shareImage, + terminate: this.terminateImage + }; + } + + private terminateImage() { + const imageInfo = this.getImageInfo(); + this.dialogRef.close(); + this.imagesService.terminateImage(imageInfo, this.data.actionType) + .subscribe( + () => this.toastr.success(Toaster_Message.successShare, 'Success!') + ); + } + + private shareImage(): void { + const imageInfo = this.getImageInfo(); + this.dialogRef.close(); + this.imagesService.shareImageAllUsers(imageInfo) + .subscribe( + () => this.toastr.success(Toaster_Message.successShare, 'Success!') + ); + } + + private setTitle(): void { + this.title = this.data.actionType === ImageActions.share ? 'Share Image' : 'Terminate image'; + } + + private getImageInfo(): ImageParams { + const { name, project, endpoint } = this.data.image; + return { + imageName: name, + projectName: project, + endpoint: endpoint + }; + } +} diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.module.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.module.ts similarity index 73% rename from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.module.ts rename to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.module.ts index 158aa0d09..9dff0d351 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.module.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-action-dialog/image-action-dialog.module.ts @@ -19,15 +19,16 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; -import { ShareImageDialogComponent } from './share-image-dialog.component'; +import { ImageActionDialogComponent } from './image-action-dialog.component'; import { NotificationDialogComponent } from '../../../shared/modal-dialog/notification-dialog'; +import { MaterialModule } from '../../../shared/material.module'; @NgModule({ - declarations: [ ShareImageDialogComponent ], - imports: [ CommonModule ], - entryComponents: [ShareImageDialogComponent], - exports: [ ShareImageDialogComponent ] + declarations: [ ImageActionDialogComponent ], + imports: [ CommonModule, MaterialModule ], + entryComponents: [ImageActionDialogComponent], + exports: [ ImageActionDialogComponent ] }) -export class ShareImageDialogModule { } +export class ImageActionDialogModule { } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.ts index 5b18f814a..a5bcbbd49 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.ts @@ -19,7 +19,7 @@ import { Component, Inject, OnInit } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog'; -import { LibraryInfoItem, Library, ShareModalData } from '../../images'; +import { LibraryInfoItem, Library, ImageModalData } from '../../images'; import { LibraryInfoModalComponent } from '../library-info-modal/library-info-modal.component'; import { caseInsensitiveSortUtil } from '../../../core/util'; @@ -38,7 +38,7 @@ export class ImageDetailDialogComponent implements OnInit { constructor( public dialogRef: MatDialogRef<ImageDetailDialogComponent>, - @Inject(MAT_DIALOG_DATA) public data: ShareModalData, + @Inject(MAT_DIALOG_DATA) public data: ImageModalData, private dialog: MatDialog, ) { } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.html similarity index 70% rename from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html rename to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.html index c6bdf2c68..28f1068b4 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.html +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.html @@ -19,15 +19,22 @@ <div id="dialog-box"> <header class="dialog-header"> - <h4 class="modal-title">Share Image</h4> + <h4 class="modal-title">Terminate Image</h4> <button type="button" class="close" (click)="dialogRef.close()">×</button> </header> <section class="content"> - <p class="description"> - The image - <span class="image-name">{{imageName}} </span> - <span>will be shared with all current user groups on the project with all the data and code.</span> - </p> + <mat-list> + <mat-list-item class="list-header sans image-terminate"> + <div class="image">Image</div> + <div class="status">Further status</div> + </mat-list-item> + <div class="scrolling-content scrolling image-list"> +<!-- <mat-list-item *ngFor="let endpoint of filterEndpoints()" class="sans node">--> +<!-- <div class="endpoint ellipsis">{{endpoint.name}}</div>--> +<!-- <div class="status terminated">Terminated</div>--> +<!-- </mat-list-item>--> + </div> + </mat-list> <p class="question center"> Do you want proceed? </p> diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.scss similarity index 86% copy from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss copy to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.scss index ab75348ab..33451cd07 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.scss @@ -24,6 +24,14 @@ font-weight: 600; } +::ng-deep .mat-list.mat-list-base > .list-header.image-terminate > .mat-list-item-content { + justify-content: space-between; +} + +.proceed { + text-align: center; +} + .question { color: #718ba6; } @@ -32,14 +40,6 @@ text-align: center; } -.description { +.image-list { margin-bottom: 20px; - color: #35afd5; - font-size: 14px; - text-align: center; - font-weight: 200; -} - -.image-name { - font-weight: 600; } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.ts similarity index 54% rename from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.ts rename to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.ts index bc9bb1411..ab393459c 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.component.ts @@ -19,34 +19,23 @@ import { Component, Inject, OnInit } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { ImagesService } from '../../images/images.service'; -import { ShareModalData, Toaster_Message } from '../../images'; -import { ToastrService } from 'ngx-toastr'; +import { ImageModalData } from '../../images'; @Component({ - selector: 'datalab-share-image-dialog', - templateUrl: './share-image-dialog.component.html', - styleUrls: ['./share-image-dialog.component.scss'] + selector: 'datalab-terminate-image-dialog', + templateUrl: './terminate-image-dialog.component.html', + styleUrls: ['./terminate-image-dialog.component.scss'] }) -export class ShareImageDialogComponent implements OnInit{ - imageName!: string; +export class TerminateImageDialogComponent implements OnInit { constructor( - public dialogRef: MatDialogRef<ShareImageDialogComponent>, - @Inject(MAT_DIALOG_DATA) public data: ShareModalData, - private imagesService: ImagesService, - private toastr: ToastrService, + public dialogRef: MatDialogRef<TerminateImageDialogComponent>, + @Inject(MAT_DIALOG_DATA) public data: ImageModalData, ) { } - ngOnInit() { - this.imageName = this.data.image.name; - } + ngOnInit(): void {} onShare() { - this.dialogRef.close(); - this.imagesService.shareImageAllUsers(this.data.image) - .subscribe( - () => this.toastr.success(Toaster_Message.successShare, 'Success!') - ); + console.log(this.data.image); } } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.module.ts similarity index 63% rename from services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss rename to services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.module.ts index ab75348ab..ee65b0826 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/share-image-dialog/share-image-dialog.component.scss +++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/terminate-image-dialog/terminate-image-dialog.module.ts @@ -17,29 +17,21 @@ * under the License. */ -.content { - max-height: 75vh; - margin: 0; - padding: 20px 50px; - font-weight: 600; -} +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { TerminateImageDialogComponent } from './terminate-image-dialog.component'; +import { MaterialModule } from '../../../shared/material.module'; -.question { - color: #718ba6; -} -.center { - text-align: center; -} -.description { - margin-bottom: 20px; - color: #35afd5; - font-size: 14px; - text-align: center; - font-weight: 200; -} - -.image-name { - font-weight: 600; -} +@NgModule({ + declarations: [ + TerminateImageDialogComponent + ], + imports: [ + CommonModule, + MaterialModule + ], + entryComponents: [ TerminateImageDialogComponent ] +}) +export class TerminateImageDialogModule { } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.html index e8d1103a5..ee2d37c19 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.html +++ b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.html @@ -323,8 +323,9 @@ <span>Share</span> </button> </li> - <li *ngIf="element.imageUserPermissions.canTerminate"> - <button class="action-button__share" disabled> +<!-- <li *ngIf="element.imageUserPermissions.canTerminate">--> + <li (click)="onTerminateClick(element)"> + <button class="action-button__share"> <i class="material-icons">phonelink_off</i> <span>Terminate</span> </button> diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.ts index 7d701db94..f1f4362ee 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.component.ts @@ -38,13 +38,14 @@ import { DropdownFieldNames, FilterFormInitialValue, ImageModelKeysForFilter, - DropdownSelectAllValue, FilterFormControlNames, + DropdownSelectAllValue, FilterFormControlNames, ImageActions, } from './images.config'; -import { ShareImageDialogComponent } from '../exploratory/share-image-dialog/share-image-dialog.component'; +import { ImageActionDialogComponent } from '../exploratory/image-action-dialog/image-action-dialog.component'; import { ImagesService } from './images.service'; import { ProgressBarService } from '../../core/services/progress-bar.service'; import { ImageDetailDialogComponent } from '../exploratory/image-detail-dialog/image-detail-dialog.component'; import { ActivatedRoute } from '@angular/router'; +import { TerminateImageDialogComponent } from '../exploratory/terminate-image-dialog/terminate-image-dialog.component'; @Component({ selector: 'datalab-images', @@ -151,9 +152,10 @@ export class ImagesComponent implements OnInit, OnDestroy { } onShareClick(image: ImageModel): void { - this.dialog.open(ShareImageDialogComponent, { + this.dialog.open(ImageActionDialogComponent, { data: { - image + image, + actionType: ImageActions.share }, panelClass: 'modal-sm' }).afterClosed() @@ -163,6 +165,19 @@ export class ImagesComponent implements OnInit, OnDestroy { }); } + onTerminateClick(image: ImageModel): void { + this.dialog.open(ImageActionDialogComponent, { + data: { + image, + actionType: ImageActions.terminate + }, + panelClass: 'modal-sm' + }).afterClosed() + .subscribe(() => { + this.progressBarService.stopProgressBar(); + }); + } + onFilterClick(): void { this.imagesService.openFilter(); } diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.config.ts b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.config.ts index b6bcdc197..f69302a6c 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.config.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.config.ts @@ -111,3 +111,8 @@ export enum ImageModelKeysForFilter { export const DropdownSelectAllValue = 'selectAllFound'; +export enum ImageActions { + share = 'share', + terminate = 'terminate' +} + diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.model.ts b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.model.ts index c06192c70..b7e8ff75d 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.model.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.model.ts @@ -1,3 +1,5 @@ +import { ImageActions } from './images.config'; + export interface ProjectImagesInfo { filterData: ImageFilterFormDropdownData; imageFilter: ImageFilterFormValue; @@ -35,16 +37,19 @@ export interface ImageUserPermissions { canTerminate: boolean; } -export interface ShareImageAllUsersParams { +export interface ImageParams { imageName: string; projectName: string; endpoint: string; } -export interface ShareModalData { +export interface ImageModalData { image: ImageModel; + actionType: ImageActionType; } +export type ImageActionType = 'share' | 'terminate'; + export interface Library { add_pkgs: string[]; available_versions: string[]; diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.service.ts b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.service.ts index 703ef44d0..611a090ad 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/images/images.service.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/images/images.service.ts @@ -10,7 +10,7 @@ import { ImageModel, ProjectImagesInfo, ProjectModel, - ShareImageAllUsersParams + ImageParams, ImageActionType } from './images.model'; import { ApplicationServiceFacade, UserImagesPageService } from '../../core/services'; import { ChangedColumnStartValue, FilterFormInitialValue } from './images.config'; @@ -60,14 +60,16 @@ export class ImagesService { ); } - shareImageAllUsers(image: ImageModel): Observable<ProjectImagesInfo> { - const shareParams: ShareImageAllUsersParams = { - imageName: image.name, - projectName: image.project, - endpoint: image.endpoint - }; + shareImageAllUsers(imageInfo: ImageParams): Observable<ProjectImagesInfo> { + return this.userImagesPageService.shareImagesAllUser(imageInfo) + .pipe( + tap(value => this.getImagePageData(value.projectImagesInfos)), + take(1) + ); + } - return this.userImagesPageService.shareImagesAllUser(shareParams) + terminateImage(imageInfo: ImageParams, action: ImageActionType): Observable<ProjectImagesInfo> { + return this.userImagesPageService.terminateImage(imageInfo, action) .pipe( tap(value => this.getImagePageData(value.projectImagesInfos)), take(1) diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources.module.ts b/services/self-service/src/main/resources/webapp/src/app/resources/resources.module.ts index 1d3d27869..c9cd6dc5a 100644 --- a/services/self-service/src/main/resources/webapp/src/app/resources/resources.module.ts +++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources.module.ts @@ -36,11 +36,12 @@ import {CheckboxModule} from '../shared/checkbox'; import {BubbleModule} from '../shared'; import { IsElementAvailablePipeModule, NormalizeDropdownMultiValuePipeModule } from '../core/pipes'; import { LocalDatePipeModule } from '../core/pipes/local-date-pipe'; -import { ShareImageDialogModule } from './exploratory/share-image-dialog/share-image-dialog.module'; +import { ImageActionDialogModule } from './exploratory/image-action-dialog/image-action-dialog.module'; import { ImageDetailDialogModule } from './exploratory/image-detail-dialog/image-detail-dialog.module'; import {LibraryInfoModalModule} from './exploratory/library-info-modal/library-info-modal.module'; import { PageFilterComponent } from './exploratory/page-filter/page-filter.component'; import { DirectivesModule } from '../core/directives'; +import { TerminateImageDialogModule } from './exploratory/terminate-image-dialog/terminate-image-dialog.module'; @NgModule({ imports: [ @@ -57,11 +58,12 @@ import { DirectivesModule } from '../core/directives'; BubbleModule, NormalizeDropdownMultiValuePipeModule, LocalDatePipeModule, - ShareImageDialogModule, + ImageActionDialogModule, ImageDetailDialogModule, LibraryInfoModalModule, DirectivesModule, - IsElementAvailablePipeModule + IsElementAvailablePipeModule, + TerminateImageDialogModule ], declarations: [ ResourcesComponent, diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.model.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.model.ts index 71abde30b..92d70c230 100644 --- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.model.ts +++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.model.ts @@ -76,6 +76,7 @@ export class ConfirmationDialogModel { } private terminateExploratory(): Observable<{}> { + console.log(this.manageAction); return this.manageAction ? this.manageEnvironmentsService.environmentManagement( this.notebook.user, 'terminate', this.notebook.project, this.notebook.name ) : this.userResourceService.suspendExploratoryEnvironment(this.notebook, 'terminate'); diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts index 4f532c0e8..ea8a5b9ad 100644 --- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts +++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/notification-dialog/notification-dialog.component.ts @@ -129,7 +129,7 @@ import { Endpoint } from '../../../administration/project/project.model'; <div class="scrolling-content scrolling"> <mat-list-item *ngFor="let resource of data.item.resources" class="sans node"> <div class="endpoint ellipsis">{{resource}}</div> - <div class="status terminated">Terminated</div> + <div class="status terminated">Terminated111111</div> </mat-list-item> </div> </mat-list> --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
