hide bottom bar border for cleaner look

src/lib/hooks/useHideBottomBarBorder.tsx

@@ -0,0 +1,50 @@
+import {createContext, useCallback, useContext, useState} from 'react'
+import {useFocusEffect} from '@react-navigation/native'
+
+type HideBottomBarBorderSetter = () => () => void
+
+const HideBottomBarBorderContext = createContext<boolean>(false)
+const HideBottomBarBorderSetterContext =
+  createContext<HideBottomBarBorderSetter | null>(null)
+
+export function useHideBottomBarBorderSetter() {
+  const hideBottomBarBorder = useContext(HideBottomBarBorderSetterContext)
+  if (!hideBottomBarBorder) {
+    throw new Error(
+      'useHideBottomBarBorderSetter must be used within a HideBottomBarBorderProvider',
+    )
+  }
+  return hideBottomBarBorder
+}
+
+export function useHideBottomBarBorderForScreen() {
+  const hideBorder = useHideBottomBarBorderSetter()
+
+  useFocusEffect(
+    useCallback(() => {
+      const cleanup = hideBorder()
+      return () => cleanup()
+    }, [hideBorder]),
+  )
+}
+
+export function useHideBottomBarBorder() {
+  return useContext(HideBottomBarBorderContext)
+}
+
+export function Provider({children}: {children: React.ReactNode}) {
+  const [refCount, setRefCount] = useState(0)
+
+  const setter = useCallback(() => {
+    setRefCount(prev => prev + 1)
+    return () => setRefCount(prev => prev - 1)
+  }, [])
+
+  return (
+    <HideBottomBarBorderSetterContext.Provider value={setter}>
+      <HideBottomBarBorderContext.Provider value={refCount > 0}>
+        {children}
+      </HideBottomBarBorderContext.Provider>
+    </HideBottomBarBorderSetterContext.Provider>
+  )
+}