feat: show artist in playlist view
This commit is contained in:
@@ -39,6 +39,7 @@ const Playlist: React.FC = () => {
|
|||||||
shuffleButtonText={t('shuffle-playlist')}
|
shuffleButtonText={t('shuffle-playlist')}
|
||||||
downloadButtonText={t('download-playlist')}
|
downloadButtonText={t('download-playlist')}
|
||||||
deleteButtonText={t('delete-playlist')}
|
deleteButtonText={t('delete-playlist')}
|
||||||
|
itemDisplayStyle='playlist'
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -47,6 +47,7 @@ const TrackContainer = styled.View<{ isPlaying: boolean }>`
|
|||||||
padding: 12px 4px;
|
padding: 12px 4px;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
${props => props.isPlaying && css`
|
${props => props.isPlaying && css`
|
||||||
margin: 0 -12px;
|
margin: 0 -12px;
|
||||||
@@ -65,6 +66,7 @@ interface TrackListViewProps {
|
|||||||
downloadButtonText: string;
|
downloadButtonText: string;
|
||||||
deleteButtonText: string;
|
deleteButtonText: string;
|
||||||
listNumberingStyle?: 'album' | 'index';
|
listNumberingStyle?: 'album' | 'index';
|
||||||
|
itemDisplayStyle?: 'album' | 'playlist';
|
||||||
}
|
}
|
||||||
|
|
||||||
const TrackListView: React.FC<TrackListViewProps> = ({
|
const TrackListView: React.FC<TrackListViewProps> = ({
|
||||||
@@ -78,6 +80,7 @@ const TrackListView: React.FC<TrackListViewProps> = ({
|
|||||||
downloadButtonText,
|
downloadButtonText,
|
||||||
deleteButtonText,
|
deleteButtonText,
|
||||||
listNumberingStyle = 'album',
|
listNumberingStyle = 'album',
|
||||||
|
itemDisplayStyle = 'album',
|
||||||
}) => {
|
}) => {
|
||||||
const defaultStyles = useDefaultStyles();
|
const defaultStyles = useDefaultStyles();
|
||||||
const navigatorPadding = useNavigatorPadding();
|
const navigatorPadding = useNavigatorPadding();
|
||||||
@@ -154,16 +157,31 @@ const TrackListView: React.FC<TrackListViewProps> = ({
|
|||||||
? i + 1
|
? i + 1
|
||||||
: tracks[trackId]?.IndexNumber}
|
: tracks[trackId]?.IndexNumber}
|
||||||
</Text>
|
</Text>
|
||||||
<Text
|
<View>
|
||||||
style={{
|
<Text
|
||||||
...currentTrack?.backendId === trackId && styles.activeText,
|
style={{
|
||||||
flexShrink: 1,
|
...currentTrack?.backendId === trackId && styles.activeText,
|
||||||
marginRight: 4,
|
flexShrink: 1,
|
||||||
}}
|
marginRight: 4,
|
||||||
numberOfLines={1}
|
}}
|
||||||
>
|
numberOfLines={1}
|
||||||
{tracks[trackId]?.Name}
|
>
|
||||||
</Text>
|
{tracks[trackId]?.Name}
|
||||||
|
</Text>
|
||||||
|
{itemDisplayStyle === 'playlist' && (
|
||||||
|
<Text
|
||||||
|
style={{
|
||||||
|
...currentTrack?.backendId === trackId && styles.activeText,
|
||||||
|
flexShrink: 1,
|
||||||
|
marginRight: 4,
|
||||||
|
opacity:currentTrack?.backendId === trackId ? 0.5 : 0.25,
|
||||||
|
}}
|
||||||
|
numberOfLines={1}
|
||||||
|
>
|
||||||
|
{tracks[trackId]?.Artists.join(', ')}
|
||||||
|
</Text>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
<View style={{ marginLeft: 'auto', flexDirection: 'row' }}>
|
<View style={{ marginLeft: 'auto', flexDirection: 'row' }}>
|
||||||
<Text
|
<Text
|
||||||
style={[
|
style={[
|
||||||
|
|||||||
Reference in New Issue
Block a user