From a2679076ae260e04231a82dbadee24f8bce8e662 Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Tue, 31 Dec 2024 15:55:59 -0600
Subject: [PATCH] add marquee for loooooooong titles and artist names

---
 components/Player/mini-player.tsx | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/components/Player/mini-player.tsx b/components/Player/mini-player.tsx
index 3e91abb4..f2621dcd 100644
--- a/components/Player/mini-player.tsx
+++ b/components/Player/mini-player.tsx
@@ -1,7 +1,6 @@
-import React, { useEffect, useMemo, useState } from "react";
+import React, {  } from "react";
 import { Spacer, Spinner, XStack, YStack } from "tamagui";
-import { State, useActiveTrack, usePlaybackState } from "react-native-track-player";
-import { JellifyTrack } from "../../types/JellifyTrack";
+import { State, usePlaybackState } from "react-native-track-player";
 import { usePlayerContext } from "../../player/provider";
 import { BottomTabNavigationEventMap } from "@react-navigation/bottom-tabs";
 import { NavigationHelpers, ParamListBase } from "@react-navigation/native";
@@ -14,6 +13,7 @@ import { ImageType } from "@jellyfin/sdk/lib/generated-client/models";
 import { getImageApi } from "@jellyfin/sdk/lib/utils/api";
 import { queryConfig } from "../../api/queries/query.config";
 import { useApiClientContext } from "../jellyfin-api-provider";
+import { Marquee } from "@animatereactnative/marquee";
 
 export function Miniplayer({ navigation }: { navigation : NavigationHelpers<ParamListBase, BottomTabNavigationEventMap> }) : React.JSX.Element {
 
@@ -52,8 +52,13 @@ export function Miniplayer({ navigation }: { navigation : NavigationHelpers<Para
 
 
                     <YStack alignContent="flex-start" flex={3}>
-                        <Text bold>{nowPlaying?.title ?? "Nothing Playing"}</Text>
-                        <Text>{nowPlaying?.artist ?? ""}</Text>
+                        <Marquee spacing={20} speed={1}>
+                            <Text bold>{nowPlaying?.title ?? "Nothing Playing"}</Text>
+                        </Marquee>
+
+                        <Marquee spacing={20} speed={1}>
+                            <Text>{nowPlaying?.artist ?? ""}</Text>
+                        </Marquee>
                     </YStack>
 
                     <Spacer />