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

hshpak pushed a commit to branch fix/Libs-problem
in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git

commit 064ac1ca831d3ef7bf091b96e42a51181ca100d3
Author: Hennadii_Shpak <[email protected]>
AuthorDate: Mon Jul 18 17:36:41 2022 +0300

    initial commit
---
 .../image-detail-dialog.component.html             |   6 +-
 .../image-detail-dialog.component.ts               | 110 ++++++++++++++++++++-
 .../library-info-modal.component.html              |   2 +-
 .../src/app/resources/images/images.component.html |   2 +-
 .../src/app/resources/images/images.model.ts       |   1 +
 5 files changed, 113 insertions(+), 8 deletions(-)

diff --git 
a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.html
 
b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.html
index 8dc21e587..3029ee3fd 100644
--- 
a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.html
+++ 
b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/image-detail-dialog/image-detail-dialog.component.html
@@ -54,9 +54,9 @@
       <div class="image__libraries--wrapper">
         <span class="modal-row__item modal-row__item--title">Installed 
libraries` groups</span>
         <div class="language__wrapper modal-row__item">
-          <div *ngIf="data.image.libraries.length; else notAvailable">
-            <div *ngFor="let library of data.image.libraries" 
class="library__wrapper">
-              <span>{{library.group | libNameNormalize}}</span>
+          <div *ngIf="libraryList.length; else notAvailable">
+            <div *ngFor="let library of libraryList" class="library__wrapper">
+              <span>{{library.name | libNameNormalize}}</span>
               <i (click)="onLibraryInfo(library)" class="material-icons 
library__info">info</i>
             </div>
           </div>
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 2659ee7d0..acb2a5e1c 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
@@ -22,6 +22,73 @@ import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from 
'@angular/material/dialog
 import {Library, ModalData} from '../../images';
 import {LibraryInfoModalComponent} from 
'../library-info-modal/library-info-modal.component';
 
+const libraryMock: Library[] = [
+  {
+    add_pkgs: [],
+    available_versions: [],
+    error_message: 'no_error\n',
+    group: 'os_pkg',
+    name: 'csvkit',
+    status: 'installed',
+    version: '1.0.2-2',
+  },
+  {
+    add_pkgs: [],
+    available_versions: [],
+    error_message: ' ',
+    group: 'pip3',
+    name: 'sScrapy',
+    status: 'installed',
+    version: '2.6.1',
+  },
+  {
+    add_pkgs: [],
+    available_versions: [],
+    error_message: ' ',
+    group: 'pip3',
+    name: 'zScrapy',
+    status: 'installed',
+    version: '2.6.1',
+  }
+  ,
+  {
+    add_pkgs: [],
+    available_versions: [],
+    error_message: ' ',
+    group: 'pip3',
+    name: 'aScrapy',
+    status: 'installed',
+    version: '2.6.1',
+  },
+  {
+    add_pkgs: null,
+    available_versions: null,
+    error_message: null,
+    group: 'java',
+    name: 'io.github.egonw.bacting:bioclipse-core',
+    status: 'installed',
+    version: '2.8.0.15',
+  },
+  {
+    add_pkgs: null,
+    available_versions: null,
+    error_message: null,
+    group: 'java',
+    name: 'io.github.egonw.bacting:bioclipse-core',
+    status: 'installed',
+    version: '2.8.0.15',
+  },
+  {
+    add_pkgs: [],
+    available_versions: [],
+    error_message: ' ',
+    group: 'others',
+    name: 'Pillow3f',
+    status: 'installed',
+    version: '0.0.7',
+  }
+];
+
 @Component({
   selector: 'datalab-image-detail-dialog',
   templateUrl: './image-detail-dialog.component.html',
@@ -31,20 +98,57 @@ import {LibraryInfoModalComponent} from 
'../library-info-modal/library-info-moda
   ]
 })
 
-export class ImageDetailDialogComponent {
+export class ImageDetailDialogComponent implements OnInit {
   maxDescriptionLength: number = 170;
+  libraryList = [];
+
   constructor(
     public dialogRef: MatDialogRef<ImageDetailDialogComponent>,
     @Inject(MAT_DIALOG_DATA) public data: ModalData,
     private dialog: MatDialog,
   ) { }
 
-  onLibraryInfo(library: Library): void {
+  ngOnInit() {
+    this.data.image.libraries = libraryMock;
+    this.libraryList = this.normalizeLibraries();
+    console.log(this.normalizeLibraries());
+  }
+
+  onLibraryInfo(libraryList): void {
     this.dialog.open(LibraryInfoModalComponent, {
       data: {
-        library
+        libraryList
       },
       panelClass: 'library-dialog-container'
     });
   }
+
+  private normalizeLibraries() {
+    return this.data.image.libraries.reduce((acc, item) => {
+      const libraryName = this.normalizeLibraryName(item);
+      const isLibAdded = acc.find(({name}) => item.group === name);
+      if (!isLibAdded) {
+        const newLibrary = {
+          name: item.group,
+          libs: [`${libraryName} v ${item.version}`]
+        };
+        acc.push(newLibrary);
+      } else {
+        acc.find(({name}) => item.group === name).libs.push(`${libraryName} v 
${item.version}`);
+      }
+      return acc;
+    }, [])
+      .map(item => {
+        item.libs.sort();
+        return item;
+    });
+  }
+
+  private normalizeLibraryName(library: Library): string {
+    if (library.group === 'java') {
+      const [, libName] = library.name.split(':');
+      return libName;
+    }
+    return library.name;
+  }
 }
diff --git 
a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/library-info-modal/library-info-modal.component.html
 
b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/library-info-modal/library-info-modal.component.html
index df0e9e5c1..2e641d89b 100644
--- 
a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/library-info-modal/library-info-modal.component.html
+++ 
b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/library-info-modal/library-info-modal.component.html
@@ -24,7 +24,7 @@
   </header>
 
   <div class="content-box">
-    <div class="library__wrapper" *ngFor="let library of 
data.library.add_pkgs">
+    <div class="library__wrapper" *ngFor="let library of 
data.libraryList.libs">
       <span>{{library}}</span>
     </div>
   </div>
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 2340e9765..4cfd71419 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
@@ -207,7 +207,7 @@
           </i>
         </div>
       </th>
-      <td mat-cell *matCellDef="let element"> {{element.application}} </td>
+      <td mat-cell *matCellDef="let element"> {{element.templateName}} </td>
     </ng-container>
 
     <ng-container matColumnDef="instanceName">
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 24ce705bc..6d5c8bafd 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
@@ -20,6 +20,7 @@ export interface ImageModel {
   libraries: Library[];
   computationalLibraries: Library[];
   clusterConfig: ClusterConfig;
+  templateName: string;
 }
 
 export interface ShareImageAllUsersParams {


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to