From 7a9d5b0c298c7cd00e2dd1c6859aecfb70f8a0f5 Mon Sep 17 00:00:00 2001
From: Quentin Gliech <quenting@element.io>
Date: Wed, 22 Oct 2025 11:29:52 +0200
Subject: [PATCH] Highlight dangerous scopes when consenting to them

---
 frontend/src/components/SessionDetail/SessionInfo.tsx |  4 ++--
 frontend/src/templates.css                            | 10 ++++++++++
 templates/components/scope.html                       |  4 ++--
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/SessionDetail/SessionInfo.tsx b/frontend/src/components/SessionDetail/SessionInfo.tsx
index e170e9487..876fbc567 100644
--- a/frontend/src/components/SessionDetail/SessionInfo.tsx
+++ b/frontend/src/components/SessionDetail/SessionInfo.tsx
@@ -68,7 +68,7 @@ export const ScopeSendMessages: React.FC = () => {
 const ScopeSynapseAdmin: React.FC = () => {
   const { t } = useTranslation();
   return (
-    <VisualListItem Icon={IconErrorSolid}>
+    <VisualListItem Icon={IconErrorSolid} destructive>
       {t("mas.scope.synapse_admin")}
     </VisualListItem>
   );
@@ -77,7 +77,7 @@ const ScopeSynapseAdmin: React.FC = () => {
 const ScopeMasAdmin: React.FC = () => {
   const { t } = useTranslation();
   return (
-    <VisualListItem Icon={IconErrorSolid}>
+    <VisualListItem Icon={IconErrorSolid} destructive>
       {t("mas.scope.mas_admin")}
     </VisualListItem>
   );
diff --git a/frontend/src/templates.css b/frontend/src/templates.css
index 9d332a4ed..76eb93a94 100644
--- a/frontend/src/templates.css
+++ b/frontend/src/templates.css
@@ -117,6 +117,16 @@
         width: var(--cpd-space-6x);
         color: var(--cpd-color-icon-quaternary);
       }
+
+      &.dangerous {
+        border: 1px solid var(--cpd-color-border-critical-subtle);
+        background-color: var(--cpd-color-bg-critical-subtle);
+        color: var(--cpd-color-text-critical-primary);
+
+        & > svg {
+          color: var(--cpd-color-icon-critical-primary);
+        }
+      }
     }
   }
 }
diff --git a/templates/components/scope.html b/templates/components/scope.html
index fbe68d70e..96b5119cb 100644
--- a/templates/components/scope.html
+++ b/templates/components/scope.html
@@ -18,9 +18,9 @@ Please see LICENSE files in the repository root for full details.
         <li>{{ icon.chat() }}<p>{{ _("mas.scope.view_messages") }}</p></li>
         <li>{{ icon.send() }}<p>{{ _("mas.scope.send_messages") }}</p></li>
       {% elif scope == "urn:synapse:admin:*" %}
-        <li>{{ icon.error_solid() }}<p>{{ _("mas.scope.synapse_admin") }}</p></li>
+        <li class="dangerous">{{ icon.room() }}<p>{{ _("mas.scope.synapse_admin") }}</p></li>
       {% elif scope == "urn:mas:admin" %}
-        <li>{{ icon.error_solid() }}<p>{{ _("mas.scope.mas_admin") }}</p></li>
+        <li class="dangerous">{{ icon.admin() }}<p>{{ _("mas.scope.mas_admin") }}</p></li>
       {% elif scope is startingwith("urn:matrix:client:device:") or scope is startingwith("urn:matrix:org.matrix.msc2967.client:device:") %}
         {# We hide this scope #}
       {% else %}