From f84e89fc887e8b276784dd4a4904b22d5a2dfea1 Mon Sep 17 00:00:00 2001
From: Orgrimarr <github@orgrimarr.fr>
Date: Sat, 17 Jun 2023 15:39:39 +0200
Subject: [PATCH] chore: handle isWorkspaceDrawerOpen transform

---
 src/components/layout/AppLayout.tsx             | 17 ++++++++++++++++-
 src/features/appearance/index.ts                | 11 -----------
 .../workspaces/components/WorkspaceDrawer.tsx   |  5 ++++-
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/components/layout/AppLayout.tsx b/src/components/layout/AppLayout.tsx
index 97795212a4..da9c12abe2 100644
--- a/src/components/layout/AppLayout.tsx
+++ b/src/components/layout/AppLayout.tsx
@@ -53,12 +53,21 @@ const styles = (theme: { workspaces: { drawer: { width: any } } }) => ({
     // width: `calc(100% + ${theme.workspaces.drawer.width}px)`,
     width: '100%',
     transition,
+  },
+  appContentTransformTextWorkspace: {
     transform() {
       return workspaceStore.isWorkspaceDrawerOpen
         ? 'translateX(0)'
         : `translateX(-${theme.workspaces.drawer.width}px)`;
     },
   },
+  appContentTransformIconWorkspace: {
+    transform() {
+      return workspaceStore.isWorkspaceDrawerOpen
+        ? 'translateX(0)'
+        : `translateX(-75px)`;
+    },
+  },
   titleBar: {
     display: 'block',
     zIndex: 1,
@@ -149,7 +158,13 @@ class AppLayout extends Component<PropsWithChildren<IProps>, IState> {
                 className={classes.titleBar}
               />
             )}
-            <div className={`app__content ${classes.appContent}`}>
+            <div
+              className={`app__content ${classes.appContent} ${
+                settings.all.app.useWorkspaceDrawerIconStyle
+                  ? classes.appContentTransformIconWorkspace
+                  : classes.appContentTransformTextWorkspace
+              }`}
+            >
               {workspacesDrawer}
               {sidebar}
               <div className="app__service">
diff --git a/src/features/appearance/index.ts b/src/features/appearance/index.ts
index 0275c7181e..46403275ec 100644
--- a/src/features/appearance/index.ts
+++ b/src/features/appearance/index.ts
@@ -381,15 +381,6 @@ function generateOpenWorkspaceStyle() {
   `;
 }
 
-function generateWorkspaceWidthStyle(widthStr) {
-  const width = Number(widthStr);
-  return `
-    .drawerWithIconWidth {
-      width: ${width}
-    }
-  `;
-}
-
 function generateStyle(settings, app) {
   let style = '';
 
@@ -428,8 +419,6 @@ function generateStyle(settings, app) {
     isFullScreen,
   );
 
-  style += generateWorkspaceWidthStyle(serviceRibbonWidth);
-
   if (shouldShowDragArea) {
     style += generateShowDragAreaStyle(accentColor);
   }
diff --git a/src/features/workspaces/components/WorkspaceDrawer.tsx b/src/features/workspaces/components/WorkspaceDrawer.tsx
index 253d286144..88404ab284 100644
--- a/src/features/workspaces/components/WorkspaceDrawer.tsx
+++ b/src/features/workspaces/components/WorkspaceDrawer.tsx
@@ -46,6 +46,9 @@ const styles = theme => ({
   drawerWithText: {
     width: `${theme.workspaces.drawer.width}px`,
   },
+  drawerWithIcon: {
+    width: '75px',
+  },
   headline: {
     fontSize: '24px',
     marginTop: '38px',
@@ -121,7 +124,7 @@ class WorkspaceDrawer extends Component<IProps> {
       : activeWorkspace;
 
     const drawerWithClass = useIconDisplayStyle
-      ? 'drawerWithIconWidth'
+      ? classes.drawerWithIcon
       : classes.drawerWithText;
     return (
       <div className={`${classes.drawer} ${drawerWithClass} workspaces-drawer`}>