From 0758b8cdfe40a8b2baf4b4b817e24d6ef5cfe837 Mon Sep 17 00:00:00 2001
From: Kerry <kerrya@element.io>
Date: Mon, 16 Jan 2023 10:31:07 +1300
Subject: [PATCH] Device manager - tweak settings display (#9905)

* compound devices icon

* update icon for new session manager tab

* condense privacy > analytics / sessions sections slightly
---
 res/css/views/dialogs/_UserSettingsDialog.pcss               | 4 ++++
 res/img/element-icons/settings/devices.svg                   | 5 +++++
 src/components/views/dialogs/UserSettingsDialog.tsx          | 2 +-
 .../views/settings/tabs/user/SecurityUserSettingsTab.tsx     | 2 --
 4 files changed, 10 insertions(+), 3 deletions(-)
 create mode 100644 res/img/element-icons/settings/devices.svg

diff --git a/res/css/views/dialogs/_UserSettingsDialog.pcss b/res/css/views/dialogs/_UserSettingsDialog.pcss
index 118c057b83..41d39f8b79 100644
--- a/res/css/views/dialogs/_UserSettingsDialog.pcss
+++ b/res/css/views/dialogs/_UserSettingsDialog.pcss
@@ -49,6 +49,10 @@ limitations under the License.
     mask-image: url("$(res)/img/element-icons/security.svg");
 }
 
+.mx_UserSettingsDialog_sessionsIcon::before {
+    mask-image: url("$(res)/img/element-icons/settings/devices.svg");
+}
+
 .mx_UserSettingsDialog_helpIcon::before {
     mask-image: url("$(res)/img/element-icons/settings/help.svg");
 }
diff --git a/res/img/element-icons/settings/devices.svg b/res/img/element-icons/settings/devices.svg
new file mode 100644
index 0000000000..4d2f171993
--- /dev/null
+++ b/res/img/element-icons/settings/devices.svg
@@ -0,0 +1,5 @@
+<svg width="21" height="19" viewBox="0 0 21 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 2V7.005L18 7.003V4H2V14H13V16H2C1.45 16 0.979333 15.8043 0.588 15.413C0.196 15.021 0 14.55 0 14V2C0 1.45 0.196 0.979333 0.588 0.588C0.979333 0.196 1.45 0 2 0H18C18.55 0 19.021 0.196 19.413 0.588C19.8043 0.979333 20 1.45 20 2Z" fill="currentColor"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15 8L20 8.005C20.55 8.005 21 8.45 21 9V18C21 18.55 20.55 19 20
+19H15C14.45 19 14 18.55 14 18V9C14 8.45 14.45 8 15 8ZM15 17H20V10H15V17Z" fill="currentColor"/>
+</svg>
diff --git a/src/components/views/dialogs/UserSettingsDialog.tsx b/src/components/views/dialogs/UserSettingsDialog.tsx
index a7877072b3..7b33ca58da 100644
--- a/src/components/views/dialogs/UserSettingsDialog.tsx
+++ b/src/components/views/dialogs/UserSettingsDialog.tsx
@@ -164,7 +164,7 @@ export default class UserSettingsDialog extends React.Component<IProps, IState>
                 new Tab(
                     UserTab.SessionManager,
                     _td("Sessions"),
-                    "mx_UserSettingsDialog_securityIcon",
+                    "mx_UserSettingsDialog_sessionsIcon",
                     <SessionManagerTab />,
                     // don't track with posthog while under construction
                     undefined,
diff --git a/src/components/views/settings/tabs/user/SecurityUserSettingsTab.tsx b/src/components/views/settings/tabs/user/SecurityUserSettingsTab.tsx
index 018ecf76ae..550b395da5 100644
--- a/src/components/views/settings/tabs/user/SecurityUserSettingsTab.tsx
+++ b/src/components/views/settings/tabs/user/SecurityUserSettingsTab.tsx
@@ -353,8 +353,6 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
                         {PosthogAnalytics.instance.isEnabled() && (
                             <SettingsFlag name="pseudonymousAnalyticsOptIn" level={SettingLevel.ACCOUNT} />
                         )}
-                    </div>
-                    <div className="mx_SettingsTab_section">
                         <span className="mx_SettingsTab_subheading">{_t("Sessions")}</span>
                         <SettingsFlag name="deviceClientInformationOptIn" level={SettingLevel.ACCOUNT} />
                     </div>