From 96ae664829342a678ac63872ad6b6b4f1a7d7a1b Mon Sep 17 00:00:00 2001
From: Jonathan Haas <haas@dtv-verkehrsconsult.de>
Date: Thu, 22 May 2025 11:58:38 +0200
Subject: [PATCH] feat(react): Change the expand icon to have the arrows point
 inwards if expand is disabled

---
 .../react/components/Editor/components/HeaderMenu.mjs    | 9 ++++++---
 packages/react/components/Icon/index.mjs                 | 7 +++++++
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/packages/react/components/Editor/components/HeaderMenu.mjs b/packages/react/components/Editor/components/HeaderMenu.mjs
index ee444d20193..9e2915f68ea 100644
--- a/packages/react/components/Editor/components/HeaderMenu.mjs
+++ b/packages/react/components/Editor/components/HeaderMenu.mjs
@@ -11,6 +11,7 @@ import { ViewIcon, viewLabels } from './views/index.mjs'
 import { Tooltip } from './Tooltip.mjs'
 import {
   AsideIcon,
+  CompactIcon,
   DetailIcon,
   ExpandIcon,
   ExportIcon,
@@ -336,9 +337,11 @@ export const HeaderMenuDraftViewIcons = (props) => {
           }
           tooltip="Turns Expand on or off (see Core Settings)"
         >
-          <ExpandIcon
-            className={`${size} ${[false, 0, '0'].includes(settings.expand) ? style.custom : style.dflt}`}
-          />
+          {[false, 0, '0'].includes(settings.expand) ? (
+            <CompactIcon className={`${size} ${style.custom}`} />
+          ) : (
+            <ExpandIcon className={`${size} ${style.dflt}`} />
+          )}
         </Button>
       ) : null}
       <HeaderMenuIconSpacer />
diff --git a/packages/react/components/Icon/index.mjs b/packages/react/components/Icon/index.mjs
index 5ac9753c75e..42b8a2bff42 100644
--- a/packages/react/components/Icon/index.mjs
+++ b/packages/react/components/Icon/index.mjs
@@ -143,6 +143,13 @@ export const CodeIcon = (props) => (
   </IconWrapper>
 )
 
+// Looks like arrows pointing inwards
+export const CompactIcon = (props) => (
+  <IconWrapper {...props}>
+    <path d="m15 15v4.5m0-4.5h4.5m-15.8-11.3 5.25 5.25m6 0v-4.5m0 4.5h4.5m-15.8 11.3 5.25-5.25h-4.5m4.5 0v4.5m11.3-15.8-5.25 5.25m-6 0h-4.5m4.5 0v-4.5m11.3 15.8-5.25-5.25" />
+  </IconWrapper>
+)
+
 // FIXME
 export const CompareIcon = (props) => (
   <IconWrapper {...props}>