mirror of
https://github.com/anultravioletaurora/Jellify.git
synced 2026-05-02 03:29:27 -05:00
TIL about flatlists
This commit is contained in:
@@ -23,19 +23,18 @@ export default function Playlists({ navigation }: { navigation: NativeStackNavig
|
||||
</XStack>
|
||||
<FlatList horizontal
|
||||
data={playlists}
|
||||
renderItem={({ item: playlist }) => {
|
||||
return (
|
||||
<ItemCard
|
||||
item={playlist}
|
||||
squared
|
||||
caption={playlist.Name ?? "Untitled Playlist"}
|
||||
onPress={() => {
|
||||
navigation.navigate('Playlist', {
|
||||
playlist
|
||||
})
|
||||
}} />
|
||||
)
|
||||
}}
|
||||
renderItem={({ item: playlist }) =>
|
||||
<ItemCard
|
||||
item={playlist}
|
||||
squared
|
||||
caption={playlist.Name ?? "Untitled Playlist"}
|
||||
onPress={() => {
|
||||
navigation.navigate('Playlist', {
|
||||
playlist
|
||||
})
|
||||
}}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
)
|
||||
|
||||
@@ -16,36 +16,27 @@ export default function RecentArtists({ navigation }: { navigation: NativeStackN
|
||||
<View>
|
||||
<H2 marginLeft={"$2"}>Recent Artists</H2>
|
||||
|
||||
{ useMemo(() => {
|
||||
return (
|
||||
|
||||
<HorizontalCardList
|
||||
<HorizontalCardList
|
||||
items={recentArtists}
|
||||
onSeeMore={() => {
|
||||
navigation.navigate("Artists", {
|
||||
query: QueryKeys.RecentlyPlayedArtists
|
||||
})
|
||||
}}
|
||||
renderItem={({ item: recentArtist}) => {
|
||||
return (
|
||||
<ItemCard
|
||||
item={recentArtist}
|
||||
caption={recentArtist.Name ?? "Unknown Artist"}
|
||||
onPress={() => {
|
||||
navigation.navigate('Artist',
|
||||
{
|
||||
artist: recentArtist,
|
||||
}
|
||||
)}
|
||||
}>
|
||||
</ItemCard>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
renderItem={({ item: recentArtist}) =>
|
||||
<ItemCard
|
||||
item={recentArtist}
|
||||
caption={recentArtist.Name ?? "Unknown Artist"}
|
||||
onPress={() => {
|
||||
navigation.navigate('Artist',
|
||||
{
|
||||
artist: recentArtist,
|
||||
}
|
||||
)}
|
||||
}>
|
||||
</ItemCard>
|
||||
}/>
|
||||
)
|
||||
}, [
|
||||
recentArtists
|
||||
])}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -24,49 +24,40 @@ export default function RecentlyPlayed({
|
||||
<View>
|
||||
<H2 marginLeft={"$2"}>Play it again</H2>
|
||||
|
||||
{ useMemo(() => {
|
||||
return (
|
||||
|
||||
<HorizontalCardList
|
||||
squared
|
||||
<HorizontalCardList
|
||||
squared
|
||||
items={recentTracks}
|
||||
onSeeMore={() => {
|
||||
navigation.navigate("Tracks", {
|
||||
query: QueryKeys.RecentlyPlayed
|
||||
})
|
||||
}}
|
||||
renderItem={({ index, item: recentlyPlayedTrack }) => {
|
||||
return (
|
||||
<ItemCard
|
||||
caption={recentlyPlayedTrack.Name}
|
||||
subCaption={`${recentlyPlayedTrack.Artists?.join(", ")}`}
|
||||
squared
|
||||
width={150}
|
||||
item={recentlyPlayedTrack}
|
||||
onPress={() => {
|
||||
usePlayNewQueue.mutate({
|
||||
track: recentlyPlayedTrack,
|
||||
index: index,
|
||||
tracklist: recentTracks ?? [recentlyPlayedTrack],
|
||||
queue: "Recently Played",
|
||||
queuingType: QueuingType.FromSelection
|
||||
});
|
||||
}}
|
||||
onLongPress={() => {
|
||||
trigger("impactMedium");
|
||||
navigation.navigate("Details", {
|
||||
item: recentlyPlayedTrack,
|
||||
isNested: false
|
||||
})
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}, [
|
||||
recentTracks
|
||||
])}
|
||||
renderItem={({ index, item: recentlyPlayedTrack }) =>
|
||||
<ItemCard
|
||||
caption={recentlyPlayedTrack.Name}
|
||||
subCaption={`${recentlyPlayedTrack.Artists?.join(", ")}`}
|
||||
squared
|
||||
width={150}
|
||||
item={recentlyPlayedTrack}
|
||||
onPress={() => {
|
||||
usePlayNewQueue.mutate({
|
||||
track: recentlyPlayedTrack,
|
||||
index: index,
|
||||
tracklist: recentTracks ?? [recentlyPlayedTrack],
|
||||
queue: "Recently Played",
|
||||
queuingType: QueuingType.FromSelection
|
||||
});
|
||||
}}
|
||||
onLongPress={() => {
|
||||
trigger("impactMedium");
|
||||
navigation.navigate("Details", {
|
||||
item: recentlyPlayedTrack,
|
||||
isNested: false
|
||||
})
|
||||
}}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user