diff --git a/src/panels/config/cloud/account/cloud-remote-pref.ts b/src/panels/config/cloud/account/cloud-remote-pref.ts
index e94e50b56b..cd9d509f81 100644
--- a/src/panels/config/cloud/account/cloud-remote-pref.ts
+++ b/src/panels/config/cloud/account/cloud-remote-pref.ts
@@ -1,13 +1,16 @@
-import "@material/mwc-button";
import { mdiContentCopy, mdiHelpCircle } from "@mdi/js";
-import { css, CSSResultGroup, html, LitElement, nothing } from "lit";
+import { CSSResultGroup, LitElement, css, html, nothing } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../../../common/dom/fire_event";
import { copyToClipboard } from "../../../../common/util/copy-clipboard";
import "../../../../components/ha-alert";
+import "../../../../components/ha-button";
import "../../../../components/ha-card";
+import "../../../../components/ha-expansion-panel";
+import "../../../../components/ha-settings-row";
import "../../../../components/ha-switch";
// eslint-disable-next-line
+import { formatDate } from "../../../../common/datetime/format_date";
import type { HaSwitch } from "../../../../components/ha-switch";
import {
CloudStatusLoggedIn,
@@ -125,22 +128,60 @@ export class CloudRemotePref extends LitElement {
>.
-
-
-
-
-
-
- ${this.hass.localize(
- "ui.panel.config.cloud.account.remote.certificate_info"
+
+ >
+
+ ${this.hass.localize(
+ "ui.panel.config.cloud.account.remote.external_activation"
+ )}
+ ${this.hass.localize(
+ "ui.panel.config.cloud.account.remote.external_activation_secondary"
+ )}
+
+
+
+ ${this.hass.localize(
+ "ui.panel.config.cloud.account.remote.certificate_info"
+ )}
+ ${this.cloudStatus!.remote_certificate
+ ? this.hass.localize(
+ "ui.panel.config.cloud.account.remote.certificate_expire",
+ {
+ date: formatDate(
+ new Date(
+ this.cloudStatus.remote_certificate.expire_date
+ ),
+ this.hass.locale,
+ this.hass.config
+ ),
+ }
+ )
+ : nothing}
+
+ ${this.hass.localize(
+ "ui.panel.config.cloud.account.remote.more_info"
+ )}
+
+
+
`;
@@ -243,6 +284,9 @@ export class CloudRemotePref extends LitElement {
ha-formfield {
margin-top: 8px;
}
+ ha-expansion-panel {
+ margin-top: 8px;
+ }
`;
}
}
diff --git a/src/translations/en.json b/src/translations/en.json
index 733d393c4c..5c385a9e32 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -3508,7 +3508,12 @@
"instance_will_be_available": "Your instance will be available at your",
"link_learn_how_it_works": "Learn how it works",
"nabu_casa_url": "Nabu Casa URL",
- "certificate_info": "Certificate info"
+ "advanced_options": "Advanced options",
+ "external_activation": "Allow external activation of remote control",
+ "external_activation_secondary": "Allows you to turn on remote control from your Nabu Casa account page, even if you're outside your local network",
+ "certificate_info": "Certificate info",
+ "certificate_expire": "Will be renewed at {date}",
+ "more_info": "More info"
},
"alexa": {
"title": "Alexa",