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/10 14:25:11 UTC

[incubator-dlab] branch develop updated: [DLAB-1984]: Added information if autocomplete does not work (#851)

This is an automated email from the ASF dual-hosted git repository.

dgnatyshyn pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git


The following commit(s) were added to refs/heads/develop by this push:
     new 475a4c9   [DLAB-1984]: Added information if autocomplete does not work (#851)
475a4c9 is described below

commit 475a4c92c9fad5ba7eddd13a29c75c33edb3d43a
Author: Dmytro Gnatyshyn <42...@users.noreply.github.com>
AuthorDate: Mon Aug 10 17:25:03 2020 +0300

     [DLAB-1984]: Added information if autocomplete does not work (#851)
    
    [DLAB-1984]: Added information if autocomplete does not work
---
 .../services/applicationServiceFacade.service.ts   |  2 +-
 .../core/services/librariesInstallation.service.ts |  4 +--
 .../bucket-browser/bucket-data.service.ts          | 33 ++++++++++----------
 .../detail-dialog/detail-dialog.component.html     |  2 +-
 .../install-libraries.component.html               | 18 ++++++-----
 .../install-libraries.component.ts                 | 36 ++++++++++++++++------
 .../webapp/src/assets/styles/_dialogs.scss         |  2 +-
 7 files changed, 59 insertions(+), 38 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 39e92af..30882f1 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
@@ -718,7 +718,7 @@ export class ApplicationServiceFacade {
     this.requestRegistry.Add(ApplicationServiceFacade.SETTINGS, '/api/settings');
 
     // Libraries Installation
-    this.requestRegistry.Add(ApplicationServiceFacade.LIB_GROUPS, '/api/infrastructure_provision/exploratory_environment/lib_groups');
+    this.requestRegistry.Add(ApplicationServiceFacade.LIB_GROUPS, '/api/infrastructure_provision/exploratory_environment/lib-groups');
     this.requestRegistry.Add(ApplicationServiceFacade.LIB_LIST, '/api/infrastructure_provision/exploratory_environment/search/lib_list');
     this.requestRegistry.Add(ApplicationServiceFacade.LIB_INSTALL, '/api/infrastructure_provision/exploratory_environment/lib_install');
     this.requestRegistry.Add(ApplicationServiceFacade.INSTALLED_LIBS_FORMAT,
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/librariesInstallation.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/librariesInstallation.service.ts
index 38d18bc..abdad3a 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/services/librariesInstallation.service.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/services/librariesInstallation.service.ts
@@ -29,8 +29,8 @@ export class LibrariesInstallationService {
   constructor(private applicationServiceFacade: ApplicationServiceFacade) {}
 
   public getGroupsList(project, exploratory, computational?): Observable<Response> {
-    let body = `?project_name=${project}&exploratory_name=${exploratory}`;
-    if (computational) body += `&computational_name=${computational}`;
+    let body = `/exploratory?project=${project}&exploratory=${exploratory}`;
+    if (computational) body = '/compute';
 
     return this.applicationServiceFacade
       .buildGetGroupsList(body)
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-data.service.ts b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-data.service.ts
index 700005f..96f8e2d 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-data.service.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-data.service.ts
@@ -44,25 +44,24 @@ export class BucketDataService {
 
   public refreshBucketdata(bucket, endpoint) {
     let backetData = [];
-
-    // this.bucketBrowserService.getBucketData(bucket, endpoint).subscribe(v => {
-    // const copiedData = JSON.parse(JSON.stringify(v));
-    // this.serverData = v;
-    // if (this.emptyFolder) {
-    //   copiedData.unshift(this.emptyFolder);
-    // }
-    //
-    // backetData = this.convertToFolderTree(copiedData);
-    // const data = this.buildFileTree({[bucket]: backetData}, 0);
-    // this._bucketData.next(data);
-    // });
+    this.bucketBrowserService.getBucketData(bucket, endpoint).subscribe(v => {
+    const copiedData = JSON.parse(JSON.stringify(v));
+    this.serverData = v;
     if (this.emptyFolder) {
-      array.unshift(this.emptyFolder);
+      copiedData.unshift(this.emptyFolder);
     }
-    this.serverData = array;
-    backetData = this.convertToFolderTree(array);
+
+    backetData = this.convertToFolderTree(copiedData);
     const data = this.buildFileTree({[bucket]: backetData}, 0);
     this._bucketData.next(data);
+    });
+  //   if (this.emptyFolder) {
+  //     array.unshift(this.emptyFolder);
+  //   }
+  //   this.serverData = array;
+  //   backetData = this.convertToFolderTree(array);
+  //   const data = this.buildFileTree({[bucket]: backetData}, 0);
+  //   this._bucketData.next(data);
   }
 
   public buildFileTree(obj: {[key: string]: any}, level: number): TodoItemNode[] {
@@ -132,14 +131,14 @@ export class BucketDataService {
         }
 
       });
-    };
+    }
 
     public processFolderArray = (acc, curr) => {
       const files = curr.object.split('/');
       this.processFiles(files, acc, curr);
 
       return acc;
-    };
+    }
 
     public convertToFolderTree = (data) => {
       const finalData = data.reduce(this.processFolderArray, {});
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
index 541c8a1..61e3ab2 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
@@ -60,7 +60,7 @@
             <p *ngIf="notebook.url?.length">Open following URL(s) in your browser to access this box:</p>
             <div class="links_block">
               <ng-container *ngFor="let item of notebook.url">
-                <span class="d-none" *ngIf="item.description === 'Ungit' && notebook.template_name.toLowerCase().indexOf('deep learning') !== -1; else ungit">
+                <span class="d-none" *ngIf="item.description.toLowerCase() === 'ungit' && notebook.template_name.toLowerCase().indexOf('zeppelin ') !== -1; else ungit">
                 </span>
                 <ng-template #ungit>
                   <p (mouseleave)="hideCopyIcon()">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.html
index 654f29b..f0f2c93 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.html
@@ -64,7 +64,8 @@
                   [matAutocomplete]="auto"
                   [formControl]="libSearch"
                   #trigger="matAutocompleteTrigger"
-                  (keyup.enter)="addLibrary(lib)"
+                  (keydown.enter)="addLibrary(lib)"
+                  (keyup)="clearLibSelection($event)"
                   class="library-input"
                 >
               </div>
@@ -85,12 +86,15 @@
                     </div>
                   </mat-option>
                 </ng-template>
-                <mat-option *ngIf="model.isEmpty(filteredList) && !validity_format">
+                <mat-option *ngIf="model.isEmpty(filteredList) && !validity_format && isAutoComplete">
                   <span class="configuring">No matches found</span>
                 </mat-option>
-                <mat-option *ngIf="validity_format?.length > 0">
+                <mat-option *ngIf="validity_format?.length > 0 && isAutoComplete">
                   <span class="configuring" >{{ validity_format }}</span >
                 </mat-option>
+                <mat-option *ngIf="!isAutoComplete && lib.name?.length > 1">
+                  <span class="configuring" >Autocomplete is currently unavailable for {{groupsListMap[group]}} group</span >
+                </mat-option>
               </mat-autocomplete>
             </div>
             <div class="control-group control-select">
@@ -102,13 +106,14 @@
                   [placeholder]="'Enter library version (optional)'"
                   [(ngModel)]="lib.version"
                   [disabled]="!lib.name"
-                  (keyup.enter)="addLibrary(lib)"
+                  (keydown.enter)="addLibrary(lib)"
                 >
+
                 <span class="plus-icon"
-                      [ngClass]="{'not-allow': !this.selectedLib || this.selectedLib?.isInSelectedList}"
+                      [ngClass]="{'not-allow': lib.name?.length < 2 || (isAutoComplete && !isLibSelected) || this.selectedLib?.isInSelectedList}"
                       matTooltip="Library is in selected list" matTooltipPosition="above" [matTooltipDisabled]="!this.selectedLib?.isInSelectedList"
                 >
-                  <mat-icon  (click)="addLibrary(lib)"  [ngClass]="{'not-allowed': !this.selectedLib || this.selectedLib?.isInSelectedList }">add</mat-icon>
+                  <mat-icon  (click)="addLibrary(lib)"  [ngClass]="{'not-allowed': lib.name?.length < 2 || (isAutoComplete && !isLibSelected) || this.selectedLib?.isInSelectedList }">add</mat-icon>
                 </span>
               </div>
             </div>
@@ -119,7 +124,6 @@
               <div class="control-group constol-select java-library-search">
                 <label class="label">Library</label>
                 <div class="control control-relative">
-<!--                 <span class="other-message" *ngIf="lib.name?.length && !this.selectedLib">groupId:artifactId:versionId</span>-->
                  <input
                     type="text" [placeholder]="'Enter library name in <groupId>:<artifactId>:<versionId> format'"
                     class="library-input"
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts
index 909fa4d..438d95d 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/install-libraries/install-libraries.component.ts
@@ -35,6 +35,10 @@ interface Library {
   version: string;
 }
 
+interface GetLibrary {
+  autoComplete: boolean;
+  libraries: Library[];
+}
 
 @Component({
   selector: 'install-libraries',
@@ -74,14 +78,14 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
   public filterConfiguration: FilterLibsModel = new FilterLibsModel('', [], [], [], []);
   public filterModel: FilterLibsModel = new FilterLibsModel('', [], [], [], []);
   public filtered: boolean;
+  public isAutoComplete: boolean;
   public filtredNotebookLibs: Array<any> = [];
-
   @ViewChild('groupSelect', { static: false }) group_select;
   @ViewChild('resourceSelect', { static: false }) resource_select;
   @ViewChild('trigger', { static: false }) matAutoComplete;
-  private isLibExist: boolean;
   public lib: Library = {name: '', version: ''};
   private selectedLib: any = null;
+  private isLibSelected: boolean = false;
 
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: any,
@@ -167,11 +171,13 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
   public onUpdate($event) {
     if ($event.model.type === 'group_lib') {
       this.group = $event.model.value;
+      this.isLibSelected = false;
       if (this.group) {
         this.libSearch.enable();
       }
       this.lib = {name: '', version: ''};
     } else if ($event.model.type === 'destination') {
+      this.isLibSelected = false;
       this.destination = $event.model.value;
       this.destination && this.destination.type === 'СOMPUTATIONAL'
         ? this.model.computational_name = this.destination.name
@@ -188,7 +194,7 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
   }
 
   public isDuplicated(item) {
-    if (this.filteredList) {
+    if (this.filteredList && this.filteredList.length) {
       if (this.group !== 'java') {
         this.selectedLib = this.filteredList.find(lib => lib.name.toLowerCase() === item.name.toLowerCase());
       } else {
@@ -196,14 +202,21 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
           return lib.name.toLowerCase() === item.name.substring(0, item.name.lastIndexOf(':')).toLowerCase();
         });
       }
+    } else if ( !this.isAutoComplete ) {
+      this.selectedLib = {
+        name: this.lib.name,
+        version: this.lib.version,
+        isInSelectedList: this.model.selectedLibs.some(el => el.name.toLowerCase() === this.lib.name.toLowerCase())
+      };
     } else {
       this.selectedLib = null;
     }
   }
 
   public addLibrary(item): void {
-    if (this.selectedLib && !this.selectedLib.isInSelectedList) {
-      if (this.group !== 'java') {
+    this.isLibSelected = false;
+    if ( !this.selectedLib.isInSelectedList) {
+      if ( this.selectedLib && this.group !== 'java') {
         this.model.selectedLibs.push({ group: this.group, name: item.name, version: item.version || 'N/A' });
       } else {
         this.model.selectedLibs.push({
@@ -225,6 +238,7 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
       this.libSearch.setValue(item.name + ':' + item.version);
       this.lib.name = item.name + ':' + item.version;
     } else {
+      this.isLibSelected = true;
       this.libSearch.setValue(item.name);
       this.lib.name = item.name;
     }
@@ -359,7 +373,7 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
               if (error.status === HTTP_STATUS_CODES.NOT_FOUND
                 || error.status === HTTP_STATUS_CODES.BAD_REQUEST
                 || error.status === HTTP_STATUS_CODES.INTERNAL_SERVER_ERROR) {
-                this.validity_format = error.message;
+                this.validity_format = error.message || '';
                 if (error.message.indexOf('query param artifact') !== -1 || error.message.indexOf('Illegal character') !== -1) {
                   this.validity_format = 'Wrong library name format. Should be <groupId>:<artifactId>:<versionId>.';
                 }
@@ -380,9 +394,9 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
       .pipe(
         takeUntil(this.unsubscribe$)
       )
-      .subscribe((libs: Library[]) => {
-        this.isLibExist = libs.some(v => v.name.toLowerCase() === this.lib.name.toLowerCase());
-        this.filteredList = libs;
+      .subscribe((libs: GetLibrary) => {
+        this.isAutoComplete = libs.autoComplete;
+        this.filteredList = libs.libraries;
         this.filteredList.forEach(lib => {
           lib.isInSelectedList = this.model.selectedLibs.some(el => el.name.toLowerCase() === lib.name.toLowerCase());
           lib.isInstalled = this.notebookLibs.some(libr => lib.name === libr.name &&
@@ -451,6 +465,10 @@ export class InstallLibrariesComponent implements OnInit, OnDestroy {
   public emitClick() {
       this.matAutoComplete.closePanel();
   }
+
+  public clearLibSelection(event) {
+    this.isLibSelected = false;
+  }
 }
 
 @Component({
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 e4d0418..2692c3c 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
@@ -362,7 +362,7 @@ mat-dialog-container {
 
 .bucket-browser{
   .mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {
-    width: calc(100% + 77px);
+    width: calc(100% + 85px);
   }
 }
 


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org