@homebridge-plugins/homebridge-ecovacs 8.1.4 → 8.2.0-beta.1

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to `@homebridge-plugins/homebridge-ecovacs` will be documented in this file.
 
+## v8.2.0 (Pending Release)
+
+### Changed
+
+- feat(ui): add, remove and hide devices from the config via the my devices tab
+- style(ui): standardise the custom ui layout and sync the support tab with the readme
+
 ## v8.1.4 (2026-07-19)
 
 ### Changed

package/dist/homebridge-ui/public/index.html

@@ -19,6 +19,22 @@
       color: #eeeeee !important;
       font-weight: 500 !important;
     }
+
+    .list-group-item {
+      background-color: #333333;
+      border-color: #444444;
+      color: #eeeeee;
+    }
+
+    .text-muted {
+      color: #aaaaaa !important;
+    }
+  }
+  .min-w-50 {
+    min-width: 50px;
+  }
+  .action-desc {
+    font-size: 0.85rem;
   }
   select {
     background-image:
@@ -76,11 +92,46 @@
   <!-- HAP device view (useMatter: false) -->
   <div id="deviceInfo">
     <form>
-      <div class="form-group">
+      <div class="form-group mb-0">
         <select class="form-control" id="deviceSelect"></select>
       </div>
     </form>
-    <table class="table w-100 mt-3" id="deviceTable" style="display: none">
+    <ul class="list-group mt-4 mb-4 mx-0" id="configActionList" style="display: none">
+      <li class="list-group-item">
+        <div class="d-flex justify-content-between align-items-center">
+          <div class="pr-2">
+            <div>Add All Devices</div>
+            <div class="text-muted action-desc">Add all devices to the config that are not already in the config.</div>
+          </div>
+          <button type="button" class="btn btn-primary m-0 ml-3 py-1 min-w-50" id="addAllBtn" aria-label="Add all devices to the config">
+            <i aria-hidden="true" class="fas fa-arrow-right"></i>
+          </button>
+        </div>
+      </li>
+      <li class="list-group-item">
+        <div class="d-flex justify-content-between align-items-center">
+          <div class="pr-2">
+            <div id="deviceConfigTitle">Add This Device</div>
+            <div class="text-muted action-desc" id="deviceConfigText">Add this device to the plugin config.</div>
+          </div>
+          <button type="button" class="btn btn-primary m-0 ml-3 py-1 min-w-50" id="deviceConfigBtn" aria-label="Add this device to the config">
+            <i aria-hidden="true" class="fas fa-arrow-right"></i>
+          </button>
+        </div>
+      </li>
+      <li class="list-group-item">
+        <div class="d-flex justify-content-between align-items-center">
+          <div class="pr-2">
+            <div id="hideDeviceTitle">Hide This Device</div>
+            <div class="text-muted action-desc" id="hideDeviceText">Hide this device from HomeKit. This adds the device to the config if needed.</div>
+          </div>
+          <button type="button" class="btn btn-primary m-0 ml-3 py-1 min-w-50" id="hideDeviceBtn" aria-label="Hide this device from HomeKit">
+            <i aria-hidden="true" class="fas fa-arrow-right"></i>
+          </button>
+        </div>
+      </li>
+    </ul>
+    <table class="table w-100 mt-0" id="deviceTable" style="display: none">
       <thead>
         <tr class="table-active">
           <th scope="col" style="width: 40%">Device Name</th>
@@ -128,138 +179,292 @@
   </div>
 </div>
 <div id="pageSupport" class="mt-4" style="display: none">
-  <p class="text-center lead">
-    Thank you for using <strong>homebridge-ecovacs</strong>
-  </p>
-  <p class="text-center">The links below will take you to our GitHub wiki</p>
-  <h4>Setup</h4>
-  <ul>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Installation"
-        target="_blank"
-        >Installation</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Configuration"
-        target="_blank"
-        >Configuration</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Beta-Version"
-        target="_blank"
-        >Beta Version</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Node-Version"
-        target="_blank"
-        >Node Version</a
-      >
-    </li>
-  </ul>
-  <h4>Features</h4>
+  <p class="text-center lead">Thank you for using <strong>homebridge-ecovacs</strong></p>
+  <h5>Plugin Information</h5>
+<ul>
+  <li>This plugin allows you to view and control your Ecovacs or Yeedi devices within HomeKit. The plugin:</li>
   <ul>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Supported-Devices"
-        target="_blank"
-        >Supported Devices</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Speed-Control"
-        target="_blank"
-        >Speed Control</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Custom-Areas"
-        target="_blank"
-        >Custom Areas</a
-      >
-    </li>
+    <li>requires your Ecovacs or Yeedi credentials to function</li>
+    <li>uses a cloud-based connection (i.e. requires the internet)</li>
   </ul>
-  <h4>Help/About</h4>
+</ul>
+  <h5>Prerequisites</h5>
+<ul>
+  <li>To use this plugin, you will need to already have:</li>
   <ul>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Common-Errors"
-        target="_blank"
-        >Common Errors</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/issues/new/choose"
-        target="_blank"
-        >Support Request</a
-      >
-    </li>
-    <li>
-      <a
-        href="https://github.com/homebridge-plugins/homebridge-ecovacs/blob/latest/CHANGELOG.md"
-        target="_blank"
-        >Changelog</a
-      >
-    </li>
-    <li>
-      <a href="https://github.com/sponsors/bwp91" target="_blank">About Me</a>
-    </li>
-  </ul>
-  <h4>Credits</h4>
-  <ul>
-    <li>
-      To the owner of
-      <a href="https://github.com/mrbungle64/ecovacs-deebot.js" target="_blank"
-        >ecovacs-deebot.js</a
-      >
-      client:
-      <a href="https://github.com/mrbungle64" target="_blank">@mrbungle64</a>.
-    </li>
-    <li>
-      To the owner of
-      <a
-        href="https://github.com/nicoduj/homebridge-deebotEcovacs"
-        target="_blank"
-        >homebridge-deebotEcovacs</a
-      >: <a href="https://github.com/nicoduj" target="_blank">@nicoduj</a>.
-    </li>
-    <li>
-      To the creator of the awesome plugin header logo:
-      <a href="https://www.instagram.com/keryan.me" target="_blank"
-        >Keryan Belahcene</a
-      >.
-    </li>
-    <li>
-      To the creators/contributors of
-      <a href="https://homebridge.io" target="_blank">Homebridge</a> who make
-      this plugin possible.
-    </li>
-  </ul>
-  <h4>Disclaimer</h4>
-  <ul>
-    <li>
-      I am in no way affiliated with Ecovacs and this plugin is a personal
-      project that I maintain in my free time.
-    </li>
-    <li>
-      Use this plugin entirely at your own risk - please see licence for more
-      information.
-    </li>
+    <li><a href="https://nodejs.org" target="_blank">Node</a>: latest version of <code>v22</code> or <code>v24</code> - any other major version is not supported.</li>
+    <li><a href="https://homebridge.io" target="_blank">Homebridge</a>: <code>v2.0</code> or above - refer to link for more information and installation instructions.</li>
   </ul>
+</ul>
+  <h5>Setup</h5>
+<ul>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Installation" target="_blank">Installation</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Configuration" target="_blank">Configuration</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Beta-Version" target="_blank">Beta Version</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Node-Version" target="_blank">Node Version</a></li>
+</ul>
+  <h5>Features</h5>
+<ul>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Supported-Devices" target="_blank">Supported Devices</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Speed-Control" target="_blank">Speed Control</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Predefined-Areas" target="_blank">Predefined Areas</a></li>
+</ul>
+  <h5>Help/About</h5>
+<ul>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/wiki/Common-Errors" target="_blank">Common Errors</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/issues/new/choose" target="_blank">Support Request</a></li>
+  <li><a href="https://github.com/homebridge-plugins/homebridge-ecovacs/blob/latest/CHANGELOG.md" target="_blank">Changelog</a></li>
+  <li><a href="https://github.com/sponsors/bwp91" target="_blank">About Me</a></li>
+</ul>
+  <h5>Credits</h5>
+<ul>
+  <li>To the owner of <a href="https://github.com/mrbungle64/ecovacs-deebot.js" target="_blank">ecovacs-deebot.js</a> client: <a href="https://github.com/mrbungle64" target="_blank">@mrbungle64</a>.</li>
+  <li>To the owner of <a href="https://github.com/nicoduj/homebridge-deebotEcovacs" target="_blank">homebridge-deebotEcovacs</a>: <a href="https://github.com/nicoduj" target="_blank">@nicoduj</a>.</li>
+  <li>To the creator of the awesome plugin header logo: <a href="https://www.instagram.com/keryan.me" target="_blank">Keryan Belahcene</a>.</li>
+  <li>To the creators/contributors of <a href="https://homebridge.io" target="_blank">Homebridge</a> who make this plugin possible.</li>
+</ul>
+  <h5>Disclaimer</h5>
+<ul>
+  <li>I am in no way affiliated with Ecovacs/Deebot/Yeedi and this plugin is a personal project that I maintain in my free time.</li>
+  <li>Use this plugin entirely at your own risk - please see licence for more information.</li>
+</ul>
 </div>
 <script>
   (async () => {
     try {
       const currentConfig = await homebridge.getPluginConfig();
+
+      // ===== Device picker (add/remove/hide config entries from the My Devices tab) =====
+      // The control state is always computed from a fresh getPluginConfig() call,
+      // so staged-but-unsaved edits made in the Settings tab are respected
+      let pickerAccessories = [];
+      let removeConfirmTimer;
+
+      // The action buttons always show the settings-page arrow; the row text
+      // (and the button's aria-label) says what the arrow will do
+      const actionArrow = '<i aria-hidden="true" class="fas fa-arrow-right"></i>';
+
+      // The platform matches device ids exactly (only whitespace is stripped),
+      // so the picker mirrors that rather than a looser comparison
+      const cleanId = (id) => (id || "").toString().replace(/\s+/g, "");
+
+      const getConfigBlocks = async () => {
+        const blocks = await homebridge.getPluginConfig();
+        if (!blocks.length) {
+          blocks.push({ name: "Deebot" });
+        }
+        return blocks;
+      };
+
+      const findInConfig = (config, deviceId) => {
+        const target = cleanId(deviceId);
+        if (!Array.isArray(config.devices)) {
+          return null;
+        }
+        const index = config.devices.findIndex(
+          (entry) => entry && cleanId(entry.deviceId) === target,
+        );
+        return index === -1 ? null : { index };
+      };
+
+      const selectedAccessory = () => {
+        const deviceId = document.getElementById("deviceSelect").value;
+        return pickerAccessories.find((x) => x.context.ecoDeviceId === deviceId);
+      };
+
+      const setHideControl = (hidden) => {
+        const btn = document.getElementById("hideDeviceBtn");
+        btn.dataset.hidden = hidden ? "yes" : "no";
+        btn.innerHTML = actionArrow;
+        btn.setAttribute(
+          "aria-label",
+          hidden ? "Show this device in HomeKit" : "Hide this device from HomeKit",
+        );
+        document.getElementById("hideDeviceTitle").innerHTML = hidden
+          ? "Show This Device"
+          : "Hide This Device";
+        document.getElementById("hideDeviceText").innerHTML = hidden
+          ? "Show this device in HomeKit again. The config entry is kept."
+          : "Hide this device from HomeKit. This adds the device to the config if needed.";
+      };
+
+      const setConfigButton = (inConfig) => {
+        const btn = document.getElementById("deviceConfigBtn");
+        clearTimeout(removeConfirmTimer);
+        delete btn.dataset.confirm;
+        btn.dataset.state = inConfig ? "remove" : "add";
+        btn.classList.remove("btn-danger");
+        btn.classList.add("btn-primary");
+        btn.innerHTML = actionArrow;
+        btn.setAttribute(
+          "aria-label",
+          inConfig ? "Remove this device from the config" : "Add this device to the config",
+        );
+        document.getElementById("deviceConfigTitle").innerHTML = inConfig
+          ? "Remove This Device"
+          : "Add This Device";
+        document.getElementById("deviceConfigText").innerHTML = inConfig
+          ? "Remove this device from the plugin config."
+          : "Add this device to the plugin config.";
+      };
+
+      const addDeviceToConfig = (config, acc) => {
+        if (!Array.isArray(config.devices)) {
+          config.devices = [];
+        }
+        // label is included so the entry is identifiable in the config editor
+        config.devices.push({
+          label: acc.displayName,
+          deviceId: acc.context.ecoDeviceId,
+        });
+      };
+
+      document.getElementById("deviceConfigBtn").addEventListener("click", async () => {
+        try {
+          const btn = document.getElementById("deviceConfigBtn");
+          const acc = selectedAccessory();
+          if (!acc) {
+            return;
+          }
+          const blocks = await getConfigBlocks();
+          const config = blocks[0];
+          const found = findInConfig(config, acc.context.ecoDeviceId);
+          if (btn.dataset.state === "add") {
+            // The config may have changed since the button was drawn, so
+            // re-check and never add a duplicate - just correct the button
+            if (found) {
+              setConfigButton(true);
+              setHideControl(!!config.devices[found.index].ignoreDevice);
+              homebridge.toast.info(acc.displayName + " is already in the config.", "Not Added");
+              return;
+            }
+            addDeviceToConfig(config, acc);
+            await homebridge.updatePluginConfig(blocks);
+            setConfigButton(true);
+            setHideControl(false);
+            homebridge.toast.success(acc.displayName + " added - press Save to apply.", "Added To Config");
+          } else {
+            if (!found) {
+              setConfigButton(false);
+              setHideControl(false);
+              homebridge.toast.info(acc.displayName + " is not in the config.", "Not Removed");
+              return;
+            }
+            const entry = config.devices[found.index];
+            const extraKeys = Object.keys(entry).filter(
+              (k) => !["deviceId", "label"].includes(k),
+            );
+            if (extraKeys.length > 0 && btn.dataset.confirm !== "yes") {
+              // The entry has settings beyond id and label which would be
+              // lost, so ask for a second click within five seconds
+              btn.dataset.confirm = "yes";
+              btn.classList.remove("btn-primary");
+              btn.classList.add("btn-danger");
+              btn.innerHTML = actionArrow;
+              btn.setAttribute("aria-label", "Confirm removing this device from the config");
+              document.getElementById("deviceConfigText").innerHTML =
+                "This entry has extra settings which will be lost. Click again to remove it.";
+              removeConfirmTimer = setTimeout(() => setConfigButton(true), 5000);
+              return;
+            }
+            config.devices.splice(found.index, 1);
+            if (config.devices.length === 0) {
+              delete config.devices;
+            }
+            await homebridge.updatePluginConfig(blocks);
+            setConfigButton(false);
+            setHideControl(false);
+            homebridge.toast.success(acc.displayName + " removed - press Save to apply.", "Removed From Config");
+          }
+        } catch (err) {
+          homebridge.toast.error(err.message, "Error");
+        }
+      });
+
+      document.getElementById("hideDeviceBtn").addEventListener("click", async () => {
+        try {
+          const acc = selectedAccessory();
+          if (!acc) {
+            return;
+          }
+          const blocks = await getConfigBlocks();
+          const config = blocks[0];
+          let found = findInConfig(config, acc.context.ecoDeviceId);
+          const currentlyHidden =
+            document.getElementById("hideDeviceBtn").dataset.hidden === "yes";
+          if (!currentlyHidden) {
+            // Hiding needs a config entry to carry the flag, so create one if
+            // the device is not in the config yet
+            if (!found) {
+              addDeviceToConfig(config, acc);
+              found = findInConfig(config, acc.context.ecoDeviceId);
+            }
+            config.devices[found.index].ignoreDevice = true;
+            await homebridge.updatePluginConfig(blocks);
+            setConfigButton(true);
+            setHideControl(true);
+            homebridge.toast.success(
+              acc.displayName + " will be hidden from HomeKit - press Save to apply.",
+              "Device Hidden",
+            );
+          } else {
+            if (found) {
+              // Drop the flag rather than storing ignoreDevice false, to keep
+              // the entry clean
+              delete config.devices[found.index].ignoreDevice;
+              await homebridge.updatePluginConfig(blocks);
+            }
+            setConfigButton(!!found);
+            setHideControl(false);
+            homebridge.toast.success(
+              acc.displayName + " will be shown in HomeKit - press Save to apply.",
+              "Device Unhidden",
+            );
+          }
+        } catch (err) {
+          homebridge.toast.error(err.message, "Error");
+        }
+      });
+
+      document.getElementById("addAllBtn").addEventListener("click", async () => {
+        try {
+          const blocks = await getConfigBlocks();
+          const config = blocks[0];
+          let added = 0;
+          let skipped = 0;
+          pickerAccessories.forEach((acc) => {
+            if (!acc.context?.ecoDeviceId) {
+              return;
+            }
+            if (findInConfig(config, acc.context.ecoDeviceId)) {
+              skipped += 1;
+              return;
+            }
+            addDeviceToConfig(config, acc);
+            added += 1;
+          });
+          if (added > 0) {
+            await homebridge.updatePluginConfig(blocks);
+            homebridge.toast.success(
+              added + " device(s) added, " + skipped + " already in the config - press Save to apply.",
+              "Added To Config",
+            );
+          } else {
+            homebridge.toast.info("All devices are already in the config.", "Nothing To Add");
+          }
+          const acc = selectedAccessory();
+          if (acc) {
+            const nowFound = findInConfig(config, acc.context.ecoDeviceId);
+            setConfigButton(!!nowFound);
+            if (nowFound) {
+              setHideControl(!!config.devices[nowFound.index].ignoreDevice);
+            }
+          }
+        } catch (err) {
+          homebridge.toast.error(err.message, "Error");
+        }
+      });
+      // ===== End device picker =====
       showIntro = () => {
         homebridge.disableSaveButton?.();
         const introContinue = document.getElementById("introContinue");
@@ -274,7 +479,9 @@
       };
       showDevices = async () => {
         homebridge.showSpinner();
-        homebridge.disableSaveButton?.();
+        // The save button stays enabled here so entries staged by the picker
+        // buttons can be saved without switching back to the Settings tab
+        homebridge.enableSaveButton?.();
         homebridge.hideSchemaForm();
         document.getElementById("menuHome").classList.remove("btn-elegant");
         document.getElementById("menuHome").classList.add("btn-primary");
@@ -382,6 +589,7 @@
                   : 0;
             });
           }
+          pickerAccessories = cachedAccessories;
           const deviceSelect = document.getElementById("deviceSelect");
           deviceSelect.innerHTML = "";
           cachedAccessories.forEach((a) => {
@@ -421,6 +629,11 @@
               : "";
             document.getElementById("deviceTable").style.display =
               "inline-table";
+            const configBlocks = await getConfigBlocks();
+            const configEntry = findInConfig(configBlocks[0], context.ecoDeviceId);
+            setConfigButton(!!configEntry);
+            setHideControl(!!(configEntry && configBlocks[0].devices[configEntry.index].ignoreDevice));
+            document.getElementById("configActionList").style.display = "block";
             homebridge.hideSpinner();
           };
           deviceSelect.addEventListener("change", (event) =>
@@ -433,6 +646,7 @@
             option.text = "No Devices";
             deviceSelect.add(option);
             deviceSelect.disabled = true;
+            document.getElementById("configActionList").style.display = "none";
           }
         }
 

package/package.json

@@ -3,7 +3,7 @@
   "displayName": "Homebridge Ecovacs",
   "alias": "Deebot",
   "type": "module",
-  "version": "8.1.4",
+  "version": "8.2.0-beta.1",
   "description": "Homebridge plugin to integrate Ecovacs Deebot/Yeedi devices into HomeKit.",
   "author": {
     "name": "bwp91",
@@ -39,6 +39,7 @@
   "keywords": [
     "homebridge",
     "homebridge-plugin",
+    "supports-matter",
     "homebridge-deebot",
     "homebridge-ecovacs",
     "hoobs",