From 3b642d7514aac1b0b2d70f9d6af1d645dc254b01 Mon Sep 17 00:00:00 2001
From: Kai Reinhard <K.Reinhard@micromata.de>
Date: Tue, 18 Dec 2018 01:31:25 +0000
Subject: [PATCH] tree view...

---
 borgbutler-webapp/src/components/views/archives/FileListPanel.jsx |   31 ++++++++++++++++++++++++++++---
 1 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx b/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
index 8e01937..ba8f72f 100644
--- a/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
+++ b/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import {Button} from 'reactstrap';
+import {Button, Breadcrumb, BreadcrumbItem} from 'reactstrap';
 import {getRestServiceUrl} from '../../../utilities/global';
 import ErrorAlert from '../../general/ErrorAlert';
 import FileListTable from "./FileListTable";
@@ -24,9 +24,21 @@
 
     handleInputChange = (event) => {
         event.preventDefault();
-        this.setState({filter: {...this.state.filter, [event.target.name]: event.target.value}});
+        let target = event.target.name;
+        this.setState({filter: {...this.state.filter, [event.target.name]: event.target.value}},
+            () => {
+                if (target === 'mode') {
+                    this.fetchArchiveFileList();
+                }
+            });
     };
 
+    changeCurrentDirectory = (currentDirectory) => {
+        this.setState({filter: {...this.state.filter, currentDirectory: currentDirectory}},
+            () => {
+                this.fetchArchiveFileList();
+            });
+    };
 
     fetchArchiveFileList = (force) => {
         let forceReload = false;
@@ -62,6 +74,7 @@
 
     render = () => {
         let content = undefined;
+        let breadcrumb = undefined;
 
         if (this.state.isFetching) {
             content = <i>Loading...</i>;
@@ -81,6 +94,15 @@
                         borg backup server</Button>
                 </React.Fragment>;
             } else {
+                if (this.state.filter.mode === 'tree') {
+                    breadcrumb = <Breadcrumb>
+                        <BreadcrumbItem><a href="#">Home</a></BreadcrumbItem>
+                        <BreadcrumbItem><a href="#">Library</a></BreadcrumbItem>
+                        <BreadcrumbItem active>Data</BreadcrumbItem>
+                    </Breadcrumb>;
+                } else {
+                    breadcrumb = '';
+                }
                 content = <React.Fragment>
                     <FileListFilter
                         filter={this.state.filter}
@@ -90,10 +112,13 @@
                             this.fetchArchiveFileList();
                         }}
                     />
+                    {breadcrumb}
                     <FileListTable
                         archiveId={this.props.archiveId}
                         entries={this.state.fileList}
-                        search={this.state.filter.search}/>
+                        search={this.state.filter.search}
+                        mode={this.state.filter.mode}
+                        changeCurrentDirectory={this.changeCurrentDirectory}/>
                 </React.Fragment>;
             }
         }

--
Gitblit v1.10.0