mirror/App
1
0
Fork 0
mirror of https://github.com/Jellify-Music/App.git synced 2026-03-18 11:10:59 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix some more flatlist stuff

Browse Source
This commit is contained in:
Violet Caulfield
2025-02-18 20:40:54 -06:00
parent 2a7d2b4c42
commit 5d460eb7db
2 changed files with 66 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
components/Player/screens/index.tsx
View File

@@ -306,53 +306,52 @@ export default function PlayerScreen({
{ useMemo(() => {
return (
<XStack
alignItems="center"
justifyContent="space-evenly"
marginVertical={"$2"}
>
<Icon
color={getTokens().color.amethyst.val}
name="rewind-15"
onPress={() => {
alignItems="center"
justifyContent="space-evenly"
marginVertical={"$2"}
>
<Icon
color={getTokens().color.amethyst.val}
name="rewind-15"
onPress={() => {
setSeeking(true);
setProgressState(progressState - (15 * ProgressMultiplier));
setSeeking(false);
useSeekTo.mutate(progress!.position - 15);
}}
/>
setSeeking(true);
setProgressState(progressState - (15 * ProgressMultiplier));
setSeeking(false);
useSeekTo.mutate(progress!.position - 15);
}}
/>
<Icon
color={getTokens().color.amethyst.val}
name="skip-previous"
onPress={() => usePrevious.mutate()}
large
/>
<Icon
color={getTokens().color.amethyst.val}
name="skip-previous"
onPress={() => usePrevious.mutate()}
large
/>
{/* I really wanted a big clunky play button */}
<PlayPauseButton size={width / 5} />
{/* I really wanted a big clunky play button */}
<PlayPauseButton size={width / 5} />
<Icon
color={getTokens().color.amethyst.val}
name="skip-next"
onPress={() => useSkip.mutate(undefined)}
large
/>
<Icon
color={getTokens().color.amethyst.val}
name="skip-next"
onPress={() => useSkip.mutate(undefined)}
large
/>
<Icon
color={getTokens().color.amethyst.val}
name="fast-forward-15"
onPress={() => {
setSeeking(true);
setProgressState(progressState + (15 * ProgressMultiplier));
setSeeking(false);
useSeekTo.mutate(progress!.position + 15);
}}
/>
</XStack>
)
<Icon
color={getTokens().color.amethyst.val}
name="fast-forward-15"
onPress={() => {
setSeeking(true);
setProgressState(progressState + (15 * ProgressMultiplier));
setSeeking(false);
useSeekTo.mutate(progress!.position + 15);
}}
/>
</XStack>
)
}, [
playbackState
])}

61
components/Player/screens/queue.tsx
View File

@@ -7,7 +7,6 @@ import { useSafeAreaFrame } from "react-native-safe-area-context";
import DraggableFlatList from "react-native-draggable-flatlist";
import { trigger } from "react-native-haptic-feedback";
import { Separator } from "tamagui";
import { useMemo } from "react";
export default function Queue({ navigation }: { navigation: NativeStackNavigationProp<StackParamList>}): React.JSX.Element {
@@ -35,11 +34,8 @@ export default function Queue({ navigation }: { navigation: NativeStackNavigatio
const scrollIndex = playQueue.findIndex(queueItem => queueItem.item.Id! === nowPlaying!.item.Id!)
return (
useMemo(() => {
return (
<DraggableFlatList
contentInsetAdjustmentBehavior="automatic"
<DraggableFlatList
contentInsetAdjustmentBehavior="automatic"
data={playQueue}
dragHitSlop={{ left: -50 }} // https://github.com/computerjazz/react-native-draggable-flatlist/issues/336
extraData={nowPlaying}
@@ -59,37 +55,30 @@ export default function Queue({ navigation }: { navigation: NativeStackNavigatio
onDragEnd={({ data, from, to}) => {
useReorderQueue.mutate({ newOrder: data, from, to });
}}
renderItem={({ item: queueItem, getIndex, drag, isActive }) => {
const index = getIndex();
return (
<Track
renderItem={({ item: queueItem, getIndex, drag, isActive }) =>
<Track
queue={queue}
navigation={navigation}
track={queueItem.item}
index={getIndex()}
showArtwork
onPress={() => {
useSkip.mutate(index);
}}
onLongPress={() => {
trigger('impactLight');
drag();
}}
isNested
showRemove
onRemove={() => {
if (index)
useRemoveFromQueue.mutate(index)
}}
/>
)
}}
navigation={navigation}
track={queueItem.item}
index={getIndex()}
showArtwork
onPress={() => {
useSkip.mutate(getIndex());
}}
onLongPress={() => {
trigger('impactLight');
drag();
}}
isNested
showRemove
onRemove={() => {
if (getIndex())
useRemoveFromQueue.mutate(getIndex()!)
}}
/>
)
}, [
playQueue
])
}
/>
)
}