store open folders in localstorage

1 files changed, 93 insertions, 25 deletions

diff --git a/public/bundle.js b/public/bundle.js
index ab48687..d226fcc 100644
--- a/public/bundle.js
+++ b/public/bundle.js
@@ -2751,7 +2751,7 @@ var App = function (_Component) {
 
     var openFolders = JSON.parse(localStorage['openFolders'] || 'null');
     _this.state = {
-      folders: null,
+      folders: [],
       openFolders: openFolders || []
     };
     _client2.default.folder.index().then(function (folders) {
@@ -2763,11 +2763,22 @@ var App = function (_Component) {
   _createClass(App, [{
     key: 'openFolder',
     value: function openFolder(folder) {
-      if (this.state.openFolders.indexOf(folder) === -1) {
-        this.setState({ openFolders: this.state.openFolders.concat([folder]) });
+      if (this.state.openFolders.indexOf(folder.id) === -1) {
+        var newOpenFolders = this.state.openFolders.concat(folder.id);
+        localStorage['openFolders'] = JSON.stringify(newOpenFolders);
+        this.setState({ openFolders: newOpenFolders });
       }
     }
   }, {
+    key: 'closeFolder',
+    value: function closeFolder(folder) {
+      var openFolders = this.state.openFolders.filter(function (folder_id) {
+        return folder_id !== folder.id;
+      });
+      localStorage['openFolders'] = JSON.stringify(openFolders);
+      this.setState({ openFolders: openFolders });
+    }
+  }, {
     key: 'addFolder',
     value: function addFolder(folder) {
       this.setState({ folders: this.state.folders.concat([folder]) });
@@ -2777,8 +2788,18 @@ var App = function (_Component) {
     value: function render() {
       var _this2 = this;
 
-      var openFolders = this.state.openFolders.map(function (folder) {
-        return (0, _preact.h)(_Folder2.default, { folder: folder });
+      var openFolders = this.state.openFolders.map(function (folder_id) {
+        var folder_list = _this2.state.folders.filter(function (folder) {
+          return folder.id === folder_id;
+        });
+        if (!folder_list.length) return;
+        var folder = folder_list[0];
+        return (0, _preact.h)(_Folder2.default, {
+          folder: folder,
+          onClose: function onClose() {
+            return _this2.closeFolder(folder);
+          }
+        });
       });
       return (0, _preact.h)(
         'div',
@@ -5790,7 +5811,11 @@ var Header = function (_Component) {
       return (0, _preact.h)(
         'div',
         { 'class': 'header' },
-        'ding dong'
+        (0, _preact.h)(
+          'b',
+          null,
+          'spawn cortex'
+        )
       );
     }
   }]);
@@ -5887,32 +5912,49 @@ var Folders = function (_Component) {
           { key: i, onClick: function onClick() {
               return _this3.toggle(folder);
             } },
-          folder.name
+          (0, _preact.h)(
+            'span',
+            { 'class': 'name' },
+            folder.name
+          )
         );
       });
       return (0, _preact.h)(
         'div',
         { 'class': 'folders' },
         (0, _preact.h)(
-          'b',
-          null,
-          'folders'
+          'div',
+          { 'class': 'heading' },
+          (0, _preact.h)(
+            'b',
+            null,
+            'folders'
+          ),
+          (0, _preact.h)(
+            'div',
+            { 'class': 'buttons' },
+            (0, _preact.h)(
+              'button',
+              { onClick: function onClick() {
+                  return _this3.openModal();
+                } },
+              '+ folder'
+            )
+          )
         ),
-        ' ',
         (0, _preact.h)(
-          'button',
-          { onClick: function onClick() {
-              return _this3.openModal();
-            } },
-          '+ folder'
+          'div',
+          { 'class': 'list' },
+          folders
         ),
-        folders,
         (0, _preact.h)(
           _Modal2.default,
           { visible: this.state.adding, onClose: function onClose() {
               return _this3.closeModal();
             } },
-          (0, _preact.h)(_FolderForm2.default, { addFolder: this.props.addFolder })
+          (0, _preact.h)(_FolderForm2.default, { addFolder: this.props.addFolder, onClose: function onClose() {
+              return _this3.closeModal();
+            } })
         )
       );
     }
@@ -5988,6 +6030,7 @@ var FolderForm = function (_Component) {
       event.preventDefault();
       var rec = Object.assign({}, this.state);
       delete rec.error;
+      this.props.onClose();
       _client2.default.folder.create(rec).then(function (data) {
         _this2.props.addFolder(data);
       });
@@ -6087,6 +6130,11 @@ var Folder = function (_Component) {
       files: props.folder.files || []
     };
     _this.addFiles = _this.addFiles.bind(_this);
+    if (!props.folder.files) {
+      _client2.default.file.index({ folder_id: props.folder.id }).then(function (files) {
+        return _this.setState({ files: files });
+      });
+    }
     return _this;
   }
 
@@ -6109,20 +6157,40 @@ var Folder = function (_Component) {
         return (0, _preact.h)(
           'div',
           { key: i },
-          file.name
+          (0, _preact.h)(
+            'span',
+            { 'class': 'name' },
+            file.name
+          )
         );
       });
       return (0, _preact.h)(
         'div',
         { 'class': 'folders' },
         (0, _preact.h)(
-          'b',
-          null,
-          this.props.folder.name
+          'div',
+          { 'class': 'heading' },
+          (0, _preact.h)(
+            'b',
+            null,
+            this.props.folder.name
+          ),
+          (0, _preact.h)(
+            'div',
+            { 'class': 'buttons' },
+            (0, _preact.h)(_FileUploadButton2.default, { folder: this.props.folder, addFiles: this.addFiles }),
+            (0, _preact.h)(
+              'button',
+              { onClick: this.props.onClose },
+              'x'
+            )
+          )
         ),
-        ' ',
-        (0, _preact.h)(_FileUploadButton2.default, { folder: this.props.folder, addFiles: this.addFiles }),
-        files
+        (0, _preact.h)(
+          'div',
+          { 'class': 'list' },
+          files
+        )
       );
     }
   }]);