Properties load files

render-process/Editor/Properties.tsx

@@ -1,6 +1,7 @@
 import React, { Component } from "react";
 import { Menu, Input } from "antd";
 import * as fs from 'fs';
+import * as path from 'path';
 import { BehaviorTreeModel } from "../../common/BehaviorTreeModel";
 import { remote } from 'electron';
 import { MainProcess } from "../../main-process/MainProcess";
@@ -8,28 +9,60 @@ import Settings from "../../main-process/Settings";
 
 const { Search } = Input;
 
+interface TreeFile {
+  name: string;
+  path: string;
+}
+
 export interface PropertiesProps {
   workspace: string;
   onOpenTree: (path: string) => void;
-  trees: BehaviorTreeModel[];
 }
 
 interface PropertiesState {
-
+  treeList: TreeFile[]
 }
 
 export default class Properties extends Component<PropertiesProps> {
   state: PropertiesState = {
-
+    treeList: []
   };
 
   componentDidMount() {
+    var workspace = this.props.workspace;
+    if (workspace == '') {
+      workspace = this.getLastWorkspace();
+    }
+    this.setState({ treeList: this.getTreeList(workspace) });
+  }
+
+  getLastWorkspace() {
     const settings: Settings = remote.getGlobal("settings");
-    const lastWorkspace = settings.recentWorkspaces[0];
-    console.log("&&&&&& last workspace", lastWorkspace);
+    return settings.recentWorkspaces[0];
+  }
+
+  getTreeList(workspace: string) {
+    if (workspace == '' || !fs.existsSync(workspace)) {
+      console.log("workspace not exist", workspace);
+      return;
+    }
+
+    const files = fs.readdirSync(workspace);
+    const list: TreeFile[] = [];
+    files.forEach((filename) => {
+      const stat = fs.statSync(path.join(workspace, filename))
+      if (stat.isFile()) {
+        list.push({
+          name: filename.slice(0, -5),
+          path: workspace + '/' + name + '.json'
+        });
+      }
+    })
+    return list;
   }
 
   render() {
+    const { treeList } = this.state;
     return (
       <div>
         <Search
@@ -41,7 +74,13 @@ export default class Properties extends Component<PropertiesProps> {
         <Menu
           mode="inline"
         >
-          <Menu.Item>test</Menu.Item>
+          {treeList.map((tree) => (
+            <Menu.Item
+              key={tree.name}
+            >
+              {tree.name}
+            </Menu.Item>
+          ))}
         </Menu>
       </div>
     )

render-process/Editor/index.tsx

@@ -34,10 +34,8 @@ export default class Editor extends Component {
     ipcRenderer.on(MainEventType.OPEN_WORKSPACE, (event: any, workspace: any) => {
       console.log("on open workspace", workspace);
       this.setState({ workspace });
-      this.loadAllTrees();
     });
 
-    this.loadAllTrees();
   }
 
   loadAllTrees() {
@@ -89,7 +87,6 @@ export default class Editor extends Component {
             onOpenTree={(path) => {
               console.log("open tree", path);
             }}
-            trees={trees}
           />
         </Sider>
         <Content className="content">

render-process/index.css

@@ -2,3 +2,19 @@ body {
   background-color: #242424;
   padding: 0px;
 }
+
+::-webkit-scrollbar
+{
+    background-color: #a0a0a0;
+}
+
+::-webkit-scrollbar-track
+{
+    background-color:#1d1d1d;
+}
+
+::-webkit-scrollbar-thumb
+{
+    height:50px;
+    background-color:#818181;
+}