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/04/23 16:15:51 UTC

[incubator-dlab] branch DLAB-1551 updated (470a2d7 -> 9e3ead2)

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

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


    from 470a2d7  Bucket browser for video
     new 32fe57f  Fix bug
     new 9e3ead2  Small change

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../core/interceptors/http.token.interceptor.ts    |   2 +-
 .../services/applicationServiceFacade.service.ts   |  29 +++++
 .../app/core/services/bucket-browser.service.ts    | 134 +++++++++++++--------
 .../bucket-browser/bucket-browser.component.html   |  16 +--
 .../bucket-browser/bucket-browser.component.scss   |  17 ++-
 .../bucket-browser/bucket-browser.component.ts     | 131 ++++++++++++++------
 .../folder-tree/folder-tree.component.ts           |  64 +++++-----
 .../detail-dialog/detail-dialog.component.html     |   4 +-
 .../detail-dialog/detail-dialog.component.ts       |   4 +-
 9 files changed, 275 insertions(+), 126 deletions(-)


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


[incubator-dlab] 02/02: Small change

Posted by dg...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit 9e3ead256baaee44a07538187f5835e3346a9ae7
Author: Dmytro Gnatyshyn <di...@ukr.net>
AuthorDate: Thu Apr 23 19:15:28 2020 +0300

    Small change
---
 .../webapp/src/app/resources/bucket-browser/bucket-browser.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

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 c9ac1a7..fef7d0d 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
@@ -42,7 +42,7 @@ export class BucketBrowserComponent implements OnInit {
   public endpoint = '';
 
   @ViewChild(FolderTreeComponent, {static: true}) folderTreeComponent;
-  private selectedFolder: any;
+  public selectedFolder: any;
   private isUploading: boolean;
   private selected: any[];
   private uploadForm: FormGroup;


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


[incubator-dlab] 01/02: Fix bug

Posted by dg...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit 32fe57f0acfe716e6c33059f6dcba3148f2ab03f
Author: Dmytro Gnatyshyn <di...@ukr.net>
AuthorDate: Thu Apr 23 19:11:57 2020 +0300

    Fix bug
---
 .../core/interceptors/http.token.interceptor.ts    |   2 +-
 .../services/applicationServiceFacade.service.ts   |  29 +++++
 .../app/core/services/bucket-browser.service.ts    | 134 +++++++++++++--------
 .../bucket-browser/bucket-browser.component.html   |  16 +--
 .../bucket-browser/bucket-browser.component.scss   |  17 ++-
 .../bucket-browser/bucket-browser.component.ts     | 129 +++++++++++++++-----
 .../folder-tree/folder-tree.component.ts           |  64 +++++-----
 .../detail-dialog/detail-dialog.component.html     |   4 +-
 .../detail-dialog/detail-dialog.component.ts       |   4 +-
 9 files changed, 274 insertions(+), 125 deletions(-)

diff --git a/services/self-service/src/main/resources/webapp/src/app/core/interceptors/http.token.interceptor.ts b/services/self-service/src/main/resources/webapp/src/app/core/interceptors/http.token.interceptor.ts
index ce476b4..29aa010 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/interceptors/http.token.interceptor.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/interceptors/http.token.interceptor.ts
@@ -33,7 +33,7 @@ import { Observable } from 'rxjs';
     if (token)
       headersConfig['Authorization'] = `Bearer ${token}`;
 
-    if (!request.headers.has('Content-Type') && !request.headers.has('Upload'))
+    if (!request.headers.has('Content-Type') && !request.headers.has('Upload') && request.url.indexOf('upload') === -1)
       headersConfig['Content-Type'] = 'application/json; charset=UTF-8';
 
     const header = request.clone({ setHeaders: headersConfig });
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 121188e..ebaec6d 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
@@ -52,6 +52,7 @@ export class ApplicationServiceFacade {
   private static readonly COMPUTATIONAL_RESOURCES = 'computational_resources';
   private static readonly COMPUTATIONAL_RESOURCES_DATAENGINE = 'computational_resources_dataengine';
   private static readonly COMPUTATIONAL_RESOURCES_DATAENGINESERVICE = 'computational_resources_dataengineservice';
+  private static readonly BUCKET = 'bucket';
   private static readonly USER_PREFERENCES = 'user_preferences';
   private static readonly BUDGET = 'budget';
   private static readonly ENVIRONMENT_HEALTH_STATUS = 'environment_health_status';
@@ -253,6 +254,31 @@ export class ApplicationServiceFacade {
       null);
   }
 
+  public buildGetBucketData(): Observable<any> {
+    return this.buildRequest(HTTPMethod.GET,
+      this.requestRegistry.Item(ApplicationServiceFacade.BUCKET) + '/ofuks-1304-prj1-local-bucket/endpoint/local',
+     null);
+  }
+
+  public buildUploadFileToBucket(data): Observable<any> {
+    return this.buildRequest(HTTPMethod.POST,
+      this.requestRegistry.Item(ApplicationServiceFacade.BUCKET) + '/upload',
+      data);
+  }
+
+  public buildDownloadFileFromBucket(data): Observable<any> {
+    return this.buildRequest(HTTPMethod.GET,
+      this.requestRegistry.Item(ApplicationServiceFacade.BUCKET),
+      data, { observe: 'response', responseType: 'text' } );
+  }
+
+  public buildDeleteFileFromBucket(data): Observable<any> {
+    return this.buildRequest(HTTPMethod.DELETE,
+      this.requestRegistry.Item(ApplicationServiceFacade.BUCKET),
+      data );
+  }
+
+
   public buildUpdateUserPreferences(data): Observable<any> {
     return this.buildRequest(HTTPMethod.POST,
       this.requestRegistry.Item(ApplicationServiceFacade.USER_PREFERENCES),
@@ -651,6 +677,9 @@ export class ApplicationServiceFacade {
     this.requestRegistry.Add(ApplicationServiceFacade.COMPUTATIONAL_RESOURCES_TEMLATES,
       '/api/infrastructure_templates/computational_templates');
 
+    // Bucket browser
+    this.requestRegistry.Add(ApplicationServiceFacade.BUCKET, '/api/bucket');
+
     // Filtering Configuration
     this.requestRegistry.Add(ApplicationServiceFacade.USER_PREFERENCES, '/api/user/settings');
     this.requestRegistry.Add(ApplicationServiceFacade.BUDGET, '/api/user/settings/budget');
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/bucket-browser.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/bucket-browser.service.ts
index fca1ba5..ff27ef5 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/services/bucket-browser.service.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/services/bucket-browser.service.ts
@@ -1,5 +1,8 @@
 import { Injectable } from '@angular/core';
-import {BehaviorSubject} from 'rxjs';
+import {BehaviorSubject, Observable} from 'rxjs';
+import {catchError, map} from 'rxjs/operators';
+import {ErrorUtils} from '../util';
+import {ApplicationServiceFacade} from './applicationServiceFacade.service';
 
 export class TodoItemNode {
   children: TodoItemNode[];
@@ -18,81 +21,93 @@ export class TodoItemFlatNode {
 /**
  * The Json object for to-do list data.
  */
-let TREE_DATA = {};
-const local = {
-  'dlab-local-shared-bucket': {
-    // folder: {
-    //   folder: {
-    //     folder: ['2008.cvs.bz2', 'airports.csv', 'carriers.csv'],
-    //     folder2: []
-    //   },
-    //   'folder1': [],
-    //   'file2': {size: 123.32},
-    //   'file3': {size: 5.34},
-    // },
-    '2008.cvs.bz2': {size: 125.34},
-    'airports.csv': {size: 33.12},
-    'carriers.csv': {size: 46.13},
-  }
+
+
+const array = [{'bucket': 'ofuks-1304-prj1-local-bucket', 'object': '4.txt', 'size': '18 bytes', 'creationDate': '21-4-2020 11:36:36'}, {'bucket': 'ofuks-1304-prj1-local-bucket', 'object': '5.txt', 'size': '18 bytes', 'creationDate': '21-4-2020 11:56:46'}, {'bucket': 'ofuks-1304-prj1-local-bucket', 'object': 'Untitled', 'size': '5 bytes', 'creationDate': '13-4-2020 03:39:11'}, {'bucket': 'ofuks-1304-prj1-local-bucket', 'object': 'adasdas', 'size': '1 KB', 'creationDate': '15-4-2020 02:17 [...]
+
+const processFiles = (files, target) => {
+  let pointer = target;
+  files.forEach((file, index) => {
+    if (!pointer[file]) {
+      pointer[file] = {};
+    }
+    pointer = pointer[file];
+  });
+
 };
-const projecta = {
-  'dlab-projecta-local-bucket': {
-    // folder: {
-    //   folder: {
-    //     folder: ['2008.cvs.bz2', 'airports.csv', 'carriers.csv'],
-    //     folder2: []
-    //   },
-    //   'folder1': [],
-    //   'file2': {size: 123.32},
-    //   'file3': {size: 5.34},
-    // },
-    '2008.cvs.bz2': {size: 125.34},
-    'airports.csv': {size: 33.12},
-    'carriers.csv': {size: 46.13},
-  }
+
+const processFolderArray = (acc, curr) => {
+  const files = curr.object.split('/').filter(x => x.length > 0);
+  processFiles(files, acc);
+  return acc;
 };
 
+const convertToFolderTree = (data) => data
+  .reduce(
+    processFolderArray,
+    {}
+  );
+
+const TREE_DATA = convertToFolderTree(array);
+
+
 @Injectable({
   providedIn: 'root'
 })
 export class BucketBrowserService {
-  dataChange = new BehaviorSubject<TodoItemNode[]>([]);
-
+  public dataChange = new BehaviorSubject<TodoItemNode[]>([]);
+  public serverData: any = [];
   get data(): TodoItemNode[] { return this.dataChange.value; }
 
-  constructor() {
+  constructor(private applicationServiceFacade: ApplicationServiceFacade) {
     this.initialize();
   }
 
-  initialize() {
-    const data = this.buildFileTree(TREE_DATA, 0);
-    this.dataChange.next(data);
+  public getBacketData(): Observable<{}> {
+    return this.applicationServiceFacade
+      .buildGetBucketData()
+      .pipe(
+        map(response => response),
+        catchError(ErrorUtils.handleServiceError));
+  }
+
+  public initialize() {
+    let backetData = [];
+    this.getBacketData().subscribe(v => {
+      this.serverData = v;
+      backetData = convertToFolderTree(v);
+      const data = this.buildFileTree({'ofuks-1304-prj1-local-bucket': backetData}, 0);
+      this.dataChange.next(data);
+    });
+    // this.serverData = array;
+    // backetData = convertToFolderTree(this.serverData);
+    // const data = this.buildFileTree({'ofuks-1304-prj1-local-bucket': backetData}, 0);
+    // this.dataChange.next(data);
   }
 
   /**
    * Build the file structure tree. The `value` is the Json object, or a sub-tree of a Json object.
    * The return value is the list of `TodoItemNode`.
    */
-  buildFileTree(obj: {[key: string]: any}, level: number): TodoItemNode[] {
+  public buildFileTree(obj: {[key: string]: any}, level: number): TodoItemNode[] {
     return Object.keys(obj).reduce<TodoItemNode[]>((accumulator, key) => {
       const value = obj[key];
       const node = new TodoItemNode();
       node.item = key;
-      if (!value.size) {
+      if (Object.keys(value).length) {
         if (typeof value === 'object') {
           node.children = this.buildFileTree(value, level + 1);
         } else {
           node.item = value;
         }
       } else {
-        node.size = value.size;
+        node.size = this.serverData.filter(v => v.object.indexOf(node.item) !== -1)[0];
       }
-
       return accumulator.concat(node);
     }, []);
   }
 
-  insertItem(parent: TodoItemNode, name, isFile) {
+  public insertItem(parent: TodoItemNode, name, isFile) {
     if (parent.children) {
       if (isFile) {
         parent.children.push(name as TodoItemNode);
@@ -103,19 +118,36 @@ export class BucketBrowserService {
     }
   }
 
-  updateItem(node: TodoItemNode, file) {
+  public updateItem(node: TodoItemNode, file) {
     node.item = file;
     this.dataChange.next(this.data);
   }
 
-  uploadFile(parent: TodoItemNode, name: string) {
-    if (parent.children) {
-      parent.children.push({item: name, children: []} as TodoItemNode);
-      this.dataChange.next(this.data);
-    }
+  public downloadFile(data) {
+    return this.applicationServiceFacade
+      .buildDownloadFileFromBucket(data)
+      .pipe(
+        map(response => response),
+        catchError(ErrorUtils.handleServiceError));
+  }
+
+  public uploadFile(data) {
+    return this.applicationServiceFacade
+      .buildUploadFileToBucket(data)
+      .pipe(
+        map(response => response),
+        catchError(ErrorUtils.handleServiceError));
   }
 
-  initBucket(bucketType) {
-    bucketType !== 'project' ? TREE_DATA = local : TREE_DATA = projecta;
+  public deleteFile(data) {
+    const url = JSON.stringify(data)
+    return this.applicationServiceFacade
+      .buildDeleteFileFromBucket(url)
+      .pipe(
+        map(response => response),
+        catchError(ErrorUtils.handleServiceError));
   }
+  // initBucket(bucketType) {
+  //   bucketType !== 'project' ? TREE_DATA = local : TREE_DATA = projecta;
+  // }
 }
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
index 79c272d..8671562 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.html
@@ -24,7 +24,7 @@
   </header>
   <div class="dialog-content tabs">
     <div class="submit m-bott-10 m-top-10">
-      <button mat-raised-button type="button" class="butt action"><input type="file" multiple (change)="handleFileInput($event.target.files)">Add file</button>
+      <button mat-raised-button type="button" class="butt action"><input type="file" (change)="handleFileInput($event)">Add file</button>
       <button mat-raised-button type="button" class="butt action" (click)="folderTreeComponent.addNewItem(selectedFolder, '', false)">Create folder</button>
     </div>
     <p class="path"><span>Bucket path:</span><span class="url"> {{path}}</span></p>
@@ -51,10 +51,11 @@
                   </span>
                 <span class="item-name">{{file.item}}</span>
               </div>
-              <div class="size">{{file.size}}MB</div>
-              <div class="progress-wrapper">
-<!--                <div class="progres" *ngIf="file.isSelected"><div class="bar"></div></div>-->
-              </div>
+              <div class="size">{{file.size.size}}</div>
+              <div class="size">{{file.size.creationDate }}</div>
+<!--              <div class="progress-wrapper">-->
+<!--&lt;!&ndash;                <div class="progres" *ngIf="file.isSelected"><div class="bar"></div></div>&ndash;&gt;-->
+<!--              </div>-->
             </div>
 
           </li>
@@ -81,8 +82,9 @@
     </div>
     <div class="text-center m-top-30 m-bott-30">
       <button type="button" class="butt" mat-raised-button (click)="this.dialogRef.close()">Close</button>
-      <button *ngIf="!this.addedFiles.length" type="button" class="butt butt-success" mat-raised-button (click)="downloadItems()" [disabled]="!selected?.length">Download</button>
-      <button *ngIf="this.addedFiles.length !== 0" type="button" class="butt butt-success" mat-raised-button (click)="uploadItems()">Upload</button>
+      <button *ngIf="!this.addedFiles.length" type="button" class="butt butt-success" mat-raised-button (click)="fileAction('download')" [disabled]="!selected?.length">Download</button>
+      <button *ngIf="!this.addedFiles.length" type="button" class="butt butt-success" mat-raised-button (click)="fileAction('delete')" [disabled]="!selected?.length">Delete</button>
+      <button *ngIf="this.addedFiles.length !== 0" type="button" class="butt butt-success" mat-raised-button (click)="uploadNewFile()">Upload</button>
     </div>
   </div>
 </div>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
index 7f004b4..b9033da 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/bucket-browser/bucket-browser.component.scss
@@ -54,14 +54,14 @@
 
   .text-center{
     position: absolute;
-    bottom: 50px;
+    bottom: 3vh;
     left: 0;
     right: 0;
   }
 }
 
 .backet-wrapper{
-  min-height: 450px;
+  height: 50vh;
   border: 2px solid rgba(0,0,0,.12);
   border-radius: 5px;
   display: flex;
@@ -225,6 +225,19 @@
 
 }
 
+@media only screen and (max-height: 840px) {
+  .backet-wrapper {
+    height: 45vh;
+  }
+}
+
+@media only screen and (max-height: 690px) {
+  .backet-wrapper {
+    height: 40vh;
+  }
+}
+
+
 
 
 
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 203bd08..c9ac1a7 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
@@ -25,6 +25,7 @@ import { ManageUngitService } from '../../core/services';
 
 import {FolderTreeComponent} from './folder-tree/folder-tree.component';
 import {BucketBrowserService, TodoItemNode} from '../../core/services/bucket-browser.service';
+import {FileUtils} from '../../core/util';
 
 @Component({
   selector: 'dlab-bucket-browser',
@@ -32,50 +33,62 @@ import {BucketBrowserService, TodoItemNode} from '../../core/services/bucket-bro
   styleUrls: ['./bucket-browser.component.scss']
 })
 export class BucketBrowserComponent implements OnInit {
-  filenames: Array<any> = [];
-  addedFiles = [];
-  folderItems = [];
-  path = '';
+  public filenames: Array<any> = [];
+  public addedFiles = [];
+  public folderItems = [];
+  public path = '';
+  public pathInsideBucket = '';
+  public bucketName = '';
+  public endpoint = '';
 
   @ViewChild(FolderTreeComponent, {static: true}) folderTreeComponent;
   private selectedFolder: any;
   private isUploading: boolean;
   private selected: any[];
+  private uploadForm: FormGroup;
 
   constructor(
-    @Inject(MAT_DIALOG_DATA) public data: 'string',
+    @Inject(MAT_DIALOG_DATA) public data: any,
     public toastr: ToastrService,
     public dialog: MatDialog,
     public dialogRef: MatDialogRef<BucketBrowserComponent>,
     private manageUngitService: ManageUngitService,
     private _fb: FormBuilder,
-    private bucketBrowserService: BucketBrowserService
+    private bucketBrowserService: BucketBrowserService,
+    private formBuilder: FormBuilder
   ) {
 
   }
 
   ngOnInit() {
-    this.bucketBrowserService.initBucket(this.data);
-    this.bucketBrowserService.initialize();
-    // console.log(this.data);
+    // this.bucketBrowserService.getBacketData();
+    this.endpoint = this.data.endpoint;
+    this.uploadForm = this.formBuilder.group({
+      file: ['']
+    });
   }
 
-  showItem(item) {
+  public showItem(item) {
     const flatItem = this.folderTreeComponent.nestedNodeMap.get(item);
     this.folderTreeComponent.showItem(flatItem);
   }
 
-  handleFileInput(files) {
+  public handleFileInput(event) {
     //   for (let i = 0; i < files.length; i++) {
     //     const file = files[i];
     //     const path = file.webkitRelativePath.split('/');
     //   }
     // }
-    this.filenames = Object['values'](files).map(v => ({item: v.name, 'size': (v.size / 1048576).toFixed(2)} as unknown as TodoItemNode));
-    this.addedFiles = [...this.addedFiles, ...this.filenames];
+    if (event.target.files.length > 0) {
+      const file = event.target.files[0];
+      this.uploadForm.get('file').setValue(file);
+      this.filenames = Object['values'](event.target.files).map(v => ({item: v.name, 'size': (v.size / 1048576).toFixed(2)} as unknown as TodoItemNode));
+      this.addedFiles = [...this.addedFiles, ...this.filenames];
+    }
+
   }
 
-  toggleSelectedFile(file) {
+  public toggleSelectedFile(file) {
     file.isSelected = !file.isSelected;
     this.selected = this.folderItems.filter(item => item.isSelected);
   }
@@ -89,12 +102,14 @@ export class BucketBrowserComponent implements OnInit {
     // console.log(this.addedFiles);
   }
 
-  onFolderClick(event) {
-    this.selectedFolder = event.element1;
+  public onFolderClick(event) {
+    this.selectedFolder = event.flatNode;
     this.folderItems = event.element ? event.element.children : event.children;
     // this.folderItems = this.folderItems.sort((a, b) => (a.children > b.children) ? 1 : -1)
     // console.log(this.folderItems);
     this.path = event.path;
+    this.pathInsideBucket = this.path.indexOf('/') !== -1 ?  this.path.slice(this.path.indexOf('/') + 1) + '/' : '';
+    this.bucketName = this.path.substring(0, this.path.indexOf('/')) || this.path;
     this.folderItems.forEach(item => item.isSelected = false);
   }
 
@@ -109,33 +124,81 @@ export class BucketBrowserComponent implements OnInit {
     });
   }
 
-  deleteAddedFile(file) {
+  public deleteAddedFile(file) {
     this.addedFiles.splice(this.addedFiles.indexOf(file), 1);
   }
 
-  uploadItems() {
-    this.isUploading = true;
-    setTimeout(() => this.upLoading(), 5000);
-  }
+  private uploadNewFile() {
+    const path = `${this.pathInsideBucket}${this.uploadForm.get('file').value.name}`;
 
-  downloadItems() {
-    setTimeout(() => this.downloadItemsAction(), 1000);
+    const formData = new FormData();
+    formData.append('file', this.uploadForm.get('file').value);
+    formData.append('object', path);
+    formData.append('bucket', 'ofuks-1304-prj1-local-bucket');
+    formData.append('endpoint', this.endpoint);
+    // file.inProgress = true;
+    this.isUploading = true;
+    this.bucketBrowserService.uploadFile(formData)
+      // .pipe(
+      // map(event => {
+      //   switch (event.type) {
+      //     case HttpEventType.UploadProgress:
+      //       file.progress = Math.round(event.loaded * 100 / event.total);
+      //       break;
+      //     case HttpEventType.Response:
+      //       return event;
+      //   }
+      // }),
+      // catchError((error: HttpErrorResponse) => {
+      //   file.inProgress = false;
+      //   return of(`${file.name} upload failed.`);
+      // }))
+      .subscribe((event: any) => {
+      //   if (typeof (event) === 'object') {
+      //     console.log(event.body);
+      //   }
+      // this.isUploading = false;
+        this.bucketBrowserService.initialize();
+        this.addedFiles = [];
+        this.isUploading = false;
+        this.toastr.success('File successfully uploaded!', 'Success!');
+      }, error => this.toastr.error(error.message || 'File uploading error!', 'Oops!')
+    );
   }
 
-  upLoading() {
-    this.addedFiles.forEach(v => {
-      this.folderTreeComponent.addNewItem(this.selectedFolder, v, true);
-    });
-    this.toastr.success(this.addedFiles.length === 1 ? 'File successfully uploaded' : 'Files successfully uploaded', 'Success!');
-    this.addedFiles = [];
-    this.isUploading = false;
-  }
+  public fileAction(action) {
+    this.selected = this.folderItems.filter(item => item.isSelected);
+    const path = encodeURIComponent(`${this.pathInsideBucket}${this.selected[0].item}`);
+    if (action === 'download') {
+      this.bucketBrowserService.downloadFile(`/${this.bucketName}/object/${path}/endpoint/${this.endpoint}/download`
+      ).subscribe(data =>  {
+        FileUtils.downloadFile(data);
+        // this.downLoadFile(response, 'aplication/octet-stream');
+          this.toastr.success('File downloading started!', 'Success!');
+        }, error => this.toastr.error(error.message || 'File downloading error!', 'Oops!')
+      );
+    }
+
+    if (action === 'delete') {
+      this.bucketBrowserService.deleteFile(`/${this.bucketName}/object/${path}/endpoint/${this.endpoint}`).subscribe(() => {
+        this.bucketBrowserService.initialize();
+          this.toastr.success('File successfully deleted!', 'Success!');
+        }, error => this.toastr.error(error.message || 'File deleting error!', 'Oops!')
+      );
+    }
 
-  downloadItemsAction() {
     this.folderItems.forEach(item => item.isSelected = false);
-    this.toastr.success(this.selected.length === 1 ? 'File downloading started' : 'Files downloading started', 'Success!');
     this.selected = this.folderItems.filter(item => item.isSelected);
   }
+
+  // downLoadFile(data: any, type: string) {
+  //   const blob = new Blob([data], { type: type});
+  //   const url = window.URL.createObjectURL(blob);
+  //   const pwa = window.open(url);
+  //   if (!pwa || pwa.closed || typeof pwa.closed === 'undefined') {
+  //     alert( 'Please disable your Pop-up blocker and try again.');
+  //   }
+  // }
 }
 
 
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 774a3c8..0b367c5 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
@@ -10,7 +10,7 @@ import {BucketBrowserService, TodoItemFlatNode, TodoItemNode} from '../../../cor
   templateUrl: './folder-tree.component.html',
   styleUrls: ['./folder-tree.component.scss']
 })
-export class FolderTreeComponent implements OnInit{
+export class FolderTreeComponent implements OnInit {
 
   @Output() showFolderContent: EventEmitter<any> = new EventEmitter();
 
@@ -35,6 +35,13 @@ export class FolderTreeComponent implements OnInit{
 
     bucketBrowserService.dataChange.subscribe(data => {
       this.dataSource.data = data;
+      if (!this.selectedFolder) {
+        const subject = this.dataSource._flattenedData;
+        subject.subscribe((subjectData) => {
+          this.treeControl.expand(subjectData[0]);
+          this.showItem(subjectData[0]);
+        });
+      }
     });
   }
 
@@ -59,40 +66,43 @@ export class FolderTreeComponent implements OnInit{
     this.flatNodeMap.set(flatNode, node);
     this.nestedNodeMap.set(node, flatNode);
     return flatNode;
-  };
+  }
 
 
   ngOnInit() {
-    const subject = this.dataSource._flattenedData;
-    subject.subscribe((data) => {
-      this.treeControl.expand(data[0]);
-      this.showItem(data[0]);
-    });
+    // const subject = this.dataSource._flattenedData;
+    // subject.subscribe((data) => {
+    //   this.treeControl.expand(data[0]);
+    //   this.showItem(data[0]);
+    // });
   }
 
   showItem(el) {
-    this.treeControl.expand(el);
-    this.selectedFolder = el;
-    const path = this.getpath(el);
-    this.path = [];
-    const data = {
-      flatNode: el,
-      element: this.flatNodeMap.get(el),
-      element1: el,
-      path: path.join('/')
-    };
-    this.showFolderContent.emit(data);
+    if (el) {
+      this.treeControl.expand(el);
+      this.selectedFolder = el;
+      const path = this.getPath(el);
+      this.path = [];
+      const data = {
+        flatNode: el,
+        element: this.flatNodeMap.get(el),
+        path: path.join('/')
+      };
+      this.showFolderContent.emit(data);
+    }
   }
 
-  getpath(el) {
-    if (this.path.length === 0) {
-      this.path.unshift(el.item);
-    }
-    if (this.getParentNode(el) !== null) {
-      this.path.unshift(this.getParentNode(el).item);
-      this.getpath(this.getParentNode(el));
+  getPath(el) {
+    if (el) {
+      if (this.path.length === 0) {
+        this.path.unshift(el.item);
+      }
+      if (this.getParentNode(el) !== null) {
+        this.path.unshift(this.getParentNode(el).item);
+        this.getPath(this.getParentNode(el));
+      }
+      return this.path;
     }
-    return this.path;
   }
 
   descendantsAllSelected(node: TodoItemFlatNode): boolean {
@@ -168,7 +178,7 @@ export class FolderTreeComponent implements OnInit{
     return null;
   }
 
-  addNewItem(node: TodoItemFlatNode, file, isFile) {
+  addNewItem(node: TodoItemFlatNode, file, isFile, path) {
     const parentNode = this.flatNodeMap.get(node);
     this.bucketBrowserService.insertItem(parentNode!, file, isFile);
     this.treeControl.expand(node);
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 8900116..817ca22 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,14 +60,14 @@
                 class="strong">{{ notebook.password }}</span></p>
 
             <p class="m-top-30">{{ DICTIONARY[PROVIDER].personal_storage }}: &nbsp;</p>
-            <div class="links_block" (click)="bucketBrowser('project')">
+            <div class="links_block" (click)="bucketBrowser('project', notebook.endpoint)">
               <p *ngIf="DICTIONARY[PROVIDER].cloud_provider === 'azure' && notebook.account_name">{{ DICTIONARY[PROVIDER].account }}
                 <span class="bucket-info">{{ notebook.account_name}}</span></p>
               <p *ngIf="notebook.bucket_name">{{ DICTIONARY[PROVIDER].container }} <span
                   class="bucket-info">{{ notebook.bucket_name }}</span></p>
             </div>
             <p>Shared endpoint bucket: &nbsp;</p>
-            <div class="links_block" (click)="bucketBrowser('endpoint')">
+            <div class="links_block" (click)="bucketBrowser('endpoint', notebook.endpoint)">
               <p *ngIf="DICTIONARY[PROVIDER].cloud_provider === 'azure' && notebook.shared_account_name">{{ DICTIONARY[PROVIDER].account }}
                 <span class="bucket-info">{{ notebook.shared_account_name}}</span></p>
               <p *ngIf="notebook.shared_bucket_name">{{ DICTIONARY[PROVIDER].container }}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
index 0d76b75..ca264b9 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
@@ -123,8 +123,8 @@ export class DetailDialogComponent implements OnInit {
         : null;
   }
 
-  public bucketBrowser(type): void {
-  this.dialog.open(BucketBrowserComponent, { data: type, panelClass: 'modal-fullscreen' })
+  public bucketBrowser(type, endpoint): void {
+  this.dialog.open(BucketBrowserComponent, { data: {type: type, endpoint: endpoint}, panelClass: 'modal-fullscreen' })
     .afterClosed().subscribe();
   }
 }


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