From 95b98f22fefbe0cfbd59aa8d74627de1fd33eea4 Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Thu, 27 Mar 2025 10:40:19 -0500
Subject: [PATCH] smol fixes, player optimizations

---
 components/Player/helpers/controls.tsx | 64 ++++++++++++++++++++++++++
 components/Player/helpers/scrubber.tsx | 46 +-----------------
 components/Tracks/screen.tsx           |  2 +-
 3 files changed, 66 insertions(+), 46 deletions(-)
 create mode 100644 components/Player/helpers/controls.tsx

diff --git a/components/Player/helpers/controls.tsx b/components/Player/helpers/controls.tsx
new file mode 100644
index 00000000..4d3618ea
--- /dev/null
+++ b/components/Player/helpers/controls.tsx
@@ -0,0 +1,64 @@
+import React from "react";
+import { XStack, getToken } from "tamagui";
+import PlayPauseButton from "./buttons";
+import Icon from "../../../components/Global/helpers/icon";
+import { getProgress, seekBy, skipToNext } from "react-native-track-player/lib/src/trackPlayer";
+import { usePlayerContext } from "@/player/provider";
+import { useSafeAreaFrame } from "react-native-safe-area-context";
+
+export default function Controls(): React.JSX.Element {
+
+    const { width } = useSafeAreaFrame();
+    
+    const { 
+        usePrevious,
+        useSeekTo
+    } = usePlayerContext();
+
+    return (
+
+    <XStack 
+        alignItems="center" 
+        justifyContent="space-evenly" 
+        marginVertical={"$2"}
+        >
+        <Icon
+            color={getToken("$color.amethyst")}
+            name="rewind-15"
+            onPress={() => seekBy(-15)}
+        />
+        
+        <Icon
+            color={getToken("$color.amethyst")}
+            name="skip-previous"
+            onPress={async () => {
+
+                const progress = await getProgress()
+                if (progress.position < 3)
+                    usePrevious.mutate()
+                else {
+                    useSeekTo.mutate(0);
+                }
+            }}
+            large
+        />
+
+        {/* I really wanted a big clunky play button */}
+        <PlayPauseButton size={width / 5} />
+
+        <Icon
+            color={getToken("$color.amethyst")}
+            name="skip-next" 
+            onPress={() => skipToNext()}
+            large
+        />    
+
+        <Icon
+            color={getToken("$color.amethyst")}
+            name="fast-forward-15"
+            onPress={() => seekBy(15)}  
+        />              
+    </XStack>
+
+    )
+}
\ No newline at end of file
diff --git a/components/Player/helpers/scrubber.tsx b/components/Player/helpers/scrubber.tsx
index 6f68b31f..942ebdbf 100644
--- a/components/Player/helpers/scrubber.tsx
+++ b/components/Player/helpers/scrubber.tsx
@@ -56,6 +56,7 @@ export default function Scrubber() : React.JSX.Element {
 
     return (
         <YStack>
+
             <GestureDetector gesture={scrubGesture}>
                 <HorizontalSlider 
                     value={position}
@@ -110,51 +111,6 @@ export default function Scrubber() : React.JSX.Element {
                     </RunTimeSeconds>
                 </YStack>
             </XStack>
-
-            <XStack 
-                alignItems="center" 
-                justifyContent="space-evenly" 
-                marginVertical={"$2"}
-                >
-                <Icon
-                    color={getToken("$color.amethyst")}
-                    name="rewind-15"
-                    onPress={() => {
-                        useSeekTo.mutate(position / ProgressMultiplier - 15);
-                    }}
-                />
-                
-                <Icon
-                    color={getToken("$color.amethyst")}
-                    name="skip-previous"
-                    onPress={() => {
-                        if (position / ProgressMultiplier < 3)
-                            usePrevious.mutate()
-                        else {
-                            useSeekTo.mutate(0);
-                        }
-                    }}
-                    large
-                />
-
-                {/* I really wanted a big clunky play button */}
-                <PlayPauseButton size={width / 5} />
-
-                <Icon
-                    color={getToken("$color.amethyst")}
-                    name="skip-next" 
-                    onPress={() => useSkip.mutate(undefined)}
-                    large
-                />    
-
-                <Icon
-                    color={getToken("$color.amethyst")}
-                    name="fast-forward-15"
-                    onPress={() => { 
-                        useSeekTo.mutate(position / ProgressMultiplier + 15);
-                    }}  
-                />              
-            </XStack>
         </YStack>
     )
 }
\ No newline at end of file
diff --git a/components/Tracks/screen.tsx b/components/Tracks/screen.tsx
index c8828754..99bab4d9 100644
--- a/components/Tracks/screen.tsx
+++ b/components/Tracks/screen.tsx
@@ -44,7 +44,7 @@ export default function TracksScreen({
                     showArtwork
                     track={track}
                     tracklist={tracks?.slice(index, index + 50) ?? []}
-                    queue="Favorite Tracks"
+                    queue={route.params.query === QueryKeys.RecentlyPlayed ? "Recently Played" : "Favorite Tracks"}
                 />
             }
         />