even slicker?

This commit is contained in:
Violet Caulfield
2025-02-17 17:05:40 -06:00
parent e81964daec
commit b30a5e1484
2 changed files with 24 additions and 31 deletions
+2 -16
View File
@@ -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
+22 -15
View File
@@ -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>
);
}