From 1412a34f64e234dbc7d4e6815b841699f4dd104a Mon Sep 17 00:00:00 2001
From: Emiliano Ciavatta
Date: Sun, 27 Sep 2020 17:48:38 +0200
Subject: Add other custom fields

---
 frontend/src/components/fields/ButtonField.js | 44 +++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 frontend/src/components/fields/ButtonField.js

(limited to 'frontend/src/components/fields/ButtonField.js')

diff --git a/frontend/src/components/fields/ButtonField.js b/frontend/src/components/fields/ButtonField.js
new file mode 100644
index 0000000..b32aee8
--- /dev/null
+++ b/frontend/src/components/fields/ButtonField.js
@@ -0,0 +1,44 @@
+import React, {Component} from 'react';
+import './ButtonField.scss';
+import './common.scss';
+
+const classNames = require('classnames');
+
+class ButtonField extends Component {
+
+    constructor(props) {
+        super(props);
+    }
+
+    render() {
+        const handler = () => {
+            if (typeof this.props.onClick === "function") {
+                this.props.onClick();
+            }
+        };
+
+        let buttonClassnames = {
+            "button-bordered": this.props.bordered,
+        };
+        if (this.props.variant) {
+            buttonClassnames[`button-variant-${this.props.variant}`] = true;
+        }
+
+        let buttonStyle = {};
+        if (this.props.color) {
+            buttonStyle["backgroundColor"] = this.props.color;
+        }
+        if (this.props.border) {
+            buttonStyle["borderColor"] = this.props.border;
+        }
+
+        return (
+            <div className={classNames( "field", "button-field", {"field-small": this.props.small})}>
+                <button type="button" className={classNames(classNames(buttonClassnames))}
+                        onClick={handler} style={buttonStyle}>{this.props.name}</button>
+            </div>
+        );
+    }
+}
+
+export default ButtonField;
-- 
cgit v1.2.3-70-g09d2