From 7f4cc5d3f3f92338a464853c182b9d6a3ea850eb Mon Sep 17 00:00:00 2001
From: Emiliano Ciavatta
Date: Sun, 27 Sep 2020 18:43:27 +0200
Subject: Replaced the old fields with the new ones

---
 frontend/src/components/panels/PcapPane.js |  7 ++++---
 frontend/src/components/panels/RulePane.js | 12 +++---------
 2 files changed, 7 insertions(+), 12 deletions(-)

(limited to 'frontend/src/components/panels')

diff --git a/frontend/src/components/panels/PcapPane.js b/frontend/src/components/panels/PcapPane.js
index 7e0fa6c..a491dff 100644
--- a/frontend/src/components/panels/PcapPane.js
+++ b/frontend/src/components/panels/PcapPane.js
@@ -3,10 +3,11 @@ import './PcapPane.scss';
 import Table from "react-bootstrap/Table";
 import backend from "../../backend";
 import {createCurlCommand, formatSize, timestampToTime2} from "../../utils";
-import {Button, Col, Container, Row} from "react-bootstrap";
+import {Col, Container, Row} from "react-bootstrap";
 import InputField from "../fields/InputField";
 import CheckField from "../fields/CheckField";
 import TextField from "../fields/TextField";
+import ButtonField from "../fields/ButtonField";
 
 class PcapPane extends Component {
 
@@ -167,7 +168,7 @@ class PcapPane extends Component {
                                             <CheckField name="flush_all" checked={this.state.uploadFlushAll}
                                                         onChange={v => this.setState({uploadFlushAll: v})}/>
                                         </div>
-                                        <Button variant="green" onClick={this.handleUploadPcap}>upload</Button>
+                                        <ButtonField variant="green" bordered onClick={this.handleUploadPcap} name="upload" />
                                     </div>
 
                                     <TextField value={uploadOutput} rows={4} readonly small={true}/>
@@ -192,7 +193,7 @@ class PcapPane extends Component {
                                             <CheckField name="delete_original_file" checked={this.state.uploadFlushAll}
                                                         onChange={v => this.setState({uploadFlushAll: v})}/>
                                         </div>
-                                        <Button variant="blue" onClick={this.handleUploadPcap}>process</Button>
+                                        <ButtonField variant="blue" bordered onClick={this.handleUploadPcap} name="process" />
                                     </div>
 
                                     <TextField value={uploadOutput} rows={4} readonly small={true}/>
diff --git a/frontend/src/components/panels/RulePane.js b/frontend/src/components/panels/RulePane.js
index fbc8785..2e91d91 100644
--- a/frontend/src/components/panels/RulePane.js
+++ b/frontend/src/components/panels/RulePane.js
@@ -1,7 +1,7 @@
 import React, {Component} from 'react';
 import './RulePane.scss';
 import Table from "react-bootstrap/Table";
-import {Button, Col, Container, Row} from "react-bootstrap";
+import {Col, Container, Row} from "react-bootstrap";
 import InputField from "../fields/InputField";
 import CheckField from "../fields/CheckField";
 import TextField from "../fields/TextField";
@@ -141,18 +141,12 @@ class RulePane extends Component {
                                         <td><CheckField small /></td>
                                         <td style={{"width": "70px"}}><NumericField small /></td>
                                         <td style={{"width": "70px"}}><NumericField small /></td>
-                                        <td><ChoiceField small keys={[0, 1, 2]} values={["both", "c->s", "s->c"]} value="both" /></td>
-                                        <td><Button  variant="green" size="sm">add</Button></td>
+                                        <td><ChoiceField inline small keys={[0, 1, 2]} values={["both", "c->s", "s->c"]} value="both" /></td>
+                                        <td><ButtonField  variant="green" small name="add" inline rounded /></td>
                                     </tr>
                                 </tbody>
                             </Table>
                         </div>
-
-                        <ButtonField name="add_rule" variant="green" bordered />
-                        <br />
-                        <ButtonField name="add_rule" small color="red"/>
-                        <br />
-                        <ButtonField name="add_rule" bordered border={"green"} />
                     </div>
                 </div>
 
-- 
cgit v1.2.3-70-g09d2