1 files changed, 17 insertions, 5 deletions
diff --git a/src/view/shell/BottomBar.tsx b/src/view/shell/BottomBar.tsx
index c59d8c675..1cbf2de86 100644
--- a/src/view/shell/BottomBar.tsx
+++ b/src/view/shell/BottomBar.tsx
@@ -34,16 +34,24 @@ export const BottomBar = observer(({navigation}: BottomTabBarProps) => {
   const minimalShellInterp = useAnimatedValue(0)
   const safeAreaInsets = useSafeAreaInsets()
   const {track} = useAnalytics()
-  const {isAtHome, isAtSearch, isAtNotifications} = useNavigationState(
-    state => {
-      return {
+  const {isAtHome, isAtSearch, isAtNotifications, noBorder} =
+    useNavigationState(state => {
+      const res = {
         isAtHome: getTabState(state, 'Home') !== TabState.Outside,
         isAtSearch: getTabState(state, 'Search') !== TabState.Outside,
         isAtNotifications:
           getTabState(state, 'Notifications') !== TabState.Outside,
+        noBorder: getTabState(state, 'Home') === TabState.InsideAtRoot,
       }
-    },
-  )
+      if (!res.isAtHome && !res.isAtNotifications && !res.isAtSearch) {
+        // HACK for some reason useNavigationState will give us pre-hydration results
+        //      and not update after, so we force isAtHome if all came back false
+        //      -prf
+        res.isAtHome = true
+        res.noBorder = true
+      }
+      return res
+    })
 
   React.useEffect(() => {
     if (store.shell.minimalShellMode) {
@@ -99,6 +107,7 @@ export const BottomBar = observer(({navigation}: BottomTabBarProps) => {
     <Animated.View
       style={[
         styles.bottomBar,
+        noBorder && styles.noBorder,
         pal.view,
         pal.border,
         {paddingBottom: clamp(safeAreaInsets.bottom, 15, 30)},
@@ -213,6 +222,9 @@ const styles = StyleSheet.create({
     paddingLeft: 5,
     paddingRight: 10,
   },
+  noBorder: {
+    borderTopWidth: 0,
+  },
   ctrl: {
     flex: 1,
     paddingTop: 13,