reload folder after success upload event only if is the event is related to the current folder #1637 (#1813)

demo-shell-ng2/app/components/files/files.component.html

@@ -1,8 +1,7 @@
 <div class="container">
     <alfresco-upload-drag-area
             [rootFolderId]="documentList.currentFolderId"
-            [versioning] = "versioning"
+            [versioning] = "versioning">
-            (onSuccess)="documentList.reload()">
         <alfresco-document-list-breadcrumb
             [target]="documentList"
             [folderNode]="documentList.folderNode">
@@ -145,23 +144,23 @@
     <br/>
 </div>
 <div *ngIf="!acceptedFilesTypeShow">
-    <alfresco-upload-button data-automation-id="multiple-file-upload"
+    <alfresco-upload-button #uploadButton
+                            data-automation-id="multiple-file-upload"
                             [rootFolderId]="documentList.currentFolderId"
                             [multipleFiles]="multipleFileUpload"
                             [uploadFolders]="folderUpload"
-                            [versioning] = "versioning"
+                            [versioning] = "versioning">
-                            (onSuccess)="documentList.reload()">
         <div class="mdl-spinner mdl-js-spinner is-active"></div>
     </alfresco-upload-button>
 </div>
 <div *ngIf="acceptedFilesTypeShow">
-    <alfresco-upload-button data-automation-id="multiple-file-upload"
+    <alfresco-upload-button #uploadButton
+                            data-automation-id="multiple-file-upload"
                             [rootFolderId]="documentList.currentFolderId"
                             [acceptedFilesType]="acceptedFilesType"
                             [multipleFiles]="multipleFileUpload"
                             [uploadFolders]="folderUpload"
-                            [versioning] = "versioning"
+                            [versioning] = "versioning">
-                            (onSuccess)="documentList.reload()">
         <div class="mdl-spinner mdl-js-spinner is-active"></div>
     </alfresco-upload-button>
 </div>

demo-shell-ng2/app/components/files/files.component.ts

@@ -15,18 +15,19 @@
  * limitations under the License.
  */
 
-import { Component, OnInit, Optional, ViewChild, ChangeDetectorRef } from '@angular/core';
+import { Component, OnInit, AfterViewInit, Optional, ViewChild, ViewChildren, ChangeDetectorRef } from '@angular/core';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { AlfrescoAuthenticationService, LogService } from 'ng2-alfresco-core';
 import { DocumentActionsService, DocumentListComponent, ContentActionHandler, DocumentActionModel, FolderActionModel } from 'ng2-alfresco-documentlist';
 import { FormService } from 'ng2-activiti-form';
+import { UploadButtonComponent, UploadDragAreaComponent } from 'ng2-alfresco-upload';
 
 @Component({
     selector: 'files-component',
     templateUrl: './files.component.html',
     styleUrls: ['./files.component.css']
 })
-export class FilesComponent implements OnInit {
+export class FilesComponent implements OnInit, AfterViewInit {
     // The identifier of a node. You can also use one of these well-known aliases: -my- | -shared- | -root-
     currentFolderId: string = '-my-';
 
@@ -42,6 +43,12 @@ export class FilesComponent implements OnInit {
     @ViewChild(DocumentListComponent)
     documentList: DocumentListComponent;
 
+    @ViewChild(UploadButtonComponent)
+    uploadButton: UploadButtonComponent;
+
+    @ViewChild(UploadDragAreaComponent)
+    uploadDragArea: UploadDragAreaComponent;
+
     constructor(private documentActions: DocumentActionsService,
                 private authService: AlfrescoAuthenticationService,
                 private formService: FormService,
@@ -113,6 +120,20 @@ export class FilesComponent implements OnInit {
         }
     }
 
+    ngAfterViewInit() {
+        this.uploadButton.onSuccess
+            .debounceTime(100)
+            .subscribe((event)=> {
+                this.reload(event);
+            });
+
+        this.uploadDragArea.onSuccess
+            .debounceTime(100)
+            .subscribe((event)=> {
+                this.reload(event);
+            });
+    }
+
     viewActivitiForm(event?: any) {
         this.router.navigate(['/activiti/tasksnode', event.value.entry.id]);
     }
@@ -146,4 +167,12 @@ export class FilesComponent implements OnInit {
             window.alert(`Starting BPM process: ${processDefinition.id}`);
         }.bind(this);
     }
+
+    reload(event: any) {
+        if (event && event.value && event.value.entry && event.value.entry.parentId) {
+            if (this.documentList.currentFolderId === event.value.entry.parentId) {
+                this.documentList.reload();
+            }
+        }
+    }
 }

ng2-components/ng2-alfresco-documentlist/src/components/document-list.component.ts

@@ -291,6 +291,7 @@ export class DocumentListComponent implements OnInit, OnChanges, AfterContentIni
         if (node && node.entry && node.entry.isFolder) {
             this.currentFolderId = node.entry.id;
             this.folderNode = node.entry;
+            this.skipCount = 0;
             this.loadFolder();
             this.folderChange.emit(new NodeEntryEvent(node.entry));
             return true;
@@ -319,10 +320,11 @@ export class DocumentListComponent implements OnInit, OnChanges, AfterContentIni
     // gets folder node and its content
     loadFolderByNodeId(nodeId: string) {
         this.documentListService.getFolderNode(nodeId).then(node => {
-            this.folderNode = node;
+                this.folderNode = node;
-            this.currentFolderId = node.id;
+                this.currentFolderId = node.id;
-            this.loadFolderNodesByFolderNodeId(node.id, this.pageSize, this.skipCount).catch(err => this.error.emit(err));
+                this.skipCount = 0;
-        })
+                this.loadFolderNodesByFolderNodeId(node.id, this.pageSize, this.skipCount).catch(err => this.error.emit(err));
+            })
             .catch(err => this.error.emit(err));
     }