From 7a55ca613347680cd94add01faa5dc3f216b9bd2 Mon Sep 17 00:00:00 2001
From: dan <dan.abramov@gmail.com>
Date: Thu, 9 Nov 2023 20:15:05 +0000
Subject: Sync top/bottom bar disappearance to the scroll (#1855)

* Disable existing code that toggles shell

* Make shell mode a float

* Translate based on the gesture

* Track header and footer heights

* Add web support

* Fix types and cleanup

* Add back isScrolled logic

* Add comments
---
 src/state/shell/shell-layout.tsx | 41 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 src/state/shell/shell-layout.tsx

(limited to 'src/state/shell/shell-layout.tsx')

diff --git a/src/state/shell/shell-layout.tsx b/src/state/shell/shell-layout.tsx
new file mode 100644
index 000000000..a58ba851c
--- /dev/null
+++ b/src/state/shell/shell-layout.tsx
@@ -0,0 +1,41 @@
+import React from 'react'
+import {SharedValue, useSharedValue} from 'react-native-reanimated'
+
+type StateContext = {
+  headerHeight: SharedValue<number>
+  footerHeight: SharedValue<number>
+}
+
+const stateContext = React.createContext<StateContext>({
+  headerHeight: {
+    value: 0,
+    addListener() {},
+    removeListener() {},
+    modify() {},
+  },
+  footerHeight: {
+    value: 0,
+    addListener() {},
+    removeListener() {},
+    modify() {},
+  },
+})
+
+export function Provider({children}: React.PropsWithChildren<{}>) {
+  const headerHeight = useSharedValue(0)
+  const footerHeight = useSharedValue(0)
+
+  const value = React.useMemo(
+    () => ({
+      headerHeight,
+      footerHeight,
+    }),
+    [headerHeight, footerHeight],
+  )
+
+  return <stateContext.Provider value={value}>{children}</stateContext.Provider>
+}
+
+export function useShellLayout() {
+  return React.useContext(stateContext)
+}
-- 
cgit 1.4.1

