You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dlab.apache.org by dg...@apache.org on 2020/08/05 14:14:21 UTC
[incubator-dlab] 03/03: [DLAB-1662]: Fixed notebook position if
user applies any action for it
This is an automated email from the ASF dual-hosted git repository.
dgnatyshyn pushed a commit to branch DLAB-1662
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git
commit e588d761a6385176697c0d06111002d52886bb84
Author: Dmytro_Gnatyshyn <di...@ukr.net>
AuthorDate: Wed Aug 5 17:13:30 2020 +0300
[DLAB-1662]: Fixed notebook position if user applies any action for it
---
.../src/app/core/pipes/keys-pipe/keys.pipe.ts | 2 +-
.../underscoreless-pipe/underscoreless.pipe.ts | 2 +-
.../bucket-browser/bucket-browser.component.ts | 39 ++++++++++++++++++----
.../buckets-tree/bucket-tree.component.scss | 2 +-
.../folder-tree/folder-tree.component.ts | 2 +-
...utational-resource-create-dialog.component.html | 2 +-
...mputational-resource-create-dialog.component.ts | 2 +-
.../resources-grid/resources-grid.component.html | 12 +++----
.../resources-grid/resources-grid.component.ts | 35 ++++++-------------
.../confirmation-dialog.component.ts | 8 +++--
.../webapp/src/assets/styles/_dialogs.scss | 3 +-
11 files changed, 63 insertions(+), 46 deletions(-)
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/pipes/keys-pipe/keys.pipe.ts b/services/self-service/src/main/resources/webapp/src/app/core/pipes/keys-pipe/keys.pipe.ts
index 5fe18ad..8c6fb0b 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/pipes/keys-pipe/keys.pipe.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/pipes/keys-pipe/keys.pipe.ts
@@ -22,7 +22,7 @@ import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'keys' })
export class KeysPipe implements PipeTransform {
- transform(value, args: string[]): any {
+ transform(value): any {
const keys = [];
for (const key in value) {
keys.push({ key: key, value: value[key]});
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/pipes/underscoreless-pipe/underscoreless.pipe.ts b/services/self-service/src/main/resources/webapp/src/app/core/pipes/underscoreless-pipe/underscoreless.pipe.ts
index a21da90..32670b0 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/pipes/underscoreless-pipe/underscoreless.pipe.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/pipes/underscoreless-pipe/underscoreless.pipe.ts
@@ -22,7 +22,7 @@ import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'underscoreless' })
export class UnderscorelessPipe implements PipeTransform {
- transform(value, args: string[]): any {
+ transform(value): any {
return value.replace(/_/g, ' ');
}
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.ts
index 3ffcada..2be3dad 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.ts
@@ -17,7 +17,7 @@
* under the License.
*/
-import { Component, OnInit, ViewChild, Inject } from '@angular/core';
+import {Component, OnInit, ViewChild, Inject, OnDestroy} from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { ToastrService } from 'ngx-toastr';
@@ -31,13 +31,16 @@ import {BucketConfirmationDialogComponent} from './bucket-confirmation-dialog/bu
import {logger} from 'codelyzer/util/logger';
import {HttpEventType, HttpResponse} from '@angular/common/http';
import {CopyPathUtils} from '../../core/util/copyPathUtils';
+import {Subject} from 'rxjs';
+import {takeUntil} from 'rxjs/operators';
@Component({
selector: 'dlab-bucket-browser',
templateUrl: './bucket-browser.component.html',
styleUrls: ['./bucket-browser.component.scss']
})
-export class BucketBrowserComponent implements OnInit {
+export class BucketBrowserComponent implements OnInit, OnDestroy {
+ private unsubscribe$ = new Subject();
public addedFiles = [];
public folderItems = [];
public originFolderItems = [];
@@ -92,6 +95,11 @@ export class BucketBrowserComponent implements OnInit {
this.cloud = this.getCloud();
}
+ ngOnDestroy() {
+ this.unsubscribe$.next();
+ this.unsubscribe$.complete();
+ }
+
public getTokenValidTime() {
const token = JSON.parse(atob(this.storage.getToken().split('.')[1]));
return token.exp * 1000 - new Date().getTime();
@@ -99,7 +107,11 @@ export class BucketBrowserComponent implements OnInit {
private refreshToken() {
this.isTokenRefreshing = true;
- this.auth.refreshToken().subscribe(tokens => {
+ this.auth.refreshToken()
+ .pipe(
+ takeUntil(this.unsubscribe$)
+ )
+ .subscribe(tokens => {
this.storage.storeTokens(tokens);
this.isTokenRefreshing = false;
this.sendFile();
@@ -152,7 +164,11 @@ export class BucketBrowserComponent implements OnInit {
if (res) {
if (this.refreshTokenLimit > this.getTokenValidTime()) {
this.isTokenRefreshing = true;
- this.auth.refreshToken().subscribe(v => {
+ this.auth.refreshToken()
+ .pipe(
+ takeUntil(this.unsubscribe$)
+ )
+ .subscribe(v => {
this.uploadingQueue(files);
this.isTokenRefreshing = false;
});
@@ -164,7 +180,11 @@ export class BucketBrowserComponent implements OnInit {
} else {
if (this.refreshTokenLimit > this.getTokenValidTime()) {
this.isTokenRefreshing = true;
- this.auth.refreshToken().subscribe(v => {
+ this.auth.refreshToken()
+ .pipe(
+ takeUntil(this.unsubscribe$)
+ )
+ .subscribe(v => {
this.uploadingQueue(files);
this.isTokenRefreshing = false;
});
@@ -371,6 +391,9 @@ export class BucketBrowserComponent implements OnInit {
selected[0]['isDownloading'] = true;
this.folderItems.forEach(item => item.isSelected = false);
this.bucketBrowserService.downloadFile(`/${this.bucketName}/object/${path}/endpoint/${this.endpoint}/download`)
+ .pipe(
+ takeUntil(this.unsubscribe$)
+ )
.subscribe(event => {
if (event['type'] === HttpEventType.DownloadProgress) {
selected[0].progress = Math.round(100 * event['loaded'] / selected[0].object.size);
@@ -402,7 +425,11 @@ export class BucketBrowserComponent implements OnInit {
!res && this.clearSelection();
res && this.bucketBrowserService.deleteFile({
bucket: this.bucketName, endpoint: this.endpoint, 'objects': dataForServer
- }).subscribe(() => {
+ })
+ .pipe(
+ takeUntil(this.unsubscribe$)
+ )
+ .subscribe(() => {
this.bucketDataService.refreshBucketdata(this.bucketName, this.endpoint);
this.toastr.success('Objects successfully deleted!', 'Success!');
this.clearSelection();
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/buckets-tree/bucket-tree.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/buckets-tree/bucket-tree.component.scss
index 736c6ee..5bd774a 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/buckets-tree/bucket-tree.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/buckets-tree/bucket-tree.component.scss
@@ -18,7 +18,7 @@
*/
.folder{
padding-left: 5px;
- max-width: 310px;
+ max-width: 350px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/folder-tree/folder-tree.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/folder-tree/folder-tree.component.ts
index 5efc6e0..cd7d199 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/folder-tree/folder-tree.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/folder-tree/folder-tree.component.ts
@@ -84,7 +84,7 @@ export class FolderTreeComponent implements OnDestroy {
if (this.selectedFolder && !this.bucketDataService.emptyFolder) {
setTimeout(() => {
const element = document.querySelector('.folder-item-line.active-item');
- element && element.scrollIntoView({ block: 'center', behavior: 'smooth' });
+ element && element.scrollIntoView({ block: 'start', behavior: 'smooth' });
}, 0);
} else if (this.selectedFolder && this.bucketDataService.emptyFolder) {
setTimeout(() => {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
index 94265fd..62ab6af 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
@@ -149,7 +149,7 @@
<label class="label">
<input #preemptibleNode type="checkbox" (change)="selectPreemptibleNodes($event)" />
<span>Preemptible node</span>
- <span class="align" *ngIf="preemptible?.nativeElement['checked'] || false"> count</span>
+ <span class="align" [hidden]="!preemptible?.nativeElement['checked']"> count</span>
</label>
<div *ngIf="preemptible?.nativeElement['checked']" class="preemptible-details control"
[ngClass]="{ show: preemptible?.nativeElement['checked'] || false}">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
index 8968a3a..9f319cc 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
@@ -134,7 +134,7 @@ export class ComputationalResourceCreateDialogComponent implements OnInit {
public createComputationalResource(data) {
this.model.createComputationalResource(data, this.selectedImage, this.notebook_instance, this.spotInstance, this.PROVIDER.toLowerCase())
.subscribe((response: any) => {
- if (response.status === HTTP_STATUS_CODES.OK) this.dialogRef.close();
+ if (response.status === HTTP_STATUS_CODES.OK) this.dialogRef.close(true);
}, error => this.toastr.error(error.message, 'Oops!'));
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
index 777f65d..afa556c 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
@@ -19,7 +19,7 @@
<section class="table-wrapper">
<table mat-table [dataSource]="filteredEnvironments" multiTemplateDataRows
- class="data-grid resources mat-elevation-z6">
+ class="data-grid resources mat-elevation-z6" [trackBy]="trackBy">
<ng-container matColumnDef="project">
<td mat-cell *matCellDef="let element" [attr.colspan]="8" class="project-name"> {{ element.project }} </td>
@@ -111,8 +111,8 @@
<!-- ----------------------------------------------------- -->
<ng-container matColumnDef="expandedDetail">
- <td mat-cell *matCellDef="let element" class="exploratory" [attr.colspan]="8"
- [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" sticky>
+ <td mat-cell *matCellDef="let element" class="exploratory" [attr.colspan]="8" sticky>
+<!-- [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" -->
<tr *ngFor="let element of element.exploratory; let i = index" class="element-row mat-row">
<td class="name-col highlight" (click)="printDetailEnvironmentModal(element)">
@@ -324,9 +324,9 @@
<tr [hidden]="!collapseFilterRow" mat-header-row *matHeaderRowDef="displayedFilterColumns; sticky: true"
class="filter-row"></tr>
- <tr mat-row *matRowDef="let element; columns: ['project']" class="element-row"
- [class.expanded-row]="expandedElement === element"
- (click)="expandedElement = expandedElement === element ? null : element">
+ <tr mat-row *matRowDef="let element; columns: ['project']" class="element-row">
+<!-- [class.expanded-row]="expandedElement === element"-->
+<!-- (click)="expandedElement = expandedElement === element ? null : element">-->
</tr>
<tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="detail-row"></tr>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.ts
index c05c242..e4e5bf3 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.ts
@@ -120,8 +120,6 @@ export class ResourcesGridComponent implements OnInit {
public bucketsList: BucketList;
public activeProjectsList: any;
-
-
constructor(
public toastr: ToastrService,
private userResourceService: UserResourceService,
@@ -152,9 +150,8 @@ export class ResourcesGridComponent implements OnInit {
this.getDefaultFilterConfiguration();
(this.environments.length) ? this.getUserPreferences() : this.filteredEnvironments = [];
this.healthStatus && !this.healthStatus.billingEnabled && this.modifyGrid();
- window.scrollTop = window.scrollTop + 50
this.progressBarService.stopProgressBar();
- }, () => this.progressBarService.stopProgressBar());
+ }, () => this.progressBarService.stopProgressBar());
}
public toggleFilterRow(): void {
@@ -228,7 +225,9 @@ export class ResourcesGridComponent implements OnInit {
if (action === 'deploy') {
this.dialog.open(ComputationalResourceCreateDialogComponent, { data: { notebook: resource, full_list: this.environments }, panelClass: 'modal-xxl' })
- .afterClosed().subscribe(() => this.buildGrid());
+ .afterClosed().subscribe((res) => {
+ res && this.buildGrid();
+ });
} else if (action === 'run') {
this.userResourceService
.runExploratoryEnvironment({ notebook_instance_name: data.name, project_name: data.project })
@@ -237,7 +236,9 @@ export class ResourcesGridComponent implements OnInit {
error => this.toastr.error(error.message || 'Exploratory starting failed!', 'Oops!'));
} else if (action === 'stop') {
this.dialog.open(ConfirmationDialogComponent, { data: { notebook: data, type: ConfirmationDialogType.StopExploratory }, panelClass: 'modal-sm' })
- .afterClosed().subscribe((res) => res && this.buildGrid());
+ .afterClosed().subscribe((res) => {
+ res && this.buildGrid();
+ });
} else if (action === 'terminate') {
this.dialog.open(ConfirmationDialogComponent, { data:
{ notebook: data, type: ConfirmationDialogType.TerminateExploratory }, panelClass: 'modal-sm' })
@@ -285,24 +286,6 @@ export class ResourcesGridComponent implements OnInit {
});
this.bucketsList = SortUtils.flatDeep(bucketsList, 1).filter(v => v.children.length);
- // this.bucketsList = [
- // {
- // children: [{name: 'SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket.SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket', endpoint: 'local'}],
- // cloud: 'GCP',
- // name: 'Proj1 (local)'
- // },
- // {
- // children: [{name: 'SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket.SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket', endpoint: 'local'}],
- // cloud: 'GCP',
- // name: 'Proj1 (local)'
- // },
- // {
- // children: [{name: 'SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket.SERVICE_BASE_NAME-${EDGE_USER_NAME}-bucket', endpoint: 'local'}],
- // cloud: 'GCP',
- // name: 'Proj1 (local)'
- // },
- // ],
- // console.log(this.bucketsList);
}
@@ -450,4 +433,8 @@ export class ResourcesGridComponent implements OnInit {
}).subscribe();
}
+ public trackBy(index, item) {
+ return null;
+ }
+
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.component.ts
index b8a2cff..5d39c68 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-dialog/confirmation-dialog/confirmation-dialog.component.ts
@@ -60,12 +60,12 @@ export class ConfirmationDialogComponent implements OnInit {
}
ngOnInit() {
- if(this.data.type !== 5){
+ if (this.data.type !== 5) {
this.confirmationType = this.data.type;
this.notebook = this.data.notebook;
this.model = new ConfirmationDialogModel(this.confirmationType, this.notebook,
response => {
- if (response.status === HTTP_STATUS_CODES.OK) this.dialogRef.close();
+ if (response.status === HTTP_STATUS_CODES.OK) this.dialogRef.close(true);
},
error => this.toastr.error(error.message || 'Action failed!', 'Oops'),
this.data.manageAction,
@@ -75,7 +75,9 @@ export class ConfirmationDialogComponent implements OnInit {
if (!this.confirmationType) this.filterResourcesByType(this.notebook.resources);
this.isAliveResources = this.model.isAliveResources(this.notebook.resources);
- this.onlyKilled = this.notebook.resources ? !this.notebook.resources.some(el => el.status !== 'terminated' && el.status !== 'failed') : false;
+ this.onlyKilled = this.notebook.resources ?
+ !this.notebook.resources.some(el => el.status !== 'terminated' && el.status !== 'failed')
+ : false;
}
}
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_dialogs.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_dialogs.scss
index 71ca6da..e4d0418 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_dialogs.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_dialogs.scss
@@ -52,7 +52,8 @@
}
.modal-fullscreen {
- width: 100vw;
+ width: 90vw;
+ max-width: 90vw !important;
min-height: 80vh;
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org