diff --git a/demo-shell/src/app/components/files/files.component.html b/demo-shell/src/app/components/files/files.component.html
index ac31aede7b..a8aa7ec3c5 100644
--- a/demo-shell/src/app/components/files/files.component.html
+++ b/demo-shell/src/app/components/files/files.component.html
@@ -21,6 +21,7 @@
                     <adf-breadcrumb fxShow fxHide.lt-sm="true"
                                     class="files-breadcrumb"
                                     root="Personal Files"
+                                    (navigate)="onBreadcrumbNavigate($event)"
                                     [target]="documentList"
                                     [folderNode]="documentList.folderNode">
                     </adf-breadcrumb>
diff --git a/demo-shell/src/app/components/files/files.component.ts b/demo-shell/src/app/components/files/files.component.ts
index 51dd49fd3d..67f87565d4 100644
--- a/demo-shell/src/app/components/files/files.component.ts
+++ b/demo-shell/src/app/components/files/files.component.ts
@@ -21,7 +21,7 @@ import {
 } from '@angular/core';
 import { MatDialog } from '@angular/material';
 import { ActivatedRoute, Params, Router } from '@angular/router';
-import { MinimalNodeEntity, NodePaging, Pagination, MinimalNodeEntryEntity, SiteEntry } from 'alfresco-js-api';
+import { MinimalNodeEntity, NodePaging, Pagination, PathElementEntity, MinimalNodeEntryEntity, SiteEntry } from 'alfresco-js-api';
 import {
     AuthenticationService, ContentService, TranslationService,
     FileUploadEvent, FolderCreatedEvent, LogService, NotificationService,
@@ -164,6 +164,10 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         this.router.navigate(['/files', $event.value.id]);
     }
 
+    onBreadcrumbNavigate(route: PathElementEntity) {
+        this.router.navigate(['/files', route.id]);
+    }
+
     toggleFolder() {
         this.multipleFileUpload = false;
         this.folderUpload = !this.folderUpload;