Partial export processing

2020-06-17 16:57:57 -05:00
parent e69dfa9565
commit 53a236000e
9 changed files with 436 additions and 137 deletions
--- a/src/containers/SkynetExport/SkynetExport.js
+++ b/src/containers/SkynetExport/SkynetExport.js
@@ -0,0 +1,144 @@
+import React from 'react';
+import './SkynetExport.css';
+import CheckboxTree from 'react-checkbox-tree';
+import {connect} from 'react-redux';
+import IPCContainer from '../IPCContainer/IPCContainer';
+import {notifyApplicationBusy} from '../../redux/actions/common_actions';
+import {notifyError} from '../../redux/actions/error_actions';
+import Box from '../../components/UI/Box/Box';
+import {displaySkynetExport} from '../../redux/actions/skynet_actions';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {
+  faCheckSquare, faChevronDown,
+  faChevronRight, faFile, faFolder, faFolderOpen,
+  faHSquare, faMinusSquare, faPlusSquare,
+  faSquare, faSquareFull, faSquareRootAlt
+} from '@fortawesome/free-solid-svg-icons';
+
+const Constants = require('../../constants');
+
+const mapStateToProps = state => {
+  return {
+    AppBusy: state.common.AppBusy,
+  };
+};
+
+const mapDispatchToProps = dispatch => {
+  return {
+    displaySkynetExport: display => dispatch(displaySkynetExport(display)),
+    notifyApplicationBusy: busy => dispatch(notifyApplicationBusy(busy, true)),
+    notifyError: msg => dispatch(notifyError(msg)),
+  }
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(class extends IPCContainer {
+  state = {
+    checked: [],
+    expanded: [],
+    nodes: [],
+  }
+
+  componentDidMount() {
+    this.setRequestHandler(Constants.IPC_Grab_Skynet_Tree_Reply, this.onGrabSkynetTreeReply);
+    this.setRequestHandler(Constants.IPC_Export_Skylinks_Reply, this.onExportSkylinksReply);
+    this.sendRequest(Constants.IPC_Grab_Skynet_Tree, {Version: this.props.version});
+  }
+
+  componentWillUnmount() {
+    super.componentWillUnmount();
+  }
+
+  createNodes = items => {
+    /*
+    {
+      name: '',
+      path: '',
+      directory: true/false,
+      children: [],
+    }
+     */
+    const ret = [];
+    for (const item of items) {
+      const treeItem = {
+        label: item.name,
+        path: item.path,
+        value: item.name === '/' ? 0 : JSON.stringify(item),
+      };
+
+      if (item.directory) {
+        treeItem.children = this.createNodes(item.children);
+      }
+
+      ret.push(treeItem);
+    }
+
+    return ret;
+  }
+
+  onGrabSkynetTreeReply = (_, arg) => {
+    if (arg.data.Success) {
+      this.setState({
+        checked: [],
+        expanded: [0],
+        nodes: this.createNodes(arg.data.Result),
+      });
+    } else {
+      this.setState({
+        checked: [],
+        expanded: [],
+        nodes: [],
+      }, () => {
+        this.props.notifyError(arg.data.Error);
+      });
+    }
+  }
+
+  onExportSkylinksReply = (_, arg) => {
+
+  }
+
+  render() {
+    console.log(this.state.expanded);
+    return this.props.AppBusy ? (<div/>) : (
+      <Box dxDark dxStyle={{
+        height: '90vh',
+        padding: 'var(--default_spacing)',
+        width: 'calc(100vw - (var(--default_spacing) * 4)'
+      }}>
+        <div
+          style={{
+            float: 'right',
+            margin: 0,
+            padding: 0,
+            marginTop: '-4px',
+            boxSizing: 'border-box',
+            display: 'block'
+          }}>
+          <a href={'#'}
+             onClick={() => this.props.displaySkynetExport(false)}
+             style={{cursor: 'pointer'}}>X</a>
+        </div>
+        <h1 className={'SkynetExportHeading'}>{'Export Files'}</h1>
+        <CheckboxTree checked={this.state.checked}
+                      expanded={this.state.expanded}
+                      icons={{
+                        check: <FontAwesomeIcon icon={faCheckSquare}/>,
+                        uncheck: <FontAwesomeIcon icon={faSquare}/>,
+                        halfCheck: <FontAwesomeIcon icon={faHSquare}/>,
+                        expandClose: <FontAwesomeIcon icon={faChevronRight}/>,
+                        expandOpen: <FontAwesomeIcon icon={faChevronDown}/>,
+                        expandAll: <FontAwesomeIcon icon={faPlusSquare}/>,
+                        collapseAll: <FontAwesomeIcon icon={faMinusSquare}/>,
+                        parentClose: <FontAwesomeIcon icon={faFolder}
+                                                      color={'var(--heading_text_color)'}/>,
+                        parentOpen: <FontAwesomeIcon icon={faFolderOpen}
+                                                     color={'var(--heading_text_color)'}/>,
+                        leaf: <FontAwesomeIcon icon={faFile} color={'var(--heading_text_color)'}/>
+                      }}
+                      nodes={this.state.nodes}
+                      onCheck={checked => this.setState({checked})}
+                      onExpand={expanded => this.setState({expanded})}/>
+      </Box>
+    );
+  }
+});