From 2263f412817d6d2d36372e7617feb0d97fa57af8 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Tue, 4 Jul 2017 02:11:44 +0200
Subject: break out browser and tasks

---
 client/components/Browser/Browser.jsx | 57 +++++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)
 create mode 100644 client/components/Browser/Browser.jsx

(limited to 'client/components/Browser/Browser.jsx')

diff --git a/client/components/Browser/Browser.jsx b/client/components/Browser/Browser.jsx
new file mode 100644
index 0000000..10b86c3
--- /dev/null
+++ b/client/components/Browser/Browser.jsx
@@ -0,0 +1,57 @@
+import { h, Component } from 'preact'
+
+import Folders from './Folders/Folders.jsx'
+import Folder from './Folder/Folder.jsx'
+
+import client from '../../client'
+
+class Browser extends Component {
+  constructor(props) {
+    super()
+    let openFolders = JSON.parse( localStorage['openFolders'] || 'null' )
+    this.state = {
+      folders: [],
+      openFolders: openFolders || [],
+    }
+    client.folder.index().then( folders => this.setState({ folders }) )
+  }
+  openFolder(folder) {
+    if (this.state.openFolders.indexOf(folder.id) === -1) {
+      const newOpenFolders = this.state.openFolders.concat(folder.id)
+      localStorage['openFolders'] = JSON.stringify(newOpenFolders)
+      this.setState({ openFolders: newOpenFolders })
+    }
+  }
+  closeFolder(folder) {
+    const openFolders = this.state.openFolders.filter( folder_id => folder_id !== folder.id )
+    localStorage['openFolders'] = JSON.stringify(openFolders)
+    this.setState({ openFolders })
+  }
+  addFolder(folder) {
+    this.setState({ folders: this.state.folders.concat([folder]) })
+  }
+  render() {
+    const openFolders = this.state.openFolders.map((folder_id) => {
+      const folder_list = this.state.folders.filter(folder => folder.id === folder_id)
+      if (! folder_list.length) return
+      const folder = folder_list[0]
+      return (
+        <Folder
+          folder={folder}
+          onClose={() => this.closeFolder(folder)}
+        />
+      )
+    })
+    return (
+      <div class='column'>
+        <Folders folders={this.state.folders}
+          openFolder={(folder) => this.openFolder(folder)}
+          addFolder={(folder) => this.addFolder(folder)}
+        />
+        {openFolders}
+      </div>
+    )
+  }
+}
+
+export default Browser
-- 
cgit v1.2.3-70-g09d2

