new design

web/src/App.js

@@ -10,7 +10,7 @@ class App extends Component {
   constructor(props){
     super(props);
 
-    this.state={allIntents:[], selectedIntent: {questions:[''],answer:''}};
+    this.state={allIntents:[], selectedIntent: {questions:[''],answer:''}, selectedIndex:-1};
 
     getAllIntents().then(l=> l.text()).then(result=>{
       this.setState({allIntents: JSON.parse(result), selectedIntent: this.state.selectedIntent})
@@ -30,7 +30,8 @@ class App extends Component {
         </div>
         <IntentList allIntents={this.state.allIntents} 
                     onIntentClick={this.handleIntentClick}
-                    onAddIntentClick={this.handleAddIntentClick}>
+                    onAddIntentClick={this.handleAddIntentClick}
+                    selectedIndex={this.state.selectedIndex}>
         </IntentList>
         <IntentDetails  selectedIntent={this.state.selectedIntent}
                         onDeleteIntentClick={this.handleDeleteIntentClick}
@@ -40,8 +41,8 @@ class App extends Component {
     );
   }
 
-  handleIntentClick(selectedIntent){
-    this.setState({selectedIntent:selectedIntent});
+  handleIntentClick(selectedIntent, index){
+    this.setState({selectedIntent:selectedIntent, selectedIndex: index});
   }
 
   handleDeleteIntentClick(selectedIntent){