From c052fae9767741ee6f19f404ae9367ec1ce360e9 Mon Sep 17 00:00:00 2001
From: GermanBluefox <dogafox@gmail.com>
Date: Mon, 23 Oct 2023 19:02:57 +0200
Subject: [PATCH] Added edit of devices

---
 src-admin/src/Tabs/Bridges.js | 12 ++++++++----
 src-admin/src/Tabs/Devices.js | 11 +++++++----
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src-admin/src/Tabs/Bridges.js b/src-admin/src/Tabs/Bridges.js
index e884620d..2c490662 100644
--- a/src-admin/src/Tabs/Bridges.js
+++ b/src-admin/src/Tabs/Bridges.js
@@ -137,7 +137,7 @@ class Bridges extends React.Component {
         }
     }
 
-    addDevicesToBridge = (devices, bridgeIndex) => {
+    addDevicesToBridge = (devices, bridgeIndex, isAutoDetected) => {
         const matter = JSON.parse(JSON.stringify(this.props.matter));
         const bridge = matter.bridges[bridgeIndex];
         devices.forEach(device => {
@@ -149,7 +149,7 @@ class Bridges extends React.Component {
                     type: device.deviceType,
                     enabled: true,
                     noComposed: true,
-                    auto: bridgeIndex === undefined,
+                    auto: isAutoDetected,
                 };
                 if (device.type === 'dimmer') {
                     obj.hasOnState = device.hasOnState;
@@ -354,8 +354,10 @@ class Bridges extends React.Component {
                             editDeviceDialog.deviceType = e.target.value;
                             this.setState({ editDeviceDialog });
                         }}
+                        renderValue={value => <span><span>{DEVICE_ICONS[value] || <QuestionMark />}</span>{I18n.t(value)}</span>}
                     >
                         {Object.keys(Types).filter(key => SUPPORTED_DEVICES.includes(key)).map(type => <MenuItem key={type} value={type}>
+                            <span>{DEVICE_ICONS[type] || <QuestionMark />}</span>
                             {I18n.t(type)}
                         </MenuItem>)}
                     </Select>
@@ -602,7 +604,7 @@ class Bridges extends React.Component {
         return <DeviceDialog
             onClose={() => this.setState({ addDeviceDialog: false })}
             {...this.state.addDeviceDialog}
-            addDevices={devices => this.addDevicesToBridge(devices, this.state.addDeviceDialog.bridgeIndex)}
+            addDevices={devices => this.addDevicesToBridge(devices, this.state.addDeviceDialog.bridgeIndex, true)}
             matter={this.props.matter}
             socket={this.props.socket}
             themeType={this.props.themeType}
@@ -642,8 +644,10 @@ class Bridges extends React.Component {
                             addCustomDeviceDialog.deviceType = e.target.value;
                             this.setState({ addCustomDeviceDialog });
                         }}
+                        renderValue={value => <span><span>{DEVICE_ICONS[value] || <QuestionMark />}</span>{I18n.t(value)}</span>}
                     >
                         {Object.keys(Types).filter(key => SUPPORTED_DEVICES.includes(key)).map(type => <MenuItem key={type} value={type}>
+                            <span>{DEVICE_ICONS[type] || <QuestionMark />}</span>
                             {I18n.t(type)}
                         </MenuItem>)}
                     </Select>
@@ -659,7 +663,7 @@ class Bridges extends React.Component {
                             },
                             deviceType: this.state.addCustomDeviceDialog.deviceType,
                             hasOnState: this.state.addCustomDeviceDialog.hasOnState,
-                        }], this.state.addCustomDeviceDialog.bridgeIndex);
+                        }], this.state.addCustomDeviceDialog.bridgeIndex, false);
 
                         this.setState({ addCustomDeviceDialog: false });
                     }}
diff --git a/src-admin/src/Tabs/Devices.js b/src-admin/src/Tabs/Devices.js
index 33e2062d..0c582d03 100644
--- a/src-admin/src/Tabs/Devices.js
+++ b/src-admin/src/Tabs/Devices.js
@@ -252,8 +252,10 @@ class Devices extends React.Component {
                             editDeviceDialog.deviceType = e.target.value;
                             this.setState({ editDeviceDialog });
                         }}
+                        renderValue={value => <span><span>{DEVICE_ICONS[value] || <QuestionMark />}</span>{I18n.t(value)}</span>}
                     >
                         {Object.keys(Types).filter(key => SUPPORTED_DEVICES.includes(key)).map(type => <MenuItem key={type} value={type}>
+                            <span>{DEVICE_ICONS[type] || <QuestionMark />}</span>
                             {I18n.t(type)}
                         </MenuItem>)}
                     </Select>
@@ -308,7 +310,7 @@ class Devices extends React.Component {
         </Dialog>;
     }
 
-    addDevices = devices => {
+    addDevices = (devices, isAutoDetected) => {
         const matter = JSON.parse(JSON.stringify(this.props.matter));
         devices.forEach(device => {
             if (!matter.devices.find(d => d.oid === device)) {
@@ -318,6 +320,7 @@ class Devices extends React.Component {
                     oid: device._id,
                     type: device.deviceType,
                     hasOnState: device.hasOnState,
+                    auto: isAutoDetected,
                     productID: device.productID,
                     vendorID: device.vendorID,
                     noComposed: true,
@@ -422,14 +425,14 @@ class Devices extends React.Component {
             <DialogActions>
                 <Button
                     onClick={() => {
-                        this.addDevicesToBridge([{
+                        this.addDevices([{
                             _id: this.state.addCustomDeviceDialog.oid,
                             common: {
                                 name: this.state.addCustomDeviceDialog.name,
                             },
                             deviceType: this.state.addCustomDeviceDialog.deviceType,
                             hasOnState: this.state.addCustomDeviceDialog.hasOnState,
-                        }], this.state.addCustomDeviceDialog.bridgeIndex);
+                        }], this.state.addCustomDeviceDialog.bridgeIndex, false);
 
                         this.setState({ addCustomDeviceDialog: false });
                     }}
@@ -505,7 +508,7 @@ class Devices extends React.Component {
         return <DeviceDialog
             onClose={() => this.setState({ addDeviceDialog: false })}
             {...(this.state.addDeviceDialog || {})}
-            addDevices={this.addDevices}
+            addDevices={devices => this.addDevices(devices, true)}
             matter={this.props.matter}
             socket={this.props.socket}
             themeType={this.props.themeType}