Refactor sidebar layout and button handling in App.tsx

src/App.tsx

@@ -1357,8 +1357,9 @@ export default function App() {
 
   return (
     <div className={`app app--theme-${theme}${sidebarCollapsed ? " app--sidebar-collapsed" : ""}`}>
+      <aside className={`sidebar${sidebarCollapsed ? " sidebar--collapsed" : ""}`}>
         {!sidebarCollapsed ? (
-      <aside className="sidebar">
+          <>
             <div className="sidebar__header">
               <div className="sidebar__title-row">
                 <div className="app-title">TextDB</div>
@@ -1371,9 +1372,7 @@ export default function App() {
               />
             </div>
             <div className="prompt-list">
-          <div
-            className="prompt-list__inner"
-          >
+              <div className="prompt-list__inner">
                 {loadingTexts || loadingFolders ? (
                   <div className="empty">Loading…</div>
                 ) : hasSearch && texts.length === 0 ? (
@@ -1391,7 +1390,21 @@ export default function App() {
                 )}
               </div>
             </div>
-        <div className="sidebar__footer">
+          </>
+        ) : null}
+        <div className={`sidebar__footer${sidebarCollapsed ? " sidebar__footer--collapsed" : ""}`}>
+          {sidebarCollapsed ? (
+            <button
+              className="icon-button"
+              onClick={() => setSidebarCollapsed(false)}
+              aria-label="Expand sidebar"
+              title="Expand sidebar"
+              type="button"
+            >
+              <span className="icon-button__glyph" aria-hidden="true">▶</span>
+            </button>
+          ) : (
+            <>
               <button
                 className="icon-button"
                 onClick={handleNewFolder}
@@ -1437,9 +1450,10 @@ export default function App() {
               >
                 <span className="icon-button__glyph" aria-hidden="true">◀</span>
               </button>
+            </>
+          )}
         </div>
       </aside>
-      ) : null}
 
       <main className="workspace">
         <div className="workspace__body">
@@ -1665,21 +1679,6 @@ export default function App() {
             </div>
           )}
         </div>
-        {sidebarCollapsed ? (
-          <div className="workspace__footer">
-            <div className="sidebar__footer sidebar__footer--collapsed">
-              <button
-                className="icon-button"
-                onClick={() => setSidebarCollapsed(false)}
-                aria-label="Expand sidebar"
-                title="Expand sidebar"
-                type="button"
-              >
-                <span className="icon-button__glyph" aria-hidden="true">▶</span>
-              </button>
-            </div>
-          </div>
-        ) : null}
       </main>
 
       {settingsOpen ? (