chore

2026-03-12 12:26:17 +00:00 · 2024-12-31 13:32:51 +01:00
parent 48422fa93e
commit c753e33f38
13 changed files with 403 additions and 317 deletions
--- a/components/ItemContent.tsx
+++ b/components/ItemContent.tsx
@@ -68,7 +68,6 @@ export const ItemContent: React.FC<{ item: BaseItemDto }> = React.memo(

    // Needs to automatically change the selected to the default values for default indexes.
    useEffect(() => {
-      console.log(defaultAudioIndex, defaultSubtitleIndex);
      setSelectedOptions(() => ({
        bitrate: defaultBitrate,
        mediaSource: defaultMediaSource,
@@ -220,7 +219,6 @@ export const ItemContent: React.FC<{ item: BaseItemDto }> = React.memo(
                    className="mr-1"
                    source={selectedOptions.mediaSource}
                    onChange={(val) => {
-                      console.log(val);
                      setSelectedOptions(
                        (prev) =>
                          prev && {
--- a/components/series/JellyseerrSeasons.tsx
+++ b/components/series/JellyseerrSeasons.tsx
@@ -1,33 +1,37 @@
-import {Text} from "@/components/common/Text";
-import React, {useCallback, useMemo, useState} from "react";
-import {Alert, TouchableOpacity, View} from "react-native";
-import {TvDetails} from "@/utils/jellyseerr/server/models/Tv";
-import {FlashList} from "@shopify/flash-list";
-import {orderBy} from "lodash";
-import {Tags} from "@/components/GenreTags";
+import { Text } from "@/components/common/Text";
+import React, { useCallback, useMemo, useState } from "react";
+import { Alert, TouchableOpacity, View } from "react-native";
+import { TvDetails } from "@/utils/jellyseerr/server/models/Tv";
+import { FlashList } from "@shopify/flash-list";
+import { orderBy } from "lodash";
+import { Tags } from "@/components/GenreTags";
 import JellyseerrIconStatus from "@/components/icons/JellyseerrIconStatus";
 import Season from "@/utils/jellyseerr/server/entity/Season";
-import {MediaStatus, MediaType} from "@/utils/jellyseerr/server/constants/media";
-import {Ionicons} from "@expo/vector-icons";
-import {RoundButton} from "@/components/RoundButton";
-import {useJellyseerr} from "@/hooks/useJellyseerr";
-import {TvResult} from "@/utils/jellyseerr/server/models/Search";
-import {useQuery} from "@tanstack/react-query";
-import {HorizontalScroll} from "@/components/common/HorrizontalScroll";
-import {Image} from "expo-image";
+import {
+  MediaStatus,
+  MediaType,
+} from "@/utils/jellyseerr/server/constants/media";
+import { Ionicons } from "@expo/vector-icons";
+import { RoundButton } from "@/components/RoundButton";
+import { useJellyseerr } from "@/hooks/useJellyseerr";
+import { TvResult } from "@/utils/jellyseerr/server/models/Search";
+import { useQuery } from "@tanstack/react-query";
+import { HorizontalScroll } from "@/components/common/HorrizontalScroll";
+import { Image } from "expo-image";
 import MediaRequest from "@/utils/jellyseerr/server/entity/MediaRequest";
+import { Loader } from "../Loader";

-const JellyseerrSeasonEpisodes: React.FC<{details: TvDetails, seasonNumber: number}> = ({
-  details,
-  seasonNumber
-}) => {
-  const {jellyseerrApi} = useJellyseerr();
+const JellyseerrSeasonEpisodes: React.FC<{
+  details: TvDetails;
+  seasonNumber: number;
+}> = ({ details, seasonNumber }) => {
+  const { jellyseerrApi } = useJellyseerr();

-  const {data: seasonWithEpisodes, isLoading} = useQuery({
+  const { data: seasonWithEpisodes, isLoading } = useQuery({
    queryKey: ["jellyseerr", details.id, "season", seasonNumber],
    queryFn: async () => jellyseerrApi?.tvSeason(details.id, seasonNumber),
-    enabled: details.seasons.filter(s => s.seasonNumber !== 0).length > 0
-  })
+    enabled: details.seasons.filter((s) => s.seasonNumber !== 0).length > 0,
+  });

  return (
    <HorizontalScroll
@@ -37,86 +41,102 @@ const JellyseerrSeasonEpisodes: React.FC<{details: TvDetails, seasonNumber: numb
      estimatedItemSize={50}
      data={seasonWithEpisodes?.episodes}
      keyExtractor={(item) => item.id}
-      ItemSeparatorComponent={() => <View className="w-2"/>}
      renderItem={(item, index) => (
-        <View className="flex flex-col mt-2 w-44">
-          {item.stillPath && (
-            <View
-              className="relative aspect-video rounded-lg overflow-hidden border border-neutral-800"
-            >
-              <Image
-                key={item.id}
-                id={item.id}
-                source={{
-                  uri: jellyseerrApi?.tvStillImageProxy(item.stillPath),
-                }}
-                cachePolicy={"memory-disk"}
-                contentFit="cover"
-                className="w-full h-full"
-              />
-            </View>
-          )}
-            <View className="shrink">
-              <Text numberOfLines={2} className="">
-                {item?.name}
-              </Text>
-              <Text numberOfLines={1} className="text-xs text-neutral-500">
-                {`S${item?.seasonNumber}:E${item?.episodeNumber}`}
-              </Text>
-            </View>
-
-          <Text numberOfLines={3} className="text-xs text-neutral-500 shrink">
-            {item?.overview}
-          </Text>
-        </View>
+        <RenderItem key={index} item={item} index={index} />
      )}
    />
-  )
-}
+  );
+};
+
+const RenderItem = ({ item, index }: any) => {
+  const { jellyseerrApi } = useJellyseerr();
+  const [imageError, setImageError] = useState(false);
+
+  return (
+    <View className="flex flex-col w-44 mt-2">
+      <View className="relative aspect-video rounded-lg overflow-hidden border border-neutral-800">
+        {!imageError ? (
+          <Image
+            key={item.id}
+            id={item.id}
+            source={{
+              uri: jellyseerrApi?.tvStillImageProxy(item.stillPath),
+            }}
+            cachePolicy={"memory-disk"}
+            contentFit="cover"
+            className="w-full h-full"
+            onError={(e) => {
+              setImageError(true);
+            }}
+          />
+        ) : (
+          <View className="flex flex-col w-full h-full items-center justify-center border border-neutral-800 bg-neutral-900">
+            <Ionicons
+              name="image-outline"
+              size={24}
+              color="white"
+              style={{ opacity: 0.4 }}
+            />
+          </View>
+        )}
+      </View>
+      <View className="shrink mt-1">
+        <Text numberOfLines={2} className="">
+          {item.name}
+        </Text>
+        <Text numberOfLines={1} className="text-xs text-neutral-500">
+          {`S${item.seasonNumber}:E${item.episodeNumber}`}
+        </Text>
+      </View>
+
+      <Text numberOfLines={3} className="text-xs text-neutral-500 shrink">
+        {item.overview}
+      </Text>
+    </View>
+  );
+};

 const JellyseerrSeasons: React.FC<{
-  isLoading: boolean,
-  result?: TvResult,
-  details?: TvDetails
-}> = ({
-  isLoading,
-  result,
-  details,
-}) => {
-  if (!details)
-    return null;
+  isLoading: boolean;
+  result?: TvResult;
+  details?: TvDetails;
+}> = ({ isLoading, result, details }) => {
+  if (!details) return null;

-  const {jellyseerrApi, requestMedia} = useJellyseerr();
-  const [seasonStates, setSeasonStates] = useState<{[key: number]: boolean}>();
+  const { jellyseerrApi, requestMedia } = useJellyseerr();
+  const [seasonStates, setSeasonStates] = useState<{
+    [key: number]: boolean;
+  }>();
  const seasons = useMemo(() => {
-      const mediaInfoSeasons = details?.mediaInfo?.seasons?.filter((s: Season) => s.seasonNumber !== 0)
-      const requestedSeasons = details?.mediaInfo?.requests?.flatMap((r: MediaRequest) => r.seasons)
-      return details.seasons?.map((season) => {
-        return {
-          ...season,
-          status:
-            // What our library status is
-            mediaInfoSeasons
-              ?.find((mediaSeason: Season) => mediaSeason.seasonNumber === season.seasonNumber)
-              ?.status
-            ??
-            // What our request status is
-            requestedSeasons
-              ?.find((s: Season) => s.seasonNumber === season.seasonNumber)
-              ?.status
-            ??
-            // Otherwise set it as unknown
-              MediaStatus.UNKNOWN
-        }
-      })
-    },
-    [details]
-  );
+    const mediaInfoSeasons = details?.mediaInfo?.seasons?.filter(
+      (s: Season) => s.seasonNumber !== 0
+    );
+    const requestedSeasons = details?.mediaInfo?.requests?.flatMap(
+      (r: MediaRequest) => r.seasons
+    );
+    return details.seasons?.map((season) => {
+      return {
+        ...season,
+        status:
+          // What our library status is
+          mediaInfoSeasons?.find(
+            (mediaSeason: Season) =>
+              mediaSeason.seasonNumber === season.seasonNumber
+          )?.status ??
+          // What our request status is
+          requestedSeasons?.find(
+            (s: Season) => s.seasonNumber === season.seasonNumber
+          )?.status ??
+          // Otherwise set it as unknown
+          MediaStatus.UNKNOWN,
+      };
+    });
+  }, [details]);

-  const allSeasonsAvailable = useMemo(() =>
-      seasons?.every(season => season.status === MediaStatus.AVAILABLE),
+  const allSeasonsAvailable = useMemo(
+    () => seasons?.every((season) => season.status === MediaStatus.AVAILABLE),
    [seasons]
-  )
+  );

  const requestAll = useCallback(() => {
    if (details && jellyseerrApi) {
@@ -125,48 +145,77 @@ const JellyseerrSeasons: React.FC<{
        mediaType: MediaType.TV,
        tvdbId: details.externalIds?.tvdbId,
        seasons: seasons
-            .filter(s => s.status === MediaStatus.UNKNOWN && s.seasonNumber !== 0)
-            .map(s => s.seasonNumber)
-      })
+          .filter(
+            (s) => s.status === MediaStatus.UNKNOWN && s.seasonNumber !== 0
+          )
+          .map((s) => s.seasonNumber),
+      });
    }
-  }, [jellyseerrApi, seasons, details])
+  }, [jellyseerrApi, seasons, details]);

-  const promptRequestAll = useCallback(() => (
-    Alert.alert('Request all?', 'Are you sure you want to request all seasons?', [
-      {
-        text: 'Cancel',
-        style: 'cancel',
-      },
-      {
-        text: 'YES',
-        onPress: requestAll
-      },
-    ])), [requestAll]);
+  const promptRequestAll = useCallback(
+    () =>
+      Alert.alert(
+        "Request all?",
+        "Are you sure you want to request all seasons?",
+        [
+          {
+            text: "Cancel",
+            style: "cancel",
+          },
+          {
+            text: "YES",
+            onPress: requestAll,
+          },
+        ]
+      ),
+    [requestAll]
+  );
+
+  if (isLoading)
+    return (
+      <View>
+        <View className="flex flex-row justify-between items-end px-4">
+          <Text className="text-lg font-bold mb-2">Seasons</Text>
+          {!allSeasonsAvailable && (
+            <RoundButton className="mb-2 pa-2" onPress={promptRequestAll}>
+              <Ionicons name="bag-add" color="white" size={26} />
+            </RoundButton>
+          )}
+        </View>
+        <Loader />
+      </View>
+    );

  return (
    <FlashList
-      data={orderBy(details.seasons.filter(s => s.seasonNumber !== 0), 'seasonNumber', 'desc')}
+      data={orderBy(
+        details.seasons.filter((s) => s.seasonNumber !== 0),
+        "seasonNumber",
+        "desc"
+      )}
      ListHeaderComponent={() => (
-        <View className="flex flex-row justify-between items-end">
+        <View className="flex flex-row justify-between items-end px-4">
          <Text className="text-lg font-bold mb-2">Seasons</Text>
          {!allSeasonsAvailable && (
-            <RoundButton
-              className="mb-2 pa-2"
-              onPress={promptRequestAll}
-            >
-              <Ionicons name="bag-add" color="white" size={26}/>
+            <RoundButton className="mb-2 pa-2" onPress={promptRequestAll}>
+              <Ionicons name="bag-add" color="white" size={26} />
            </RoundButton>
          )}
        </View>
      )}
      ItemSeparatorComponent={() => <View className="h-2" />}
      estimatedItemSize={250}
-      renderItem={({item: season}) => (
+      renderItem={({ item: season }) => (
        <>
          <TouchableOpacity
-            onPress={() => setSeasonStates((prevState) => (
-              {...prevState, [season.seasonNumber]: !prevState?.[season.seasonNumber]}
-            ))}
+            onPress={() =>
+              setSeasonStates((prevState) => ({
+                ...prevState,
+                [season.seasonNumber]: !prevState?.[season.seasonNumber],
+              }))
+            }
+            className="px-4"
          >
            <View
              className="flex flex-row justify-between items-center bg-gray-100/10 rounded-xl z-20 h-12 w-full px-4"
@@ -174,27 +223,43 @@ const JellyseerrSeasons: React.FC<{
            >
              <Tags
                textClass=""
-                tags={[`Season ${season.seasonNumber}`, `${season.episodeCount} Episodes`]}
+                tags={[
+                  `Season ${season.seasonNumber}`,
+                  `${season.episodeCount} Episodes`,
+                ]}
              />
              {[0].map(() => {
-                const canRequest = seasons?.find(s => s.seasonNumber === season.seasonNumber)?.status === MediaStatus.UNKNOWN
-                return <JellyseerrIconStatus
-                  key={0}
-                  onPress={canRequest ? () =>
-                    requestMedia(
-                      `${result?.name!!}, Season ${season.seasonNumber}`,
-                      {
-                        mediaId: details.id,
-                        mediaType: MediaType.TV,
-                        tvdbId: details.externalIds?.tvdbId,
-                        seasons: [season.seasonNumber]
-                      }
-                    ) : undefined
-                  }
-                  className={canRequest ? 'bg-gray-700/40' : undefined}
-                  mediaStatus={seasons?.find(s => s.seasonNumber === season.seasonNumber)?.status}
-                  showRequestIcon={canRequest}
-                />
+                const canRequest =
+                  seasons?.find((s) => s.seasonNumber === season.seasonNumber)
+                    ?.status === MediaStatus.UNKNOWN;
+                return (
+                  <JellyseerrIconStatus
+                    key={0}
+                    onPress={
+                      canRequest
+                        ? () =>
+                            requestMedia(
+                              `${result?.name!!}, Season ${
+                                season.seasonNumber
+                              }`,
+                              {
+                                mediaId: details.id,
+                                mediaType: MediaType.TV,
+                                tvdbId: details.externalIds?.tvdbId,
+                                seasons: [season.seasonNumber],
+                              }
+                            )
+                        : undefined
+                    }
+                    className={canRequest ? "bg-gray-700/40" : undefined}
+                    mediaStatus={
+                      seasons?.find(
+                        (s) => s.seasonNumber === season.seasonNumber
+                      )?.status
+                    }
+                    showRequestIcon={canRequest}
+                  />
+                );
              })}
            </View>
          </TouchableOpacity>
@@ -206,10 +271,9 @@ const JellyseerrSeasons: React.FC<{
            />
          )}
        </>
-      )
-    }
+      )}
    />
-  )
-}
+  );
+};

-export default JellyseerrSeasons;
+export default JellyseerrSeasons;
--- a/components/settings/MediaContext.tsx
+++ b/components/settings/MediaContext.tsx
@@ -57,8 +57,6 @@ export const MediaProvider = ({ children }: { children: ReactNode }) => {

    updateSettings(update);

-    console.log("update", update);
-
    let updatePayload = {
      SubtitleMode: update?.subtitleMode ?? settings?.subtitleMode,
      PlayDefaultAudioTrack:
@@ -84,8 +82,6 @@ export const MediaProvider = ({ children }: { children: ReactNode }) => {
          settings?.defaultSubtitleLanguage?.ThreeLetterISOLanguageName ||
          "";

-    console.log("updatePayload", updatePayload);
-
    updateUserConfiguration(updatePayload);
  };

--- a/components/video-player/controls/AudioSlider.tsx
+++ b/components/video-player/controls/AudioSlider.tsx
@@ -20,7 +20,6 @@ const AudioSlider: React.FC<AudioSliderProps> = ({ setVisibility }) => {
    const fetchInitialVolume = async () => {
      try {
        const { volume: initialVolume } = await VolumeManager.getVolume();
-        console.log("initialVolume", initialVolume);
        volume.value = initialVolume * 100;
      } catch (error) {
        console.error("Error fetching initial volume:", error);
@@ -39,7 +38,6 @@ const AudioSlider: React.FC<AudioSliderProps> = ({ setVisibility }) => {

  const handleValueChange = async (value: number) => {
    volume.value = value;
-    console.log("volume through slider", value);
    await VolumeManager.setVolume(value / 100);

    // Re-call showNativeVolumeUI to ensure the setting is applied on iOS
@@ -48,7 +46,6 @@ const AudioSlider: React.FC<AudioSliderProps> = ({ setVisibility }) => {

  useEffect(() => {
    const volumeListener = VolumeManager.addVolumeListener((result) => {
-      console.log("Volume through device", result.volume);
      volume.value = result.volume * 100;
      setVisibility(true);

--- a/components/video-player/controls/BrightnessSlider.tsx
+++ b/components/video-player/controls/BrightnessSlider.tsx
@@ -14,7 +14,6 @@ const BrightnessSlider = () => {
  useEffect(() => {
    const fetchInitialBrightness = async () => {
      const initialBrightness = await Brightness.getBrightnessAsync();
-      console.log("initialBrightness", initialBrightness);
      brightness.value = initialBrightness * 100;
    };
    fetchInitialBrightness();
--- a/components/video-player/controls/Controls.tsx
+++ b/components/video-player/controls/Controls.tsx
@@ -240,8 +240,6 @@ export const Controls: React.FC<Props> = ({
        ? maxValue - currentProgress
        : ticksToSeconds(maxValue - currentProgress);

-      console.log("remaining: ", remaining);
-
      setCurrentTime(current);
      setRemainingTime(remaining);
    },
@@ -349,7 +347,6 @@ export const Controls: React.FC<Props> = ({
    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
    try {
      const curr = progress.value;
-      console.log(curr);
      if (curr !== undefined) {
        const newTime = isVlc
          ? curr + secondsToMs(settings.forwardSkipTime)
@@ -375,8 +372,6 @@ export const Controls: React.FC<Props> = ({
    const tileWidth = 150;
    const tileHeight = 150 / trickplayInfo.aspectRatio!;

-    console.log("time, ", time);
-
    return (
      <View
        style={{
--- a/components/video-player/controls/NextEpisodeCountDownButton.tsx
+++ b/components/video-player/controls/NextEpisodeCountDownButton.tsx
@@ -35,7 +35,6 @@ const NextEpisodeCountDownButton: React.FC<NextEpisodeCountDownButtonProps> = ({
        },
        (finished) => {
          if (finished && onFinish) {
-            console.log("finish");
            runOnJS(onFinish)();
          }
        }
--- a/components/video-player/controls/dropdown/DropdownViewDirect.tsx
+++ b/components/video-player/controls/dropdown/DropdownViewDirect.tsx
@@ -106,19 +106,12 @@ const DropdownViewDirect: React.FC<DropdownViewDirectProps> = ({
                  if ("deliveryUrl" in sub && sub.deliveryUrl) {
                    setSubtitleURL &&
                      setSubtitleURL(api?.basePath + sub.deliveryUrl, sub.name);
-
-                    console.log(
-                      "Set external subtitle: ",
-                      api?.basePath + sub.deliveryUrl
-                    );
                  } else {
-                    console.log("Set sub index: ", sub.index);
                    setSubtitleTrack && setSubtitleTrack(sub.index);
                  }
                  router.setParams({
                    subtitleIndex: sub.index.toString(),
                  });
-                  console.log("Subtitle: ", sub);
                }}
              >
                <DropdownMenu.ItemTitle key={`subtitle-item-title-${idx}`}>
--- a/components/video-player/controls/dropdown/DropdownViewTranscoding.tsx
+++ b/components/video-player/controls/dropdown/DropdownViewTranscoding.tsx
@@ -66,7 +66,6 @@ const DropdownView: React.FC<DropdownViewProps> = ({ showControls }) => {

      const sortedSubtitles = subtitleHelper.getSortedSubtitles(textSubtitles);

-      console.log("sortedSubtitles", sortedSubtitles);
      return [disableSubtitle, ...sortedSubtitles];
    }

@@ -104,7 +103,6 @@ const DropdownView: React.FC<DropdownViewProps> = ({ showControls }) => {

  const ChangeTranscodingAudio = useCallback(
    (audioIndex: number) => {
-      console.log("ChangeTranscodingAudio", subtitleIndex, audioIndex);
      const queryParams = new URLSearchParams({
        itemId: item.Id ?? "", // Ensure itemId is a string
        audioIndex: audioIndex?.toString() ?? "",
@@ -167,7 +165,6 @@ const DropdownView: React.FC<DropdownViewProps> = ({ showControls }) => {
                    }
                    key={`subtitle-item-${idx}`}
                    onValueChange={() => {
-                      console.log("sub", sub);
                      if (
                        subtitleIndex ===
                        (isOnTextSubtitle && sub.IsTextSubtitleStream
@@ -216,7 +213,6 @@ const DropdownView: React.FC<DropdownViewProps> = ({ showControls }) => {
                  value={audioIndex === track.index.toString()}
                  onValueChange={() => {
                    if (audioIndex === track.index.toString()) return;
-                    console.log("Setting audio track to: ", track.index);
                    router.setParams({
                      audioIndex: track.index.toString(),
                    });