From 0deec453833654da2a5370599e83984239b6eaf8 Mon Sep 17 00:00:00 2001
From: Laura Fuentes Grau <laurafuentesgrau@gmail.com>
Date: Wed, 28 Oct 2020 20:35:39 +0100
Subject: [PATCH] Category and type of IC (in edit and add) are now selectable
 via drop down menu #266

---
 src/ic/edit-ic.js | 41 +++++++++++++++++++++++++++++++++++------
 src/ic/new-ic.js  | 42 ++++++++++++++++++++++++++++++++++++------
 2 files changed, 71 insertions(+), 12 deletions(-)

diff --git a/src/ic/edit-ic.js b/src/ic/edit-ic.js
index 9e8fe4a..7386131 100644
--- a/src/ic/edit-ic.js
+++ b/src/ic/edit-ic.js
@@ -99,6 +99,26 @@ class EditICDialog extends React.Component {
   }
 
   render() {
+    let typeOptions = [];
+    switch(this.state.category){
+      case "Simulator":
+        typeOptions = ["Dummy","Generic","DPsim","RTLAB","RSCAD"];
+          break;
+      case "Controller":
+        typeOptions = ["Kubernetes","VILLAS-controller"];
+        break;
+      case "Gateway":
+        typeOptions = ["VILLAS-node","VILLAS-relay"];
+        break;
+      case "Service":
+        typeOptions = ["EMS","Custom"];
+        break;
+      case "Equipment":
+        typeOptions = ["Chroma-emulator","Chroma-loads","SMA-sunnyboy","FLEPS","Sonnenbatterie"];
+        break;
+      default:
+        typeOptions =[];
+    }
     return (
       <Dialog
         show={this.props.show}
@@ -129,14 +149,23 @@ class EditICDialog extends React.Component {
             <FormControl.Feedback />
           </FormGroup>
           <FormGroup controlId="category">
-            <FormLabel column={false}>Category (e.g. Simulator, Gateway, ...)</FormLabel>
-            <FormControl type="text" placeholder={this.props.ic.category} value={this.state.category} onChange={(e) => this.handleChange(e)} />
-            <FormControl.Feedback />
+            <FormLabel column={false}>Category</FormLabel>
+            <FormControl as="select" value={this.state.category} onChange={(e) => this.handleChange(e)}>
+              <option>Simulator</option>
+              <option>Controller</option>
+              <option>Service</option>
+              <option>Gateway</option>
+              <option>Equipment</option>
+            </FormControl>
           </FormGroup>
           <FormGroup controlId="type">
-            <FormLabel column={false}>Type (e.g. RTDS, VILLASnode, ...)</FormLabel>
-            <FormControl type="text" placeholder={this.props.ic.type} value={this.state.type} onChange={(e) => this.handleChange(e)} />
-            <FormControl.Feedback />
+            <FormLabel column={false}>Type</FormLabel>
+            <FormControl as="select" value={this.state.type} onChange={(e) => this.handleChange(e)}>
+              <option default>Select type</option>
+              {typeOptions.map((name,index) => (
+                <option key={index}>{name}</option>
+              ))}
+            </FormControl>
           </FormGroup>
           <FormGroup controlId='properties'>
             <FormLabel column={false}>Properties</FormLabel>
diff --git a/src/ic/new-ic.js b/src/ic/new-ic.js
index 78c67a8..466ead5 100644
--- a/src/ic/new-ic.js
+++ b/src/ic/new-ic.js
@@ -116,6 +116,26 @@ class NewICDialog extends React.Component {
   }
 
   render() {
+    let typeOptions = [];
+    switch(this.state.category){
+      case "Simulator":
+        typeOptions = ["Dummy","Generic","DPsim","RTLAB","RSCAD"];
+          break;
+      case "Controller":
+        typeOptions = ["Kubernetes","VILLAS-controller"];
+        break;
+      case "Gateway":
+        typeOptions = ["VILLAS-node","VILLAS-relay"];
+        break;
+      case "Service":
+        typeOptions = ["EMS","Custom"];
+        break;
+      case "Equipment":
+        typeOptions = ["Chroma-emulator","Chroma-loads","SMA-sunnyboy","FLEPS","Sonnenbatterie"];
+        break;
+      default:
+        typeOptions =[];
+    }
     return (
       <Dialog show={this.props.show} title="New Infrastructure Component" buttonTitle="Add" onClose={(c) => this.onClose(c)} onReset={() => this.resetState()} valid={this.valid}>
         <form>
@@ -137,14 +157,24 @@ class NewICDialog extends React.Component {
             <FormControl.Feedback />
           </FormGroup>
           <FormGroup controlId="category">
-            <FormLabel>Category of component (e.g. Simulator, Gateway, ...)</FormLabel>
-            <FormControl type="text" placeholder="Enter category" value={this.state.category} onChange={(e) => this.handleChange(e)} />
-            <FormControl.Feedback />
+            <FormLabel>Category of component</FormLabel>
+            <FormControl as="select" value={this.state.category} onChange={(e) => this.handleChange(e)}>
+              <option default>Select category</option>
+              <option>Simulator</option>
+              <option>Controller</option>
+              <option>Service</option>
+              <option>Gateway</option>
+              <option>Equipment</option>
+            </FormControl>
           </FormGroup>
           <FormGroup controlId="type">
-            <FormLabel>Type of component (e.g. RTDS, VILLASnode, ...)</FormLabel>
-            <FormControl type="text" placeholder="Enter type" value={this.state.type} onChange={(e) => this.handleChange(e)} />
-            <FormControl.Feedback />
+            <FormLabel>Type of component</FormLabel>
+            <FormControl as="select" value={this.state.type} onChange={(e) => this.handleChange(e)}>
+              <option default>Select type</option>
+              {typeOptions.map((name,index) => (
+                <option key={index}>{name}</option>
+              ))}
+            </FormControl>
           </FormGroup>
           <FormGroup controlId="uuid" valid={this.validateForm('uuid')}>
             <FormLabel>UUID</FormLabel>