From c05c92b442627c3b4c5f31d6b0ee53c3b2581c18 Mon Sep 17 00:00:00 2001
From: Shawn <shawn@gskinner.com>
Date: Fri, 1 Sep 2023 14:51:46 -0600
Subject: [PATCH] Use media query size to switch between nav rail and bottom
 tab menu

---
 lib/logic/app_logic.dart | 7 +++++--
 lib/ui/app_scaffold.dart | 4 ++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/lib/logic/app_logic.dart b/lib/logic/app_logic.dart
index 2f669fbd..f6b87a31 100644
--- a/lib/logic/app_logic.dart
+++ b/lib/logic/app_logic.dart
@@ -9,6 +9,8 @@ import 'package:wonders/ui/common/modals/fullscreen_video_viewer.dart';
 import 'package:wonders/ui/common/utils/page_routes.dart';
 
 class AppLogic {
+  Size _appSize = Size.zero;
+
   /// Indicates to the rest of the app that bootstrap has not completed.
   /// The router will use this to prevent redirects while bootstrapping.
   bool isBootstrapComplete = false;
@@ -78,16 +80,17 @@ class AppLogic {
   }
 
   /// Called from the UI layer once a MediaQuery has been obtained
-  void handleAppSizeChanged() {
+  void handleAppSizeChanged(Size appSize) {
     /// Disable landscape layout on smaller form factors
     bool isSmall = display.size.shortestSide / display.devicePixelRatio < 600;
     supportedOrientations = isSmall ? [Axis.vertical] : [Axis.vertical, Axis.horizontal];
     _updateSystemOrientation();
+    _appSize = appSize;
   }
 
   Display get display => PlatformDispatcher.instance.displays.first;
 
-  bool shouldUseNavRail() => display.size.width > display.size.height && display.size.height > 250;
+  bool shouldUseNavRail() => _appSize.width > _appSize.height && _appSize.height > 250;
 
   /// Enable landscape, portrait or both. Views can call this method to override the default settings.
   /// For example, the [FullscreenVideoViewer] always wants to enable both landscape and portrait.
diff --git a/lib/ui/app_scaffold.dart b/lib/ui/app_scaffold.dart
index ffbeef5f..d74aaf8b 100644
--- a/lib/ui/app_scaffold.dart
+++ b/lib/ui/app_scaffold.dart
@@ -10,8 +10,8 @@ class WondersAppScaffold extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     // Listen to the device size, and update AppStyle when it changes
-    MediaQuery.of(context);
-    appLogic.handleAppSizeChanged();
+    final mq = MediaQuery.of(context);
+    appLogic.handleAppSizeChanged(mq.size);
     // Set default timing for animations in the app
     Animate.defaultDuration = _style.times.fast;
     // Create a style object that will be passed down the widget tree