From 44fb07033b36a109e22a92800e8eddccd3921a89 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Wed, 8 Oct 2025 11:45:07 +0100
Subject: [PATCH] refactor: reorder toolbar buttons for better UX

- New order: User, Home, Settings, Add, Refresh, Logout
- Profile/user first for identity prominence
- Core navigation (Home, Settings) before actions
- Actions (Add, Refresh) grouped together
- Logout at the end as final action
---
 src/components/SidebarHeader.tsx | 46 ++++++++++++++++----------------
 1 file changed, 23 insertions(+), 23 deletions(-)

diff --git a/src/components/SidebarHeader.tsx b/src/components/SidebarHeader.tsx
index cbb97558..1ad1259c 100644
--- a/src/components/SidebarHeader.tsx
+++ b/src/components/SidebarHeader.tsx
@@ -82,22 +82,6 @@ const SidebarHeader: React.FC<SidebarHeaderProps> = ({ onToggleCollapse, onLogou
           <FontAwesomeIcon icon={faChevronRight} />
         </button>
         <div className="sidebar-header-right">
-        <IconButton
-          icon={faHome}
-          onClick={() => navigate('/')}
-          title="Home"
-          ariaLabel="Home"
-          variant="ghost"
-        />
-        {activeAccount && (
-          <IconButton
-            icon={faPlus}
-            onClick={() => setShowAddModal(true)}
-            title="Add bookmark"
-            ariaLabel="Add bookmark"
-            variant="ghost"
-          />
-        )}
         <div 
           className="profile-avatar" 
           title={activeAccount ? getUserDisplayName() : "Login"}
@@ -110,6 +94,29 @@ const SidebarHeader: React.FC<SidebarHeaderProps> = ({ onToggleCollapse, onLogou
             <FontAwesomeIcon icon={faUserCircle} />
           )}
         </div>
+        <IconButton
+          icon={faHome}
+          onClick={() => navigate('/')}
+          title="Home"
+          ariaLabel="Home"
+          variant="ghost"
+        />
+        <IconButton
+          icon={faGear}
+          onClick={onOpenSettings}
+          title="Settings"
+          ariaLabel="Settings"
+          variant="ghost"
+        />
+        {activeAccount && (
+          <IconButton
+            icon={faPlus}
+            onClick={() => setShowAddModal(true)}
+            title="Add bookmark"
+            ariaLabel="Add bookmark"
+            variant="ghost"
+          />
+        )}
         {onRefresh && (
           <IconButton
             icon={faRotate}
@@ -121,13 +128,6 @@ const SidebarHeader: React.FC<SidebarHeaderProps> = ({ onToggleCollapse, onLogou
             spin={isRefreshing}
           />
         )}
-        <IconButton
-          icon={faGear}
-          onClick={onOpenSettings}
-          title="Settings"
-          ariaLabel="Settings"
-          variant="ghost"
-        />
         {activeAccount ? (
           <IconButton
             icon={faRightFromBracket}