+ ${!canCommissionMatterExternal(this.hass)
+ ? this.hass.localize(
+ "ui.panel.config.integrations.config_flow.matter_mobile_app"
+ )
+ : html`
+
- ${this._canCommissionMatter
+ ${canCommissionMatterExternal(this.hass)
? html`Commission device with mobile app `
: ""}
- ${isDevVersion(this.hass.config.version)
- ? html`Commission device
- Add shared device `
- : ""}
+ Commission device
+ Add shared device
Set WiFi Credentials
@@ -83,33 +84,23 @@ export class MatterConfigPanel extends LitElement {
`;
}
- protected override updated(changedProps: PropertyValues) {
- super.updated(changedProps);
-
- if (!this._curMatterDevices || !changedProps.has("hass")) {
+ private _redirectOnNewMatterDevice() {
+ if (this._unsub) {
return;
}
+ this._unsub = redirectOnNewMatterDevice(this.hass, () => {
+ this._unsub = undefined;
+ });
+ }
- const oldHass = changedProps.get("hass") as HomeAssistant | undefined;
- if (!oldHass || oldHass.devices === this.hass.devices) {
- return;
- }
-
- const newMatterDevices = Object.values(this.hass.devices).filter(
- (device) =>
- device.identifiers.find((identifier) => identifier[0] === "matter") &&
- !this._curMatterDevices!.has(device.id)
- );
- if (newMatterDevices.length) {
- navigate(`/config/devices/device/${newMatterDevices[0].id}`);
- }
+ private _stopRedirect() {
+ this._unsub?.();
+ this._unsub = undefined;
}
private _startMobileCommissioning() {
- this._redirectOnNewDevice();
- this.hass.auth.external!.fireMessage({
- type: "matter/commission",
- });
+ this._redirectOnNewMatterDevice();
+ startExternalCommissioning(this.hass);
}
private async _setWifi(): Promise {
@@ -150,11 +141,12 @@ export class MatterConfigPanel extends LitElement {
return;
}
this._error = undefined;
- this._redirectOnNewDevice();
+ this._redirectOnNewMatterDevice();
try {
await commissionMatterDevice(this.hass, code);
} catch (err: any) {
this._error = err.message;
+ this._stopRedirect();
}
}
@@ -169,11 +161,12 @@ export class MatterConfigPanel extends LitElement {
return;
}
this._error = undefined;
- this._redirectOnNewDevice();
+ this._redirectOnNewMatterDevice();
try {
await acceptSharedMatterDevice(this.hass, Number(code));
} catch (err: any) {
this._error = err.message;
+ this._stopRedirect();
}
}
@@ -195,19 +188,6 @@ export class MatterConfigPanel extends LitElement {
}
}
- private _redirectOnNewDevice() {
- if (this._curMatterDevices) {
- return;
- }
- this._curMatterDevices = new Set(
- Object.values(this.hass.devices)
- .filter((device) =>
- device.identifiers.find((identifier) => identifier[0] === "matter")
- )
- .map((device) => device.id)
- );
- }
-
static styles = [
haStyle,
css`
diff --git a/src/panels/config/integrations/integration-panels/matter/show-dialog-add-matter-device.ts b/src/panels/config/integrations/integration-panels/matter/show-dialog-add-matter-device.ts
new file mode 100644
index 0000000000..3559482e7c
--- /dev/null
+++ b/src/panels/config/integrations/integration-panels/matter/show-dialog-add-matter-device.ts
@@ -0,0 +1,11 @@
+import { fireEvent } from "../../../../../common/dom/fire_event";
+
+export const loadAddDeviceDialog = () => import("./dialog-matter-add-device");
+
+export const showMatterAddDeviceDialog = (element: HTMLElement): void => {
+ fireEvent(element, "show-dialog", {
+ dialogTag: "dialog-matter-add-device",
+ dialogImport: loadAddDeviceDialog,
+ dialogParams: {},
+ });
+};
diff --git a/src/translations/en.json b/src/translations/en.json
index 4c08100009..9a268b7d5f 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -2993,6 +2993,7 @@
"search_brand": "Search for a brand name",
"add_zwave_js_device": "Add Z-Wave device",
"add_zha_device": "Add Zigbee device",
+ "add_matter_device": "Add Matter device",
"disable": {
"show_disabled": "Show disabled integrations",
"disabled_integrations": "{number} disabled",
@@ -3106,8 +3107,10 @@
"could_not_load": "Config flow could not be loaded",
"not_loaded": "The integration could not be loaded, try to restart Home Assistant.",
"supported_brand_flow": "Support for {supported_brand} devices is provided by {flow_domain_name}. Do you want to continue?",
- "missing_zwave_zigbee": "To add a {brand} device, you first need {supported_hardware_link} and the {integration} integration set up. If you already have the hardware then you can proceed with the setup of {integration}.",
"missing_zwave_zigbee_title": "{integration} is not setup",
+ "missing_zwave_zigbee": "To add a {brand} device, you first need {supported_hardware_link} and the {integration} integration set up. If you already have the hardware then you can proceed with the setup of {integration}.",
+ "missing_matter": "To add a {brand} device, you first need the {integration} integration and {supported_hardware_link}. Do you want to proceed with the setup of {integration}?",
+ "matter_mobile_app": "You need to use the Home Assistant Companion app on your mobile phone to commission Matter devices.",
"supported_hardware": "supported hardware",
"proceed": "Proceed"
}