From fc0f9dda038d1af647e506783813c8396f505d15 Mon Sep 17 00:00:00 2001
From: Nicola Benaglia <nico.benaz@gmail.com>
Date: Thu, 29 May 2025 14:38:10 +0200
Subject: [PATCH] Uniform left bar style and appearance

---
 src/App.tsx                                   | 7 +++++++
 src/components/Apps/AppsDevMode.tsx           | 7 ++++---
 src/components/Apps/AppsDevModeHome.tsx       | 1 +
 src/components/Desktop/DesktopLeftSideBar.tsx | 1 -
 src/components/Group/Group.tsx                | 2 +-
 src/components/Group/Settings.tsx             | 4 ++--
 6 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 9b69315..b898a14 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1335,6 +1335,7 @@ function App() {
               />
             </Tooltip>
           )}
+
           {authenticatedMode === 'ltc' && (
             <Tooltip
               title={
@@ -2041,6 +2042,7 @@ function App() {
             useLocalNode={useLocalNode}
           />
         )}
+
         {extState === 'authenticated' && isMainWindow && (
           <Box
             sx={{
@@ -2118,6 +2120,7 @@ function App() {
         {isShowQortalRequest && !isMainWindow && (
           <>
             <Spacer height="120px" />
+
             <Box
               sx={{
                 display: 'flex',
@@ -2213,6 +2216,7 @@ function App() {
                 dangerouslySetInnerHTML={{ __html: messageQortalRequest?.html }}
               />
             )}
+
             <Spacer height="15px" />
 
             <TextP
@@ -2290,6 +2294,7 @@ function App() {
             )}
 
             <Spacer height="29px" />
+
             <Box
               sx={{
                 display: 'flex',
@@ -2307,6 +2312,7 @@ function App() {
                   postProcess: 'capitalizeFirstChar',
                 })}
               </CustomButton>
+
               <CustomButton
                 sx={{
                   minWidth: '102px',
@@ -2577,6 +2583,7 @@ function App() {
                   postProcess: 'capitalizeFirstChar',
                 })}
               </CustomButton>
+
               <CustomButton
                 sx={{
                   minWidth: '102px',
diff --git a/src/components/Apps/AppsDevMode.tsx b/src/components/Apps/AppsDevMode.tsx
index 9881157..52680cd 100644
--- a/src/components/Apps/AppsDevMode.tsx
+++ b/src/components/Apps/AppsDevMode.tsx
@@ -231,11 +231,12 @@ export const AppsDevMode = ({
       <Box
         sx={{
           alignItems: 'center',
+          borderRight: `1px solid ${theme.palette.border.subtle}`,
           display: 'flex',
           flexDirection: 'column',
           gap: '25px',
           height: '100vh',
-          width: '60px',
+          width: 'auto', // must adapt to the choosen language
         }}
       >
         <ButtonBase
@@ -380,7 +381,7 @@ export const AppsDevMode = ({
             flexDirection: 'column',
             height: '100vh',
             overflow: 'auto',
-            width: '100%',
+            width: 'auto',
           }}
         >
           <Spacer height="30px" />
@@ -419,7 +420,7 @@ export const AppsDevMode = ({
               flexDirection: 'column',
               height: '100vh',
               overflow: 'auto',
-              width: '100%',
+              width: 'auto',
             }}
           >
             <Spacer height="30px" />
diff --git a/src/components/Apps/AppsDevModeHome.tsx b/src/components/Apps/AppsDevModeHome.tsx
index 0e739d2..9e56d93 100644
--- a/src/components/Apps/AppsDevModeHome.tsx
+++ b/src/components/Apps/AppsDevModeHome.tsx
@@ -319,6 +319,7 @@ export const AppsDevModeHome = ({
             <AppCircle>
               <Add>+</Add>
             </AppCircle>
+
             <AppCircleLabel>
               {t('core:server', { postProcess: 'capitalizeFirstChar' })}
             </AppCircleLabel>
diff --git a/src/components/Desktop/DesktopLeftSideBar.tsx b/src/components/Desktop/DesktopLeftSideBar.tsx
index 0abcd69..5df4f57 100644
--- a/src/components/Desktop/DesktopLeftSideBar.tsx
+++ b/src/components/Desktop/DesktopLeftSideBar.tsx
@@ -26,7 +26,6 @@ export const DesktopSideBar = ({
   myName,
 }) => {
   const [isEnabledDevMode, setIsEnabledDevMode] = useAtom(enabledDevModeAtom);
-
   const theme = useTheme();
   const { t } = useTranslation([
     'auth',
diff --git a/src/components/Group/Group.tsx b/src/components/Group/Group.tsx
index 7d1370d..aae44e8 100644
--- a/src/components/Group/Group.tsx
+++ b/src/components/Group/Group.tsx
@@ -1913,7 +1913,7 @@ export const Group = ({
         setInfo={setInfoSnack}
       />
 
-      <div
+      <div // TODO use Box
         style={{
           alignItems: 'flex-start',
           display: 'flex',
diff --git a/src/components/Group/Settings.tsx b/src/components/Group/Settings.tsx
index 43ba6cf..77b70fa 100644
--- a/src/components/Group/Settings.tsx
+++ b/src/components/Group/Settings.tsx
@@ -381,13 +381,13 @@ const ExportPrivateKey = ({ rawWallet }) => {
               setPrivateKey('');
             }}
           >
-            {t('group:action.cancel', {
+            {t('core:action.cancel', {
               postProcess: 'capitalizeFirstChar',
             })}
           </Button>
 
           <Button variant="contained" onClick={exportPrivateKeyFunc}>
-            {t('group:action.decrypt', {
+            {t('core:action.decrypt', {
               postProcess: 'capitalizeFirstChar',
             })}
           </Button>