wip

2026-04-21 08:14:42 +01:00 · 2024-10-03 07:37:37 +02:00
parent 60981504fc
commit b21a1cd18e
15 changed files with 137 additions and 107 deletions
--- a/components/ContinueWatchingPoster.tsx
+++ b/components/ContinueWatchingPoster.tsx
@@ -9,13 +9,14 @@ import React from "react";

 type ContinueWatchingPosterProps = {
  item: BaseItemDto;
-  width?: number;
  useEpisodePoster?: boolean;
+  size?: "small" | "normal";
 };

 const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
  item,
  useEpisodePoster = false,
+  size = "normal",
 }) => {
  const [api] = useAtom(apiAtom);

@@ -51,7 +52,12 @@ const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
    );

  return (
-    <View className="relative w-44 aspect-video rounded-lg overflow-hidden border border-neutral-800">
+    <View
+      className={`
+      relative w-44 aspect-video rounded-lg overflow-hidden border border-neutral-800
+      ${size === "small" ? "w-32" : "w-44"}
+    `}
+    >
      <Image
        key={item.Id}
        id={item.Id}
--- a/components/ItemCardText.tsx
+++ b/components/ItemCardText.tsx
@@ -10,7 +10,7 @@ type ItemCardProps = {

 export const ItemCardText: React.FC<ItemCardProps> = ({ item }) => {
  return (
-    <View className="mt-2 flex flex-col h-12">
+    <View className="mt-2 flex flex-col">
      {item.Type === "Episode" ? (
        <>
          <Text numberOfLines={2} className="">
--- a/components/ItemContent.tsx
+++ b/components/ItemContent.tsx
@@ -125,6 +125,7 @@ export const ItemContent: React.FC<{ id: string }> = React.memo(({ id }) => {
  });

  const [localItem, setLocalItem] = useState(item);
+  useImageColors(item);

  useEffect(() => {
    if (item) {
@@ -234,18 +235,6 @@ export const ItemContent: React.FC<{ id: string }> = React.memo(({ id }) => {
  });

  const logoUrl = useMemo(() => getLogoImageUrlById({ api, item }), [item]);
-  const themeImageColorSource = useMemo(() => {
-    if (!api || !item) return;
-    return getItemImage({
-      item,
-      api,
-      variant: "Primary",
-      quality: 80,
-      width: 300,
-    });
-  }, [api, item]);
-
-  useImageColors(themeImageColorSource?.uri);

  const loading = useMemo(() => {
    return Boolean(isLoading || isFetching || (logoUrl && loadingLogo));
@@ -274,7 +263,6 @@ export const ItemContent: React.FC<{ id: string }> = React.memo(({ id }) => {
            <Animated.View style={[animatedStyle, { flex: 1 }]}>
              {localItem && (
                <ItemImage
-                  useThemeColor
                  variant={
                    localItem.Type === "Movie" && logoUrl
                      ? "Backdrop"
@@ -357,7 +345,7 @@ export const ItemContent: React.FC<{ id: string }> = React.memo(({ id }) => {
            <SeasonEpisodesCarousel item={item} loading={loading} />
          )}

-          <OverviewText text={item?.Overview} className="px-4 mb-4" />
+          <OverviewText text={item?.Overview} className="px-4 my-4" />

          <CastAndCrew item={item} className="mb-4" loading={loading} />

--- a/components/ItemHeader.tsx
+++ b/components/ItemHeader.tsx
@@ -4,6 +4,7 @@ import { MoviesTitleHeader } from "./movies/MoviesTitleHeader";
 import { Ratings } from "./Ratings";
 import { EpisodeTitleHeader } from "./series/EpisodeTitleHeader";
 import { GenreTags } from "./GenreTags";
+import React from "react";

 interface Props extends ViewProps {
  item?: BaseItemDto | null;
--- a/components/common/ItemImage.tsx
+++ b/components/common/ItemImage.tsx
@@ -22,7 +22,6 @@ interface Props extends ImageProps {
    | "Thumb";
  quality?: number;
  width?: number;
-  useThemeColor?: boolean;
  onError?: () => void;
 }

@@ -31,7 +30,6 @@ export const ItemImage: React.FC<Props> = ({
  variant = "Primary",
  quality = 90,
  width = 1000,
-  useThemeColor = false,
  onError,
  ...props
 }) => {
--- a/components/home/ScrollingCollectionList.tsx
+++ b/components/home/ScrollingCollectionList.tsx
@@ -51,10 +51,24 @@ export const ScrollingCollectionList: React.FC<Props> = ({
        `}
        >
          {[1, 2, 3].map((i) => (
-            <View className="w-44 mb-2">
-              <View className="bg-neutral-800 h-24 w-full rounded-md mb-2"></View>
-              <View className="bg-neutral-800 h-4 w-full rounded-md mb-2"></View>
-              <View className="bg-neutral-800 h-4 w-1/2 rounded-md"></View>
+            <View className="w-44" key={i}>
+              <View className="bg-neutral-900 h-24 w-full rounded-md mb-1"></View>
+              <View className="rounded-md overflow-hidden mb-1 self-start">
+                <Text
+                  className="text-neutral-900 bg-neutral-900 rounded-md"
+                  numberOfLines={1}
+                >
+                  Nisi mollit voluptate amet.
+                </Text>
+              </View>
+              <View className="rounded-md overflow-hidden self-start mb-1">
+                <Text
+                  className="text-neutral-900 bg-neutral-900 text-xs rounded-md "
+                  numberOfLines={1}
+                >
+                  Lorem ipsum
+                </Text>
+              </View>
            </View>
          ))}
        </View>
--- a/components/series/SeasonPicker.tsx
+++ b/components/series/SeasonPicker.tsx
@@ -198,11 +198,11 @@ export const SeasonPicker: React.FC<Props> = ({ item, initialSeasonIndex }) => {
              key={e.Id}
              className="flex flex-col mb-4"
            >
-              <View className="flex flex-row items-center mb-2">
-                <View className="w-32 aspect-video overflow-hidden mr-2">
+              <View className="flex flex-row items-start mb-2">
+                <View className="mr-2">
                  <ContinueWatchingPoster
+                    size="small"
                    item={e}
-                    width={128}
                    useEpisodePoster
                  />
                </View>
@@ -217,7 +217,7 @@ export const SeasonPicker: React.FC<Props> = ({ item, initialSeasonIndex }) => {
                    {runtimeTicksToSeconds(e.RunTimeTicks)}
                  </Text>
                </View>
-                <View className="self-start ml-auto">
+                <View className="self-start ml-auto -mt-0.5">
                  <DownloadItem item={e} />
                </View>
              </View>
--- a/components/settings/SettingToggles.tsx
+++ b/components/settings/SettingToggles.tsx
@@ -50,41 +50,32 @@ export const SettingToggles: React.FC<Props> = ({ ...props }) => {

  const queryClient = useQueryClient();

-  const { data: optimizeServerStatistics } = useQuery({
-    queryKey: ["optimize-server", settings?.optimizedVersionsServerUrl],
-    queryFn: async () =>
-      getStatistics({
-        url: settings?.optimizedVersionsServerUrl,
-        authHeader: api?.accessToken,
-        deviceId: await getOrSetDeviceId(),
-      }),
-    refetchInterval: 1000,
-    staleTime: 0,
-    enabled:
-      !!settings?.optimizedVersionsServerUrl &&
-      settings.optimizedVersionsServerUrl.length > 0,
-  });
-
  /********************
   * Background task
   *******************/
-  useEffect(() => {
-    checkStatusAsync();
-  }, []);
-
  const checkStatusAsync = async () => {
    await BackgroundFetch.getStatusAsync();
-    await TaskManager.isTaskRegisteredAsync(BACKGROUND_FETCH_TASK);
+    return await TaskManager.isTaskRegisteredAsync(BACKGROUND_FETCH_TASK);
  };

  useEffect(() => {
-    if (settings?.autoDownload) {
-      registerBackgroundFetchAsync();
-    } else {
-      unregisterBackgroundFetchAsync();
-    }
+    (async () => {
+      const registered = await checkStatusAsync();

-    checkStatusAsync();
+      if (settings?.autoDownload === true && !registered) {
+        registerBackgroundFetchAsync();
+        toast.success("Background downlodas enabled");
+      } else if (settings?.autoDownload === false && registered) {
+        unregisterBackgroundFetchAsync();
+        toast.info("Background downloads disabled");
+      } else if (settings?.autoDownload === true && registered) {
+        // Don't to anything
+      } else if (settings?.autoDownload === false && !registered) {
+        // Don't to anything
+      } else {
+        updateSettings({ autoDownload: false });
+      }
+    })();
  }, [settings?.autoDownload]);
  /**********************
   *********************/
@@ -593,14 +584,6 @@ export const SettingToggles: React.FC<Props> = ({ ...props }) => {
                  <Text className="font-semibold">
                    Optimized versions server
                  </Text>
-                  <View
-                    className={`
-                      w-3 h-3 rounded-full
-                      ${
-                        optimizeServerStatistics ? "bg-green-600" : "bg-red-600"
-                      }
-                    `}
-                  ></View>
                </View>
                <Text className="text-xs opacity-50">
                  Set the URL for the optimized versions server for downloads.
@@ -620,8 +603,7 @@ export const SettingToggles: React.FC<Props> = ({ ...props }) => {
                <Button
                  color="purple"
                  className="h-12 mt-2"
-                  onPress={() => {
-                    toast.info("Saved");
+                  onPress={async () => {
                    updateSettings({
                      optimizedVersionsServerUrl:
                        optimizedVersionsServerUrl.length === 0
@@ -630,6 +612,14 @@ export const SettingToggles: React.FC<Props> = ({ ...props }) => {
                          ? optimizedVersionsServerUrl
                          : optimizedVersionsServerUrl + "/",
                    });
+                    const res = await getStatistics({
+                      url: settings?.optimizedVersionsServerUrl,
+                      authHeader: api?.accessToken,
+                      deviceId: await getOrSetDeviceId(),
+                    });
+                    if (res) {
+                      toast.success("Connected");
+                    } else toast.error("Could not connect");
                  }}
                >
                  Save