mirror of
https://github.com/Jellify-Music/App.git
synced 2026-04-23 19:39:35 -05:00
even slicker?
This commit is contained in:
@@ -7,9 +7,8 @@ import RecentlyPlayed from "./helpers/recently-played";
|
||||
import { useHomeContext } from "./provider";
|
||||
import { H3 } from "../Global/helpers/text";
|
||||
import Client from "../../api/client";
|
||||
import { useCallback, useState } from "react";
|
||||
import { NativeStackNavigationProp } from "@react-navigation/native-stack";
|
||||
import { useFocusEffect } from "@react-navigation/native";
|
||||
import { useFocusEffect, useIsFocused } from "@react-navigation/native";
|
||||
import { Freeze } from "react-freeze";
|
||||
|
||||
export function ProvidedHome({
|
||||
@@ -18,23 +17,10 @@ export function ProvidedHome({
|
||||
navigation: NativeStackNavigationProp<StackParamList>
|
||||
}): React.JSX.Element {
|
||||
|
||||
const [freeze, setFreeze] = useState<boolean>(false);
|
||||
const freeze = !useIsFocused()
|
||||
|
||||
const { refreshing: refetching, onRefresh } = useHomeContext()
|
||||
|
||||
useFocusEffect(
|
||||
useCallback(() => {
|
||||
|
||||
console.debug("Mounted home");
|
||||
setFreeze(false)
|
||||
|
||||
return () => {
|
||||
console.debug("Home unmounted");
|
||||
setFreeze(true);
|
||||
}
|
||||
}, [])
|
||||
)
|
||||
|
||||
return (
|
||||
<Freeze freeze={freeze}>
|
||||
<ScrollView
|
||||
|
||||
@@ -17,6 +17,8 @@ import { toUpper } from "lodash";
|
||||
import { trigger } from "react-native-haptic-feedback";
|
||||
import { Gesture, GestureDetector } from "react-native-gesture-handler";
|
||||
import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
|
||||
import { useIsFocused } from "@react-navigation/native";
|
||||
import { Freeze } from "react-freeze";
|
||||
|
||||
const scrubGesture = Gesture.Pan();
|
||||
|
||||
@@ -51,6 +53,8 @@ export default function PlayerScreen({
|
||||
: 0
|
||||
);
|
||||
|
||||
const freeze = !useIsFocused()
|
||||
|
||||
const { width } = useSafeAreaFrame();
|
||||
|
||||
useEffect(() => {
|
||||
@@ -66,15 +70,17 @@ export default function PlayerScreen({
|
||||
]);
|
||||
|
||||
return (
|
||||
<Freeze freeze={freeze}>
|
||||
|
||||
<SafeAreaView edges={["right", "left"]}>
|
||||
{ nowPlaying && (
|
||||
<>
|
||||
<>
|
||||
<YStack>
|
||||
|
||||
<XStack
|
||||
marginBottom={"$2"}
|
||||
marginHorizontal={"$2"}
|
||||
>
|
||||
>
|
||||
|
||||
<YStack
|
||||
alignContent="flex-end"
|
||||
@@ -87,7 +93,7 @@ export default function PlayerScreen({
|
||||
navigation.goBack();
|
||||
}}
|
||||
small
|
||||
/>
|
||||
/>
|
||||
</YStack>
|
||||
|
||||
<YStack
|
||||
@@ -186,7 +192,7 @@ export default function PlayerScreen({
|
||||
justifyContent="flex-end"
|
||||
alignItems="center"
|
||||
flex={2}
|
||||
>
|
||||
>
|
||||
{/* Buttons for favorites, song menu go here */}
|
||||
|
||||
<Icon
|
||||
@@ -204,7 +210,7 @@ export default function PlayerScreen({
|
||||
<FavoriteButton
|
||||
item={nowPlaying!.item}
|
||||
onToggle={() => setNowPlayingIsFavorite(!nowPlayingIsFavorite)}
|
||||
/>
|
||||
/>
|
||||
</XStack>
|
||||
</XStack>
|
||||
|
||||
@@ -230,7 +236,7 @@ export default function PlayerScreen({
|
||||
navigation.setOptions({
|
||||
gestureEnabled: true
|
||||
});
|
||||
|
||||
|
||||
useSeekTo.mutate(Math.floor(progressState / ProgressMultiplier));
|
||||
},
|
||||
onSlideStart: () => {
|
||||
@@ -243,11 +249,11 @@ export default function PlayerScreen({
|
||||
},
|
||||
onSlideMove: (event, value) => {
|
||||
setSeeking(true);
|
||||
|
||||
|
||||
navigation.setOptions({
|
||||
gestureEnabled: false
|
||||
});
|
||||
|
||||
|
||||
setProgressState(value);
|
||||
},
|
||||
onSlideEnd: (event, value) => {
|
||||
@@ -260,7 +266,7 @@ export default function PlayerScreen({
|
||||
useSeekTo.mutate(Math.floor(value / ProgressMultiplier));
|
||||
}
|
||||
}}
|
||||
/>
|
||||
/>
|
||||
</GestureDetector>
|
||||
)}, [
|
||||
progressState
|
||||
@@ -298,25 +304,25 @@ export default function PlayerScreen({
|
||||
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);
|
||||
}}
|
||||
/>
|
||||
/>
|
||||
|
||||
<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} />
|
||||
@@ -326,7 +332,7 @@ export default function PlayerScreen({
|
||||
name="skip-next"
|
||||
onPress={() => useSkip.mutate(undefined)}
|
||||
large
|
||||
/>
|
||||
/>
|
||||
|
||||
<Icon
|
||||
color={getTokens().color.amethyst.val}
|
||||
@@ -337,7 +343,7 @@ export default function PlayerScreen({
|
||||
setSeeking(false);
|
||||
useSeekTo.mutate(progress!.position + 15);
|
||||
}}
|
||||
/>
|
||||
/>
|
||||
</XStack>
|
||||
|
||||
<XStack justifyContent="space-evenly" marginVertical={"$7"}>
|
||||
@@ -357,5 +363,6 @@ export default function PlayerScreen({
|
||||
</>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
</Freeze>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user