mirror/App
1
0
Fork 0
mirror of https://github.com/Jellify-Music/App.git synced 2026-02-06 02:18:45 -06:00
Code Issues Packages Projects Releases Wiki Activity

player layout fixes

Browse Source
This commit is contained in:
Violet Caulfield
2025-01-01 15:23:36 -06:00
parent 15712789ec
commit 3f625ccc8f
2 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/Player/component.tsx
View File

@@ -30,7 +30,7 @@ export default function Player(): React.JSX.Element {
return (
<SafeAreaView>
{ nowPlaying && (
<YStack alignItems="center">
<YStack>
<HStack alignItems="center">
@@ -50,7 +50,7 @@ export default function Player(): React.JSX.Element {
/>
</HStack>
<HStack justifyContent="space-between">
<HStack>
<YStack alignItems="flex-start" justifyContent="flex-start" flex={3}>
<Text>{nowPlaying?.title ?? "Untitled Track"}</Text>

29
components/Player/mini-player.tsx
View File

@@ -76,17 +76,7 @@ export function Miniplayer({ navigation }: { navigation : NavigationHelpers<Para
</YStack>
<XStack flex={2}>
{ playbackState.state === State.Playing && (
<Icon name="pause" large onPress={() => pause()} />
)}
{ playbackState.state === State.Paused && (
<Icon name="play" large onPress={() => play()} />
)}
{ playbackState.state === State.Buffering || playbackState.state === State.Loading && (
<Spinner size="small" color={Colors.Primary}/>
)}
{ renderPlayPause(playbackState.state, play, pause) }
<Icon
large
@@ -97,4 +87,21 @@ export function Miniplayer({ navigation }: { navigation : NavigationHelpers<Para
)}
</BlurView>
)
}
function renderPlayPause(playbackState: State | undefined, play: Function, pause: Function) {
switch (playbackState) {
case (State.Playing) : {
<Icon name="pause" large onPress={() => pause()} />
}
case (State.Buffering) :
case (State.Loading) : {
<Spinner size="small" color={Colors.Primary}/>
}
default : {
<Icon name="play" large onPress={() => play()} />
}
}
}