Small reorganization of profile settings (#20076)

* Small reorganization of profile settings

* use isExternal

src/panels/profile/ha-panel-profile.ts

@@ -74,7 +74,6 @@ class HaPanelProfile extends LitElement {
           .narrow=${this.narrow}
         ></ha-menu-button>
         <div slot="title">${this.hass.localize("panel.profile")}</div>
-
         <div class="content">
           <ha-card .header=${this.hass.user!.name}>
             <div class="card-content">
@@ -85,7 +84,20 @@ class HaPanelProfile extends LitElement {
                 ? this.hass.localize("ui.panel.profile.is_owner")
                 : ""}
             </div>
-
+            <div class="card-actions">
+              <mwc-button class="warning" @click=${this._handleLogOut}>
+                ${this.hass.localize("ui.panel.profile.logout")}
+              </mwc-button>
+            </div>
+          </ha-card>
+          <ha-card
+            .header=${this.hass.localize(
+              "ui.panel.profile.user_settings_header"
+            )}
+          >
+            <div class="card-content">
+              ${this.hass.localize("ui.panel.profile.user_settings_detail")}
+            </div>
             <ha-pick-language-row
               .narrow=${this.narrow}
               .hass=${this.hass}
@@ -110,6 +122,26 @@ class HaPanelProfile extends LitElement {
               .narrow=${this.narrow}
               .hass=${this.hass}
             ></ha-pick-first-weekday-row>
+            ${this.hass.user!.is_admin
+              ? html`
+                  <ha-advanced-mode-row
+                    .hass=${this.hass}
+                    .narrow=${this.narrow}
+                    .coreUserData=${this._coreUserData}
+                  ></ha-advanced-mode-row>
+                `
+              : ""}
+          </ha-card>
+          <ha-card
+            .header=${this.hass.localize(
+              isExternal
+                ? "ui.panel.profile.mobile_app_settings"
+                : "ui.panel.profile.browser_settings"
+            )}
+          >
+            <div class="card-content">
+              ${this.hass.localize("ui.panel.profile.client_settings_detail")}
+            </div>
             <ha-pick-theme-row
               .narrow=${this.narrow}
               .hass=${this.hass}
@@ -159,15 +191,6 @@ class HaPanelProfile extends LitElement {
                   ></ha-push-notifications-row>
                 `
               : ""}
-            ${this.hass.user!.is_admin
-              ? html`
-                  <ha-advanced-mode-row
-                    .hass=${this.hass}
-                    .narrow=${this.narrow}
-                    .coreUserData=${this._coreUserData}
-                  ></ha-advanced-mode-row>
-                `
-              : ""}
             <ha-set-suspend-row
               .narrow=${this.narrow}
               .hass=${this.hass}
@@ -176,11 +199,6 @@ class HaPanelProfile extends LitElement {
               .narrow=${this.narrow}
               .hass=${this.hass}
             ></ha-enable-shortcuts-row>
-            <div class="card-actions">
-              <mwc-button class="warning" @click=${this._handleLogOut}>
-                ${this.hass.localize("ui.panel.profile.logout")}
-              </mwc-button>
-            </div>
           </ha-card>
 
           ${this.hass.user!.credentials.some(

src/translations/en.json

@@ -5887,6 +5887,11 @@
       "profile": {
         "current_user": "You are currently logged in as {fullName}.",
         "is_owner": "You are an owner.",
+        "user_settings_header": "User settings",
+        "user_settings_detail": "The following settings are tied to your account and will persist across all sessions and devices.",
+        "mobile_app_settings": "Mobile app settings",
+        "browser_settings": "Browser settings",
+        "client_settings_detail": "The following settings are local to this client only, and may reset to defaults on logout or when local data is cleared.",
         "logout": "Log out",
         "logout_title": "Log out?",
         "logout_text": "Are you sure you want to log out?",