From 0bbfe966d84eee523c0628d3c5509a41ede50e5b Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Thu, 28 Sep 2023 13:42:38 -0700
Subject: [PATCH] Fix some bugs in tablet mode

---
 src/view/com/util/layouts/withBreakpoints.tsx   |  8 ++++----
 src/view/com/util/load-latest/LoadLatestBtn.tsx | 17 ++++++++++-------
 2 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/src/view/com/util/layouts/withBreakpoints.tsx b/src/view/com/util/layouts/withBreakpoints.tsx
index 5746aa660d..a5d20dd259 100644
--- a/src/view/com/util/layouts/withBreakpoints.tsx
+++ b/src/view/com/util/layouts/withBreakpoints.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import {isNative} from 'platform/detection'
+
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 
 export const withBreakpoints = <P extends object>(
@@ -8,12 +8,12 @@ export const withBreakpoints = <P extends object>(
   Desktop: React.ComponentType<P>,
 ): React.FC<P> =>
   function WithBreakpoints(props: P) {
-    const {isMobile, isTabletOrMobile} = useWebMediaQueries()
+    const {isMobile, isTablet} = useWebMediaQueries()
 
-    if (isMobile || isNative) {
+    if (isMobile) {
       return <Mobile {...props} />
     }
-    if (isTabletOrMobile) {
+    if (isTablet) {
       return <Tablet {...props} />
     }
     return <Desktop {...props} />
diff --git a/src/view/com/util/load-latest/LoadLatestBtn.tsx b/src/view/com/util/load-latest/LoadLatestBtn.tsx
index f02e4a2bd7..9495a1be8a 100644
--- a/src/view/com/util/load-latest/LoadLatestBtn.tsx
+++ b/src/view/com/util/load-latest/LoadLatestBtn.tsx
@@ -1,13 +1,14 @@
 import React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
-import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import Animated from 'react-native-reanimated'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {useMediaQuery} from 'react-responsive'
+
+import {HITSLOP_20} from 'lib/constants'
+import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode'
 import {usePalette} from 'lib/hooks/usePalette'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 import {colors} from 'lib/styles'
-import {HITSLOP_20} from 'lib/constants'
-import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode'
 const AnimatedTouchableOpacity =
   Animated.createAnimatedComponent(TouchableOpacity)
 import {isWeb} from 'platform/detection'
@@ -72,10 +73,12 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
-  loadLatestInline: {
-    // @ts-ignore web only
-    left: 'calc(50vw - 282px)',
-  },
+  loadLatestInline: isWeb
+    ? {
+        // @ts-ignore web only
+        left: 'calc(50vw - 282px)',
+      }
+    : {},
   loadLatestOutOfLine: {
     // @ts-ignore web only
     left: 'calc(50vw - 382px)',