javier/jellyfin-audio-player
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

(1) Use absolute imports

Browse Source 
(2) Allow queue tracks to be played when touched
(3) Store refresh dates as numbers
This commit is contained in:
Lei Nelissen
2020-06-21 10:52:54 +02:00
parent 38fa01620d
commit 8309034a04
8 changed files with 117 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/screens/Player/components/Queue.tsx
View File

@@ -3,6 +3,8 @@ import useQueue from 'utility/useQueue';
import { View, Text } from 'react-native';
import styled, { css } from 'styled-components/native';
import useCurrentTrack from 'utility/useCurrentTrack';
import TouchableHandler from 'components/TouchableHandler';
import usePlayTrack from 'utility/usePlayTrack';
const QueueItem = styled.View<{ active?: boolean, alreadyPlayed?: boolean }>`
padding: 10px;
@@ -24,16 +26,19 @@ const QueueItem = styled.View<{ active?: boolean, alreadyPlayed?: boolean }>`
export default function Queue() {
const queue = useQueue();
const currentTrack = useCurrentTrack();
const currentIndex = queue?.findIndex(d => d.id === currentTrack?.id);
const currentIndex = queue.findIndex(d => d.id === currentTrack?.id);
const playTrack = usePlayTrack();
return (
<View>
<Text style={{ marginTop: 20, marginBottom: 20 }}>Queue</Text>
{queue?.map((track, i) => (
<QueueItem active={currentTrack?.id === track.id} key={i} alreadyPlayed={i < currentIndex}>
<Text style={{marginBottom: 2}}>{track.title}</Text>
<Text style={{ opacity: 0.5 }}>{track.artist}</Text>
</QueueItem>
{queue.map((track, i) => (
<TouchableHandler id={track.id} onPress={playTrack} key={track.id}>
<QueueItem active={currentTrack?.id === track.id} key={i} alreadyPlayed={i < currentIndex}>
<Text style={{marginBottom: 2}}>{track.title}</Text>
<Text style={{ opacity: 0.5 }}>{track.artist}</Text>
</QueueItem>
</TouchableHandler>
))}
</View>
);