smol fixes, player optimizations

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>
+
+    )
+}

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>
     )
 }

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"}
                 />
             }
         />