Add 'apps/mobile/' from commit '5fa30f365f21531094cd4d2045042bb4f1370ac3'

git-subtree-dir: apps/mobile git-subtree-mainline: 86f8987dff git-subtree-split: 5fa30f365f
2026-08-16 21:42:59 -04:00
parent 86f8987dff 5fa30f365f
commit d057ba208d
222 changed files with 23436 additions and 0 deletions
@@ -0,0 +1,65 @@
+import { useScrollToTop } from "expo-router";
+import { useRef, type ReactNode } from "react";
+import { Platform, ScrollView, type ScrollViewProps, StyleSheet, View } from "react-native";
+
+import { tabLayout } from "@/lib/tab-layout";
+import { useTabScreenScrollPadding } from "@/lib/tab-bar-insets";
+
+type TabScrollViewProps = ScrollViewProps & {
+  /** Rendered at the top of scroll content (scrolls with the page). */
+  header?: ReactNode;
+  children: ReactNode;
+};
+
+/**
+ * Tab screen scroll view. Top chrome (logo / account) is pinned in TabPage;
+ * the page header and body scroll together here.
+ */
+export function TabScrollView({
+  header,
+  children,
+  contentContainerStyle,
+  refreshControl,
+  style,
+  bounces,
+  alwaysBounceVertical,
+  ...props
+}: TabScrollViewProps) {
+  const scrollRef = useRef<ScrollView>(null);
+  const bottomPadding = useTabScreenScrollPadding();
+  const canRefresh = Boolean(refreshControl);
+
+  useScrollToTop(scrollRef);
+
+  return (
+    <ScrollView
+      ref={scrollRef}
+      style={[styles.scroll, style]}
+      contentContainerStyle={[
+        tabLayout.scrollContent,
+        { paddingBottom: bottomPadding },
+        contentContainerStyle,
+      ]}
+      contentInsetAdjustmentBehavior={Platform.OS === "ios" ? "never" : undefined}
+      automaticallyAdjustContentInsets={false}
+      automaticallyAdjustKeyboardInsets={false}
+      automaticallyAdjustsScrollIndicatorInsets={false}
+      bounces={bounces ?? canRefresh}
+      alwaysBounceVertical={alwaysBounceVertical ?? canRefresh}
+      refreshControl={refreshControl}
+      scrollIndicatorInsets={{ bottom: bottomPadding }}
+      {...props}
+    >
+      {header}
+      <View style={tabLayout.scrollBody}>{children}</View>
+    </ScrollView>
+  );
+}
+
+const styles = StyleSheet.create({
+  scroll: {
+    flex: 1,
+    minHeight: 0,
+    backgroundColor: "transparent",
+  },
+});