From b4bff54b2b1bcb52b3963a9dd3b870c1f165d65e Mon Sep 17 00:00:00 2001
From: BoSen29 <54361737+BoSen29@users.noreply.github.com>
Date: Mon, 2 Dec 2019 15:32:03 +0100
Subject: [PATCH] Fixes 978 (#1342)

Should fix 978, and add support for set-udelement, get-udelement, hide-udelement.
Note: remove-udelement shouldn't work (haven't tested)
---
 .../Components/ud-button.jsx                  | 63 ++++++++++++++++---
 1 file changed, 55 insertions(+), 8 deletions(-)

diff --git a/src/UniversalDashboard.Materialize/Components/ud-button.jsx b/src/UniversalDashboard.Materialize/Components/ud-button.jsx
index 3466cec2..95c0a5b3 100644
--- a/src/UniversalDashboard.Materialize/Components/ud-button.jsx
+++ b/src/UniversalDashboard.Materialize/Components/ud-button.jsx
@@ -3,6 +3,20 @@ import {Button} from 'react-materialize';
 import UdIcon from './ud-icon';
 
 export default class UDButton extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            backgroundColor: this.props.backgroundColor,
+            fontColor: this.props.fontColor,
+            floating: this.props.floating,
+            flat: this.props.flat,
+            icon: this.props.icon,
+            text: this.props.text,
+            disabled: this.props.disabled,
+            hidden: this.props.hidden      
+        }
+    }
 
     onClick() {
         if (this.props.onClick) {
@@ -15,29 +29,62 @@ export default class UDButton extends React.Component {
         }
     }
 
+    onIncomingEvent(eventName, event) {
+        if (event.type === "requestState") {
+            var data = {
+                attributes: this.state
+            }
+            UniversalDashboard.post(`/api/internal/component/element/sessionState/${event.requestId}`, data);
+        }
+        else if (event.type === "setState") {
+            this.setState(event.state.attributes);
+        }
+        else if (event.type === "clearElement") {
+            this.setState({
+                content: null
+            });
+        }
+        else if (event.type === "removeElement") {
+            this.setState({
+                hidden:true
+            });
+        }
+    }
+
+    componentWillMount() {
+        this.pubSubToken = UniversalDashboard.subscribe(this.props.id, this.onIncomingEvent.bind(this));
+    }
+      
+    componentWillUnmount() {
+        UniversalDashboard.unsubscribe(this.pubSubToken);
+    }
+
     render() {
+        if(this.state.hidden) {
+            return null;
+        }
 
         var style = {
-            backgroundColor: this.props.backgroundColor,
-            color: this.props.fontColor
+            backgroundColor: this.state.backgroundColor,
+            color: this.state.fontColor
         }
 
         var icon = null; 
-        if (this.props.icon) {
-            icon = <UdIcon icon={this.props.icon} style={{marginRight: this.props.floating || !this.props.text ? 'unset' : '5px'}}/>
+        if (this.state.icon) {
+            icon = <UdIcon icon={this.state.icon} style={{marginRight: this.state.floating || !this.state.text ? 'unset' : '5px'}}/>
         }
 
         return <Button 
                     className="ud-button"
                     onClick={this.onClick.bind(this)}
                     id={this.props.id}
-                    flat={this.props.flat} 
-                    disabled={this.props.disabled}
-                    floating={this.props.floating} 
+                    flat={this.state.flat} 
+                    disabled={this.state.disabled}
+                    floating={this.state.floating} 
                     style={style}
                 >
                     {icon}
-                    {this.props.text}
+                    {this.state.text}
                 </Button>
     }
 }