filemanager: Add path breadcrumbs and update dependencies

filemanager/src/views/Home.vue

@@ -28,8 +28,8 @@
     <template #header>
       <TopBar class="navbar">
         <template #left>
-          <Button icon="pi pi-chevron-left" @click="onGoUp()" text :disabled="cwd === '/'"/>
-          <span style="margin-left: 20px;">{{ cwd }}</span>
+          <Button icon="pi pi-chevron-left" @click="onGoUp()" text :disabled="cwd === '/'" style="margin-right: 5px;"/>
+          <PathBreadcrumbs :path="cwd" :activate-handler="onActivateBreadcrumb"/>
         </template>
         <template #right>
           <Button type="button" label="New" icon="pi pi-plus" @click="onCreateMenu" aria-haspopup="true" aria-controls="create_menu" style="margin-right: 10px" />
@@ -93,7 +93,7 @@ import Menu from 'primevue/menu';
 
 import { useConfirm } from 'primevue/useconfirm';
 
-import { DirectoryView, TopBar, BottomBar, MainLayout, FileUploader } from 'pankow';
+import { DirectoryView, TopBar, PathBreadcrumbs, BottomBar, MainLayout, FileUploader } from 'pankow';
 import { sanitize, buildFilePath } from 'pankow/utils';
 
 import PreviewPanel from '../components/PreviewPanel.vue';
@@ -114,6 +114,7 @@ export default {
     InputText,
     MainLayout,
     Menu,
+    PathBreadcrumbs,
     PreviewPanel,
     TopBar
   },
@@ -238,6 +239,9 @@ export default {
       this.activeItem = items[0] || null;
       this.selectedItems = items;
     },
+    onActivateBreadcrumb(path) {
+      this.cwd = sanitize(path);
+    },
     onGoUp() {
       this.cwd = sanitize(this.cwd.split('/').slice(0, -1).join('/'));
     },