From 8be06bf2ae7a3c597b90bc84dfbe752b2f1f0bc7 Mon Sep 17 00:00:00 2001
From: snoop <snoop@loafle.com>
Date: Tue, 25 Jul 2017 19:52:20 +0900
Subject: [PATCH] fixed sensor tree

---
 .../meta/react/components/SensorItemTree.tsx      | 15 +++++++++++----
 .../react/components/SensorConfiguration.tsx      |  5 ++++-
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/ts/@overflow/meta/react/components/SensorItemTree.tsx b/src/ts/@overflow/meta/react/components/SensorItemTree.tsx
index 0c5d9a5..3dd2c0d 100644
--- a/src/ts/@overflow/meta/react/components/SensorItemTree.tsx
+++ b/src/ts/@overflow/meta/react/components/SensorItemTree.tsx
@@ -24,7 +24,7 @@ export type SensorItemTreeProps = SensorItemTreeStateProps & SensorItemTreeDispa
 
 
 export interface SensorItemTreeState {
-  portState: { [key: number]: boolean };
+  portState: Map<number, boolean>;
 }
 
 interface TreeItem {
@@ -42,7 +42,7 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
     this.itemMap = new Map;
 
     this.state = {
-      portState: {},
+      portState: new Map(),
     };
     this.sortItemMap();
 
@@ -69,13 +69,20 @@ export class SensorItemTree extends React.Component<SensorItemTreeProps, SensorI
   public ViewSensorItemType(): JSX.Element[] {
     let elems: JSX.Element[] = new Array();
     this.itemMap.forEach((data: TreeItem, key: number) => {
+      // this.state.portState[key] = false;
       elems.push(
         <List.Item key={key} >
-          <List.Icon name='chevron up' />
+          <List.Icon name={this.state.portState[key] ? 'chevron up' : 'chevron down'} onClick={() => {
+
+            let newPortState: Map<number, boolean> = new Map(this.state.portState);
+            newPortState[key] = true;
+            this.setState({ portState: newPortState });
+
+          }} />
           <List.Content>
             <List.Header> <Checkbox label={data.metaSensorItemType.name} />   </List.Header>
             <List.Description>Category</List.Description>
-            {this.ViewSensorItem(data.metaSensorItemList)}
+            {this.state.portState[key] ? this.ViewSensorItem(data.metaSensorItemList) : ''}
           </List.Content>
         </List.Item>,
       );
diff --git a/src/ts/@overflow/sensor/react/components/SensorConfiguration.tsx b/src/ts/@overflow/sensor/react/components/SensorConfiguration.tsx
index a23d8ff..4dacbbe 100644
--- a/src/ts/@overflow/sensor/react/components/SensorConfiguration.tsx
+++ b/src/ts/@overflow/sensor/react/components/SensorConfiguration.tsx
@@ -4,6 +4,8 @@ import { Grid, Image, Label, Segment, Dropdown, Input, List, Accordion, Loader }
 
 import MetaCrawler from '@overflow/meta/api/model/MetaCrawler';
 
+import SensorItemTree from '@overflow/meta/react/SensorItemTree';
+
 export interface SensorConfigurationStateProps {
 
 }
@@ -28,7 +30,7 @@ export class SensorConfiguration extends React.Component<SensorConfigurationProp
 
 
   public render(): JSX.Element {
-    let steps = [<CrawlerSelector />, <SensorItemSelector />, <ETCSelector />];
+    let steps = [<CrawlerSelector />, <SensorItemTree />, <ETCSelector />];
 
     return (
       <ConfigStepper steps={steps} />
@@ -143,6 +145,7 @@ export class ConfigStepper extends React.Component<ConfigStepperProps, ConfigSte
           <Button content='Next' icon='right arrow' labelPosition='right' positive
             onClick={this.handleNext.bind(this)} disabled={this.checkNextDisabled()} />
         </Button.Group>
+        <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
       </Container>
     );
   }