From 471ec1b3a98a85d7202aec07a8784d442cc776eb Mon Sep 17 00:00:00 2001
From: ggurdin <46800240+ggurdin@users.noreply.github.com>
Date: Mon, 5 Jan 2026 15:58:08 -0500
Subject: [PATCH] chore: stack expanded space navigation menu over screen in
 one column mode (#5069)

---
 .../spaces/space_navigation_column.dart       | 21 +++--------
 lib/widgets/layouts/two_column_layout.dart    | 36 +++++++++++++++++--
 2 files changed, 38 insertions(+), 19 deletions(-)

diff --git a/lib/pangea/spaces/space_navigation_column.dart b/lib/pangea/spaces/space_navigation_column.dart
index 0b52100e2..cc6891cdf 100644
--- a/lib/pangea/spaces/space_navigation_column.dart
+++ b/lib/pangea/spaces/space_navigation_column.dart
@@ -19,8 +19,10 @@ import 'package:fluffychat/widgets/navigation_rail.dart';
 
 class SpaceNavigationColumn extends StatefulWidget {
   final GoRouterState state;
+  final bool showNavRail;
   const SpaceNavigationColumn({
     required this.state,
+    required this.showNavRail,
     super.key,
   });
 
@@ -67,29 +69,16 @@ class SpaceNavigationColumnState extends State<SpaceNavigationColumn> {
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     final isColumnMode = FluffyThemes.isColumnMode(context);
-    bool showNavRail = isColumnMode;
-    if (!showNavRail) {
-      final roomID = widget.state.pathParameters['roomid'];
-      final spaceID = widget.state.pathParameters['spaceid'];
-
-      if (roomID == null && spaceID == null) {
-        showNavRail = !["newcourse", ":construct"].any(
-          (p) => widget.state.fullPath?.contains(p) ?? false,
-        );
-      } else if (roomID == null) {
-        showNavRail = widget.state.fullPath?.endsWith(':spaceid') == true;
-      }
-    }
 
     final navRailWidth = isColumnMode
         ? FluffyThemes.navRailWidth
         : FluffyThemes.navRailWidth - 8.0;
 
-    final double navRailExtraWidth = showNavRail ? 250.0 : 0.0;
+    final double navRailExtraWidth = widget.showNavRail ? 250.0 : 0.0;
     final double columnWidth =
         isColumnMode ? FluffyThemes.columnWidth + 1.0 : 0;
 
-    final double railWidth = showNavRail ? navRailWidth + 1.0 : 0;
+    final double railWidth = widget.showNavRail ? navRailWidth + 1.0 : 0;
     final double baseWidth = columnWidth + railWidth;
     final double expandedWidth = baseWidth < navRailExtraWidth
         ? navRailExtraWidth + railWidth
@@ -122,7 +111,7 @@ class SpaceNavigationColumnState extends State<SpaceNavigationColumn> {
                 ),
               ),
             ),
-          if (showNavRail)
+          if (widget.showNavRail)
             HoverBuilder(
               builder: (context, hovered) {
                 WidgetsBinding.instance.addPostFrameCallback((_) {
diff --git a/lib/widgets/layouts/two_column_layout.dart b/lib/widgets/layouts/two_column_layout.dart
index 0fda63949..c9ad03897 100644
--- a/lib/widgets/layouts/two_column_layout.dart
+++ b/lib/widgets/layouts/two_column_layout.dart
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 
 import 'package:go_router/go_router.dart';
 
+import 'package:fluffychat/config/themes.dart';
 import 'package:fluffychat/pangea/spaces/space_navigation_column.dart';
 
 class TwoColumnLayout extends StatelessWidget {
@@ -23,13 +24,42 @@ class TwoColumnLayout extends StatelessWidget {
   Widget build(BuildContext context) {
     // #Pangea
     // final theme = Theme.of(context);
+    final isColumnMode = FluffyThemes.isColumnMode(context);
+    bool showNavRail = isColumnMode;
+    if (!showNavRail) {
+      final roomID = state.pathParameters['roomid'];
+      final spaceID = state.pathParameters['spaceid'];
+
+      if (roomID == null && spaceID == null) {
+        showNavRail = !["newcourse", ":construct"].any(
+          (p) => state.fullPath?.contains(p) ?? false,
+        );
+      } else if (roomID == null) {
+        showNavRail = state.fullPath?.endsWith(':spaceid') == true;
+      }
+    }
+
+    final columnWidth =
+        (showNavRail ? (FluffyThemes.navRailWidth + 1.0) : 0.0) +
+            (isColumnMode ? (FluffyThemes.columnWidth + 1.0) : 0.0);
     // Pangea#
     return ScaffoldMessenger(
       child: Scaffold(
-        body: Row(
+        // #Pangea
+        // body: Row(
+        body: Stack(
+          fit: StackFit.expand,
+          // Pangea#
           children: [
             // #Pangea
-            SpaceNavigationColumn(state: state),
+            Positioned.fill(
+              left: columnWidth,
+              child: ClipRRect(child: sideView),
+            ),
+            SpaceNavigationColumn(
+              state: state,
+              showNavRail: showNavRail,
+            ),
             // Container(
             //   clipBehavior: Clip.antiAlias,
             //   decoration: const BoxDecoration(),
@@ -37,8 +67,8 @@ class TwoColumnLayout extends StatelessWidget {
             //   child: mainView,
             // ),
             // Container(width: 1.0, color: theme.dividerColor),
+            // Expanded(child: ClipRRect(child: sideView)),
             // Pangea#
-            Expanded(child: ClipRRect(child: sideView)),
           ],
         ),
       ),