chore: Follow up preserve state in 3 column mode

lib/config/routes.dart

@@ -210,15 +210,26 @@ class AppRoutes {
                     ),
                   ],
                 ),
+                ShellRoute(
+                  pageBuilder: (context, state, child) => defaultPageBuilder(
+                    context,
+                    SideViewLayout(
+                      mainView: ChatPage(
+                        roomId: state.pathParameters['roomid']!,
+                      ),
+                      sideView:
+                          state.fullPath == '/rooms/:roomid' ? null : child,
+                    ),
+                  ),
+                  routes: [
                     GoRoute(
                       path: ':roomid',
                       pageBuilder: (context, state) => defaultPageBuilder(
                         context,
-                    ChatPage(
+                        const EmptyPage(),
-                      roomId: state.pathParameters['roomid']!,
-                    ),
                       ),
-                  redirect: (context, state) => !isLoggedIn ? '/home' : null,
+                      redirect: (context, state) =>
+                          !isLoggedIn ? '/home' : null,
                       routes: [
                         GoRoute(
                           path: 'encryption',
@@ -238,20 +249,6 @@ class AppRoutes {
                           redirect: (context, state) =>
                               !isLoggedIn ? '/home' : null,
                         ),
-                    ShellRoute(
-                      pageBuilder: (context, state, child) =>
-                          defaultPageBuilder(
-                        context,
-                        !FluffyThemes.isThreeColumnMode(context)
-                            ? child
-                            : SideViewLayout(
-                                mainView: ChatPage(
-                                  roomId: state.pathParameters['roomid']!,
-                                ),
-                                sideView: child,
-                              ),
-                      ),
-                      routes: [
                         GoRoute(
                           path: 'details',
                           pageBuilder: (context, state) => defaultPageBuilder(

lib/widgets/layouts/side_view_layout.dart

@@ -13,26 +13,43 @@ class SideViewLayout extends StatelessWidget {
     final sideView = this.sideView;
     final hideSideView =
         !FluffyThemes.isThreeColumnMode(context) || sideView == null;
-    return sideView == null
+    const sideViewWidth = 360.0;
-        ? mainView
+    return Stack(
-        : hideSideView
-            ? sideView
-            : Row(
       children: [
-                  Expanded(
+        AnimatedPositioned(
+          duration: FluffyThemes.animationDuration,
+          curve: FluffyThemes.animationCurve,
+          top: 0,
+          left: 0,
+          bottom: 0,
+          right: hideSideView ? 0 : sideViewWidth,
           child: ClipRRect(child: mainView),
         ),
-                  Container(
+        AnimatedPositioned(
-                    width: 1.0,
-                    color: Theme.of(context).dividerColor,
-                  ),
-                  AnimatedContainer(
           duration: FluffyThemes.animationDuration,
           curve: FluffyThemes.animationCurve,
-                    clipBehavior: Clip.antiAlias,
+          bottom: 0,
-                    decoration: const BoxDecoration(),
+          top: 0,
-                    width: hideSideView ? 0 : 360.0,
+          right: 0,
-                    child: hideSideView ? null : sideView,
+          left: !FluffyThemes.isThreeColumnMode(context) && sideView != null
+              ? 0
+              : null,
+          width: sideView == null
+              ? 0
+              : !FluffyThemes.isThreeColumnMode(context)
+                  ? null
+                  : sideViewWidth,
+          child: Container(
+            clipBehavior: Clip.hardEdge,
+            decoration: BoxDecoration(
+              border: Border(
+                left: BorderSide(
+                  color: Theme.of(context).dividerColor,
+                ),
+              ),
+            ),
+            child: sideView,
+          ),
         ),
       ],
     );