global search gesture

src/app/(tabs)/index.tsx

@@ -10,10 +10,16 @@ import { SpectrumCurve } from '@/components/SpectrumCurve';
 import { TrackRow } from '@/components/library/TrackRow';
 import { PlaylistRow } from '@/components/library/PlaylistRow';
 import { ScanProgress } from '@/components/library/ScanProgress';
+import {
+  PullSearchGesture,
+  PullSearchScrollView,
+  useScrollTopGate,
+} from '@/components/search/PullSearchGesture';
 import { colors, fonts, radius, spacing } from '@/theme';
 import { useLibraryStore } from '@/stores/libraryStore';
 import { usePlaylistStore } from '@/stores/playlistStore';
 import { usePlayerStore } from '@/stores/playerStore';
+import { useSearchStore } from '@/stores/searchStore';
 import {
   playTracks,
   shuffleTracks,
@@ -352,9 +358,11 @@ export default function HomeScreen() {
   const playbackState = usePlayerStore((s) => s.playbackState);
   const currentTime = usePlayerStore((s) => s.currentTime);
   const duration = usePlayerStore((s) => s.duration);
+  const openQuickSearch = useSearchStore((s) => s.openQuickSearch);
 
   const [randomAlbumKey, setRandomAlbumKey] = useState<string | null>(null);
   const [randomSeed] = useState(() => Math.random());
+  const scrollTop = useScrollTopGate();
 
   const tracksByAlbum = useMemo(() => {
     const map = new Map<string, DbTrack[]>();
@@ -418,9 +426,18 @@ export default function HomeScreen() {
     }
   };
 
+  const openSearch = () => openQuickSearch();
+
   return (
     <Screen>
-      <ScrollView showsVerticalScrollIndicator={false} contentContainerStyle={styles.content}>
+      <PullSearchGesture atTop={scrollTop.atTop} onOpen={openSearch}>
+        <PullSearchScrollView
+          showsVerticalScrollIndicator={false}
+          overScrollMode="never"
+          contentContainerStyle={styles.content}
+          onScroll={scrollTop.onScroll}
+          scrollEventThrottle={scrollTop.scrollEventThrottle}
+        >
         <View style={styles.header}>
           <AstraLogo size={36} />
           <Text style={styles.wordmark}>ASTRA</Text>
@@ -548,7 +565,8 @@ export default function HomeScreen() {
             </View>
           </>
         )}
-      </ScrollView>
+        </PullSearchScrollView>
+      </PullSearchGesture>
     </Screen>
   );
 }

src/app/(tabs)/library/index.tsx

@@ -15,6 +15,11 @@ import { ScanProgress } from '@/components/library/ScanProgress';
 import { EmptyLibrary } from '@/components/library/EmptyLibrary';
 import { TrackActionsSheet } from '@/components/library/TrackActionsSheet';
 import { ActionSheet } from '@/components/sheets/ActionSheet';
+import {
+  PullSearchGesture,
+  PullSearchScrollView,
+  useScrollTopGate,
+} from '@/components/search/PullSearchGesture';
 import { colors, spacing } from '@/theme';
 import { useLibraryStore } from '@/stores/libraryStore';
 import { usePlayerStore } from '@/stores/playerStore';
@@ -43,6 +48,7 @@ export default function LibraryScreen() {
 
   const [actionTrack, setActionTrack] = useState<DbTrack | null>(null);
   const [sortSheetOpen, setSortSheetOpen] = useState(false);
+  const scrollTop = useScrollTopGate();
 
   const isEmpty = tracks.length === 0 && folders.length === 0 && !isScanning;
 
@@ -52,111 +58,137 @@ export default function LibraryScreen() {
   const playAllFrom = (index: number) => {
     void playTracks(sortedTracks.map(dbTrackToTrack), index);
   };
+  const openSearch = () => openQuickSearch();
 
   return (
     <Screen>
-      <View style={styles.headingRow}>
-        <Text variant="title" style={styles.heading}>
-          Library
-        </Text>
-        {!isEmpty ? (
-          <Pressable
-            hitSlop={8}
-            onPress={() => openQuickSearch()}
-            accessibilityRole="button"
-            accessibilityLabel="Search library"
-          >
-            <Ionicons name="search" size={22} color={colors.textSecondary} />
-          </Pressable>
-        ) : null}
-      </View>
-
-      {isEmpty ? (
-        <EmptyLibrary />
-      ) : (
-        <>
-          <View style={styles.switcher}>
-            <ViewModeSwitcher value={viewMode} onChange={setViewMode} />
-          </View>
-          <ScanProgress />
-          {scanError ? (
-            <Text variant="caption" color={colors.warning} style={styles.error} numberOfLines={2}>
-              Scan problem: {scanError}
-            </Text>
+      <PullSearchGesture atTop={scrollTop.atTop} onOpen={openSearch}>
+        <View style={styles.headingRow}>
+          <Text variant="title" style={styles.heading}>
+            Library
+          </Text>
+          {!isEmpty ? (
+            <Pressable
+              hitSlop={8}
+              onPress={() => openQuickSearch()}
+              accessibilityRole="button"
+              accessibilityLabel="Search library"
+            >
+              <Ionicons name="search" size={22} color={colors.textSecondary} />
+            </Pressable>
           ) : null}
+        </View>
 
-          {viewMode === 'albums' ? (
-            <FlashList
-              data={albums}
-              numColumns={2}
-              keyExtractor={(album) => album.identity_key}
-              showsVerticalScrollIndicator={false}
-              renderItem={({ item }) => (
-                <View style={styles.gridCell}>
-                  <AlbumGridItem
-                    album={item}
+        {isEmpty ? (
+          <EmptyLibrary />
+        ) : (
+          <>
+            <View style={styles.switcher}>
+              <ViewModeSwitcher
+                value={viewMode}
+                onChange={(mode) => {
+                  scrollTop.setScrollAtTop(true);
+                  setViewMode(mode);
+                }}
+              />
+            </View>
+            <ScanProgress />
+            {scanError ? (
+              <Text variant="caption" color={colors.warning} style={styles.error} numberOfLines={2}>
+                Scan problem: {scanError}
+              </Text>
+            ) : null}
+
+            {viewMode === 'albums' ? (
+              <FlashList
+                data={albums}
+                numColumns={2}
+                keyExtractor={(album) => album.identity_key}
+                showsVerticalScrollIndicator={false}
+                overScrollMode="never"
+                renderScrollComponent={PullSearchScrollView}
+                onScroll={scrollTop.onScroll}
+                scrollEventThrottle={scrollTop.scrollEventThrottle}
+                renderItem={({ item }) => (
+                  <View style={styles.gridCell}>
+                    <AlbumGridItem
+                      album={item}
+                      onPress={() =>
+                        router.push({
+                          pathname: '/library/album/[key]',
+                          params: { key: item.identity_key },
+                        })
+                      }
+                    />
+                  </View>
+                )}
+              />
+            ) : null}
+
+            {viewMode === 'artists' ? (
+              <FlashList
+                data={artists}
+                keyExtractor={(artist) => artist.artist}
+                showsVerticalScrollIndicator={false}
+                overScrollMode="never"
+                renderScrollComponent={PullSearchScrollView}
+                onScroll={scrollTop.onScroll}
+                scrollEventThrottle={scrollTop.scrollEventThrottle}
+                renderItem={({ item }) => (
+                  <ArtistRow
+                    artist={item}
                     onPress={() =>
                       router.push({
-                        pathname: '/library/album/[key]',
-                        params: { key: item.identity_key },
+                        pathname: '/library/artist/[name]',
+                        params: { name: item.artist },
                       })
                     }
                   />
-                </View>
-              )}
-            />
-          ) : null}
-
-          {viewMode === 'artists' ? (
-            <FlashList
-              data={artists}
-              keyExtractor={(artist) => artist.artist}
-              showsVerticalScrollIndicator={false}
-              renderItem={({ item }) => (
-                <ArtistRow
-                  artist={item}
-                  onPress={() =>
-                    router.push({
-                      pathname: '/library/artist/[name]',
-                      params: { name: item.artist },
-                    })
-                  }
-                />
-              )}
-            />
-          ) : null}
-
-          {viewMode === 'tracks' ? (
-            <>
-              <Pressable
-                style={styles.sortTrigger}
-                onPress={() => setSortSheetOpen(true)}
-                accessibilityRole="button"
-              >
-                <Ionicons name="swap-vertical" size={14} color={colors.textSecondary} />
-                <Text variant="label">{TRACK_SORT_LABELS[trackSort]}</Text>
-              </Pressable>
-              <FlashList
-                data={sortedTracks}
-                keyExtractor={(track) => String(track.id)}
-                showsVerticalScrollIndicator={false}
-                renderItem={({ item, index }) => (
-                  <TrackRow
-                    track={item}
-                    active={item.path === currentPath}
-                    onPress={() => playAllFrom(index)}
-                    onLongPress={() => setActionTrack(item)}
-                  />
                 )}
               />
-            </>
-          ) : null}
+            ) : null}
 
-          {viewMode === 'playlists' ? <PlaylistsView /> : null}
+            {viewMode === 'tracks' ? (
+              <>
+                <Pressable
+                  style={styles.sortTrigger}
+                  onPress={() => setSortSheetOpen(true)}
+                  accessibilityRole="button"
+                >
+                  <Ionicons name="swap-vertical" size={14} color={colors.textSecondary} />
+                  <Text variant="label">{TRACK_SORT_LABELS[trackSort]}</Text>
+                </Pressable>
+                <FlashList
+                  data={sortedTracks}
+                  keyExtractor={(track) => String(track.id)}
+                  showsVerticalScrollIndicator={false}
+                  overScrollMode="never"
+                  renderScrollComponent={PullSearchScrollView}
+                  onScroll={scrollTop.onScroll}
+                  scrollEventThrottle={scrollTop.scrollEventThrottle}
+                  renderItem={({ item, index }) => (
+                    <TrackRow
+                      track={item}
+                      active={item.path === currentPath}
+                      onPress={() => playAllFrom(index)}
+                      onLongPress={() => setActionTrack(item)}
+                    />
+                  )}
+                />
+              </>
+            ) : null}
 
-          {viewMode === 'folders' ? <FoldersView /> : null}
-        </>
-      )}
+            {viewMode === 'playlists' ? (
+              <PlaylistsView
+                onScroll={scrollTop.onScroll}
+                scrollEventThrottle={scrollTop.scrollEventThrottle}
+              />
+            ) : null}
+
+            {viewMode === 'folders' ? <FoldersView /> : null}
+          </>
+        )}
+      </PullSearchGesture>
 
       <TrackActionsSheet track={actionTrack} onClose={() => setActionTrack(null)} />
       <ActionSheet