Add options to override landscape cutout (#162)

lib/screens/channel/video_chat.dart

@@ -195,6 +195,11 @@ class _VideoChatState extends State<VideoChat> {
                   color: settingsStore.showVideo ? Colors.black : Theme.of(context).scaffoldBackgroundColor,
                   child: SafeArea(
                     bottom: false,
+                    left:
+                        (settingsStore.landscapeCutout == LandscapeCutoutType.both || settingsStore.landscapeCutout == LandscapeCutoutType.left) ? false : true,
+                    right: (settingsStore.landscapeCutout == LandscapeCutoutType.both || settingsStore.landscapeCutout == LandscapeCutoutType.right)
+                        ? false
+                        : true,
                     child: settingsStore.showVideo
                         ? settingsStore.fullScreen
                             ? Stack(

lib/screens/settings/sections/chat_settings.dart

@@ -21,6 +21,8 @@ class _ChatSettingsState extends State<ChatSettings> {
 
   @override
   Widget build(BuildContext context) {
+    const landscapeCutouts = ['None', 'Left', 'Right', 'Both'];
+
     const timestamps = ['Disabled', '12-hour', '24-hour'];
 
     const sectionPadding = EdgeInsets.only(left: 16.0, bottom: 5.0, top: 30.0);
@@ -92,6 +94,21 @@ class _ChatSettingsState extends State<ChatSettings> {
             value: settingsStore.landscapeChatLeftSide,
             onChanged: (newValue) => settingsStore.landscapeChatLeftSide = newValue,
           ),
+          ListTile(
+            isThreeLine: true,
+            title: const Text('Landscape fill cutout side'),
+            subtitle: const Text('Overrides and fills the available space in the display cutout/notch.'),
+            trailing: DropdownButton(
+              value: settingsStore.landscapeCutout,
+              onChanged: (LandscapeCutoutType? newValue) => settingsStore.landscapeCutout = newValue!,
+              items: LandscapeCutoutType.values
+                  .map((LandscapeCutoutType value) => DropdownMenuItem(
+                        value: value,
+                        child: Text(landscapeCutouts[value.index]),
+                      ))
+                  .toList(),
+            ),
+          ),
           const SizedBox(height: 15.0),
           ListTile(
             title: Row(

lib/screens/settings/stores/settings_store.dart

@@ -88,6 +88,7 @@ abstract class _SettingsStoreBase with Store {
   static const defaultChatDelay = 0.0;
   static const defaultChatOnlyPreventSleep = true;
   static const defaultAutocomplete = true;
+  static const defaultLandscapeCutout = LandscapeCutoutType.none;
 
   static const defaultShowBottomBar = true;
   static const defaultLandscapeChatLeftSide = false;
@@ -127,6 +128,10 @@ abstract class _SettingsStoreBase with Store {
   @observable
   var landscapeChatLeftSide = defaultLandscapeChatLeftSide;
 
+  @JsonKey(defaultValue: defaultLandscapeCutout)
+  @observable
+  var landscapeCutout = defaultLandscapeCutout;
+
   @JsonKey(defaultValue: defaultChatWidth)
   @observable
   var chatWidth = defaultChatWidth;
@@ -254,3 +259,10 @@ enum TimestampType {
   twelve,
   twentyFour,
 }
+
+enum LandscapeCutoutType {
+  none,
+  left,
+  right,
+  both,
+}

lib/screens/settings/stores/settings_store.g.dart

@@ -25,6 +25,9 @@ SettingsStore _$SettingsStoreFromJson(Map<String, dynamic> json) =>
       ..autocomplete = json['autocomplete'] as bool? ?? true
       ..showBottomBar = json['showBottomBar'] as bool? ?? true
       ..landscapeChatLeftSide = json['landscapeChatLeftSide'] as bool? ?? false
+      ..landscapeCutout = $enumDecodeNullable(
+              _$LandscapeCutoutTypeEnumMap, json['landscapeCutout']) ??
+          LandscapeCutoutType.none
       ..chatWidth = (json['chatWidth'] as num?)?.toDouble() ?? 0.3
       ..fullScreenChatOverlayOpacity =
           (json['fullScreenChatOverlayOpacity'] as num?)?.toDouble() ?? 0.5
@@ -64,6 +67,8 @@ Map<String, dynamic> _$SettingsStoreToJson(SettingsStore instance) =>
       'autocomplete': instance.autocomplete,
       'showBottomBar': instance.showBottomBar,
       'landscapeChatLeftSide': instance.landscapeChatLeftSide,
+      'landscapeCutout':
+          _$LandscapeCutoutTypeEnumMap[instance.landscapeCutout]!,
       'chatWidth': instance.chatWidth,
       'fullScreenChatOverlayOpacity': instance.fullScreenChatOverlayOpacity,
       'showZeroWidth': instance.showZeroWidth,
@@ -89,6 +94,13 @@ const _$ThemeTypeEnumMap = {
   ThemeType.black: 'black',
 };
 
+const _$LandscapeCutoutTypeEnumMap = {
+  LandscapeCutoutType.none: 'none',
+  LandscapeCutoutType.left: 'left',
+  LandscapeCutoutType.right: 'right',
+  LandscapeCutoutType.both: 'both',
+};
+
 const _$TimestampTypeEnumMap = {
   TimestampType.disabled: 'disabled',
   TimestampType.twelve: 'twelve',
@@ -344,6 +356,22 @@ mixin _$SettingsStore on _SettingsStoreBase, Store {
     });
   }
 
+  late final _$landscapeCutoutAtom =
+      Atom(name: '_SettingsStoreBase.landscapeCutout', context: context);
+
+  @override
+  LandscapeCutoutType get landscapeCutout {
+    _$landscapeCutoutAtom.reportRead();
+    return super.landscapeCutout;
+  }
+
+  @override
+  set landscapeCutout(LandscapeCutoutType value) {
+    _$landscapeCutoutAtom.reportWrite(value, super.landscapeCutout, () {
+      super.landscapeCutout = value;
+    });
+  }
+
   late final _$chatWidthAtom =
       Atom(name: '_SettingsStoreBase.chatWidth', context: context);
 
@@ -691,6 +719,7 @@ chatOnlyPreventSleep: ${chatOnlyPreventSleep},
 autocomplete: ${autocomplete},
 showBottomBar: ${showBottomBar},
 landscapeChatLeftSide: ${landscapeChatLeftSide},
+landscapeCutout: ${landscapeCutout},
 chatWidth: ${chatWidth},
 fullScreenChatOverlayOpacity: ${fullScreenChatOverlayOpacity},
 showZeroWidth: ${showZeroWidth},