fix(home): build episode thumb URLs from the matched ParentThumbItemId pair

app/(auth)/(tabs)/(home)/_layout.tsx

@@ -73,6 +73,7 @@ export default function IndexLayout() {
           headerLeft: () => (
             <Pressable
               onPress={() => _router.back()}
+              className='pl-0.5'
               style={{ marginRight: Platform.OS === "android" ? 16 : 0 }}
             >
               <Feather name='chevron-left' size={28} color='white' />
@@ -157,6 +158,7 @@ export default function IndexLayout() {
           headerLeft: () => (
             <Pressable
               onPress={() => _router.back()}
+              className='pl-0.5'
               style={{ marginRight: Platform.OS === "android" ? 16 : 0 }}
             >
               <Feather name='chevron-left' size={28} color='white' />

app/(auth)/(tabs)/(home)/settings/logs/page.tsx

@@ -1,6 +1,4 @@
-import { Ionicons } from "@expo/vector-icons";
 import { File, Paths } from "expo-file-system";
-import { requireOptionalNativeModule } from "expo-modules-core";
 import { useNavigation } from "expo-router";
 import type * as SharingType from "expo-sharing";
 import { useCallback, useEffect, useId, useMemo, useState } from "react";
@@ -8,7 +6,6 @@ import { useTranslation } from "react-i18next";
 import { Platform, ScrollView, TouchableOpacity, View } from "react-native";
 import Collapsible from "react-native-collapsible";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { toast } from "sonner-native";
 import { Text } from "@/components/common/Text";
 import { FilterButton } from "@/components/filters/FilterButton";
 import { Loader } from "@/components/Loader";
@@ -75,25 +72,6 @@ export default function Page() {
     }
   }, [filteredLogs, Sharing]);
 
-  const copyLog = useCallback(
-    async (log: NonNullable<typeof logs>[number]) => {
-      // Skip on builds that don't ship the expo-clipboard native module
-      // (probe returns null instead of throwing); same guard as Quick Connect.
-      if (!requireOptionalNativeModule("ExpoClipboard")) return;
-      const Clipboard = await import("expo-clipboard");
-      const text = [
-        `[${log.level}] ${new Date(log.timestamp).toLocaleString()}`,
-        log.message,
-        log.data ? JSON.stringify(log.data, null, 2) : null,
-      ]
-        .filter(Boolean)
-        .join("\n");
-      await Clipboard.setStringAsync(text);
-      toast.success(t("home.settings.logs.copied"));
-    },
-    [logs, t],
-  );
-
   useEffect(() => {
     if (Platform.isTV) return;
 
@@ -110,15 +88,8 @@ export default function Page() {
   }, [share, loading]);
 
   return (
-    <ScrollView
-      // Like the sibling settings pages, let iOS auto-inset the content below the
-      // transparent header (no manual header-height math). The filter bar is a
-      // sticky header so it stays pinned just under the header while logs scroll.
-      contentInsetAdjustmentBehavior='automatic'
-      stickyHeaderIndices={[0]}
-      contentContainerStyle={{ paddingBottom: insets.bottom }}
-    >
-      <View className='flex flex-row justify-end py-2 px-4 space-x-2 bg-black'>
+    <View className='flex-1'>
+      <View className='flex flex-row justify-end py-2 px-4 space-x-2'>
         <FilterButton
           id={orderFilterId}
           queryKey='log'
@@ -141,77 +112,67 @@ export default function Page() {
           multiple={true}
         />
       </View>
-      <View className='flex flex-col space-y-2 px-4'>
-        {filteredLogs?.map((log, index) => (
-          <View className='bg-neutral-900 rounded-xl p-3' key={index}>
-            <TouchableOpacity
-              disabled={!log.data}
-              onPress={() =>
-                setState((v) => ({
-                  ...v,
-                  [log.timestamp]: !v[log.timestamp],
-                }))
-              }
-            >
-              <View className='flex flex-row justify-between'>
-                <Text
-                  className={`mb-1
+      <ScrollView
+        className='pb-4 px-4'
+        contentContainerStyle={{ paddingBottom: insets.bottom }}
+      >
+        <View className='flex flex-col space-y-2'>
+          {filteredLogs?.map((log, index) => (
+            <View className='bg-neutral-900 rounded-xl p-3' key={index}>
+              <TouchableOpacity
+                disabled={!log.data}
+                onPress={() =>
+                  setState((v) => ({
+                    ...v,
+                    [log.timestamp]: !v[log.timestamp],
+                  }))
+                }
+              >
+                <View className='flex flex-row justify-between'>
+                  <Text
+                    className={`mb-1
                       ${log.level === "INFO" && "text-blue-500"}
                       ${log.level === "ERROR" && "text-red-500"}
                       ${log.level === "DEBUG" && "text-purple-500"}
                     `}
-                >
-                  {log.level}
-                </Text>
-
-                <Text className='text-xs'>
-                  {new Date(log.timestamp).toLocaleString()}
-                </Text>
-              </View>
-              <Text className='text-xs'>{log.message}</Text>
-              {/* Keep the whole collapsed row tappable: the hint lives inside
-                  the toggle so tapping it expands too. */}
-              {log.data && !state[log.timestamp] && (
-                <Text className='text-xs mt-0.5'>
-                  {t("home.settings.logs.click_for_more_info")}
-                </Text>
-              )}
-            </TouchableOpacity>
-
-            {log.data && (
-              <Collapsible collapsed={!state[log.timestamp]}>
-                <View className='mt-2 flex flex-col space-y-2'>
-                  <ScrollView
-                    className='rounded-xl'
-                    style={codeBlockStyle}
-                    nestedScrollEnabled
                   >
-                    {/* Only the raw payload is selectable (per request); the
-                        header/message stay tap-to-toggle. */}
-                    <Text selectable>{JSON.stringify(log.data, null, 2)}</Text>
-                  </ScrollView>
-                  {!Platform.isTV && (
-                    <TouchableOpacity
-                      onPress={() => copyLog(log)}
-                      className='flex flex-row items-center self-end px-2 py-1'
-                    >
-                      <Ionicons name='copy-outline' size={16} color='white' />
-                      <Text className='text-xs ml-1'>
-                        {t("home.settings.logs.copy")}
-                      </Text>
-                    </TouchableOpacity>
-                  )}
+                    {log.level}
+                  </Text>
+
+                  <Text className='text-xs'>
+                    {new Date(log.timestamp).toLocaleString()}
+                  </Text>
                 </View>
-              </Collapsible>
-            )}
-          </View>
-        ))}
-        {filteredLogs?.length === 0 && (
-          <Text className='opacity-50'>
-            {t("home.settings.logs.no_logs_available")}
-          </Text>
-        )}
-      </View>
-    </ScrollView>
+                <Text selectable className='text-xs'>
+                  {log.message}
+                </Text>
+              </TouchableOpacity>
+
+              {log.data && (
+                <>
+                  {!state[log.timestamp] && (
+                    <Text className='text-xs mt-0.5'>
+                      {t("home.settings.logs.click_for_more_info")}
+                    </Text>
+                  )}
+                  <Collapsible collapsed={!state[log.timestamp]}>
+                    <View className='mt-2 flex flex-col space-y-2'>
+                      <ScrollView className='rounded-xl' style={codeBlockStyle}>
+                        <Text>{JSON.stringify(log.data, null, 2)}</Text>
+                      </ScrollView>
+                    </View>
+                  </Collapsible>
+                </>
+              )}
+            </View>
+          ))}
+          {filteredLogs?.length === 0 && (
+            <Text className='opacity-50'>
+              {t("home.settings.logs.no_logs_available")}
+            </Text>
+          )}
+        </View>
+      </ScrollView>
+    </View>
   );
 }

bun.lock

@@ -31,7 +31,6 @@
         "expo-brightness": "~56.0.5",
         "expo-build-properties": "~56.0.18",
         "expo-camera": "~56.0.8",
-        "expo-clipboard": "~56.0.4",
         "expo-constants": "~56.0.18",
         "expo-crypto": "~56.0.4",
         "expo-dev-client": "~56.0.20",
@@ -1002,8 +1001,6 @@
 
     "expo-camera": ["expo-camera@56.0.8", "", { "dependencies": { "barcode-detector": "^3.0.0" }, "peerDependencies": { "expo": "*", "react": "*", "react-native": "*", "react-native-web": "*" }, "optionalPeers": ["react-native-web"] }, "sha512-UDOpUUMisFRmCv1XQV1MJCKGAH2CsIC1Rs6P9Bbc6JLVmbxEKAd5dK68y6cScOdWURxVfJ0PRcjYnSuc8ayyIQ=="],
 
-    "expo-clipboard": ["expo-clipboard@56.0.4", "", { "peerDependencies": { "expo": "*", "react": "*", "react-native": "*" } }, "sha512-qb4DYlkiowHYHaUYVT2FN9nk/nI1xShXOUYsI7J9dVpQCOHcGFjCBPX1VAvEW4Ye4/Aagd6IuhOVAq/+scBOiA=="],
-
     "expo-constants": ["expo-constants@56.0.18", "", { "dependencies": { "@expo/env": "~2.3.0" }, "peerDependencies": { "expo": "*", "react-native": "*" } }, "sha512-8AMtbDGl/WVPnWlmbpGmvcdnNCy9E4PFnwdVwj600vljkMDPSxcAcjw8GVXEPk3PpZ+ngTqsrkltWyj0UKYAxw=="],
 
     "expo-crypto": ["expo-crypto@56.0.4", "", { "peerDependencies": { "expo": "*" } }, "sha512-fRNEhoXRXgAWBpe3/hq5X+KXTit3OZqdiAGts1YvNEUHQb+H5591mpPac0Yw+sZg9pXcrjRnzo5AxvZaENpc7g=="],

components/ContinueWatchingPoster.tsx

@@ -35,8 +35,10 @@ const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
       return `${api?.basePath}/Items/${item.Id}/Images/Primary?fillHeight=389&quality=80`;
     }
     if (item.Type === "Episode") {
-      if (item.ParentBackdropItemId && item.ParentThumbImageTag) {
-        return `${api?.basePath}/Items/${item.ParentBackdropItemId}/Images/Thumb?fillHeight=389&quality=80&tag=${item.ParentThumbImageTag}`;
+      // Matched pair: the parent that owns the Thumb (ParentThumbItemId), not the
+      // backdrop owner — otherwise the Thumb tag is requested on the wrong item → black.
+      if (item.ParentThumbItemId && item.ParentThumbImageTag) {
+        return `${api?.basePath}/Items/${item.ParentThumbItemId}/Images/Thumb?fillHeight=389&quality=80&tag=${item.ParentThumbImageTag}`;
       }
 
       return `${api?.basePath}/Items/${item.Id}/Images/Primary?fillHeight=389&quality=80`;
@@ -61,7 +63,8 @@ const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
     }
 
     return `${api?.basePath}/Items/${item.Id}/Images/Primary?fillHeight=389&quality=80`;
-  }, [item]);
+    // useEpisodePoster in deps so flipping the prop re-computes the URL live.
+  }, [item, useEpisodePoster]);
 
   if (!url)
     return <View className='aspect-video border border-neutral-800 w-44' />;

components/common/HeaderBackButton.tsx

@@ -1,4 +1,4 @@
-import { Feather } from "@expo/vector-icons";
+import { Ionicons } from "@expo/vector-icons";
 import { BlurView, type BlurViewProps } from "expo-blur";
 import { Platform } from "react-native";
 import { Pressable, type PressableProps } from "react-native-gesture-handler";
@@ -23,7 +23,7 @@ export const HeaderBackButton: React.FC<Props> = ({
         className='flex items-center justify-center w-9 h-9'
         {...pressableProps}
       >
-        <Feather name='chevron-left' size={28} color='white' />
+        <Ionicons name='arrow-back' size={24} color='white' />
       </Pressable>
     );
   }
@@ -36,10 +36,10 @@ export const HeaderBackButton: React.FC<Props> = ({
           intensity={100}
           className='overflow-hidden rounded-full p-2'
         >
-          <Feather
+          <Ionicons
             className='drop-shadow-2xl'
-            name='chevron-left'
-            size={28}
+            name='arrow-back'
+            size={24}
             color='white'
           />
         </BlurView>
@@ -49,16 +49,13 @@ export const HeaderBackButton: React.FC<Props> = ({
   return (
     <Pressable
       onPress={() => router.back()}
-      // Match the Settings page back button: chevron flush to the edge with a
-      // 16px gap before the title (the old `p-2` pushed both arrow and title
-      // too far right). drop-shadow keeps it readable over images.
-      style={{ marginRight: 16 }}
+      className=' rounded-full p-2'
       {...pressableProps}
     >
-      <Feather
+      <Ionicons
         className='drop-shadow-2xl'
-        name='chevron-left'
-        size={28}
+        name='arrow-back'
+        size={24}
         color='white'
       />
     </Pressable>

components/home/TVHeroCarousel.tsx

@@ -65,10 +65,11 @@ const HeroCard: React.FC<HeroCardProps> = React.memo(
     const posterUrl = useMemo(() => {
       if (!api) return null;
 
-      // For episodes, always use series thumb
+      // For episodes, always use series thumb.
+      // Matched pair: ParentThumbItemId owns the Thumb tag, not ParentBackdropItemId.
       if (item.Type === "Episode") {
-        if (item.ParentThumbImageTag) {
-          return `${api.basePath}/Items/${item.ParentBackdropItemId}/Images/Thumb?fillHeight=400&quality=80&tag=${item.ParentThumbImageTag}`;
+        if (item.ParentThumbItemId && item.ParentThumbImageTag) {
+          return `${api.basePath}/Items/${item.ParentThumbItemId}/Images/Thumb?fillHeight=400&quality=80&tag=${item.ParentThumbImageTag}`;
         }
         if (item.SeriesId) {
           return `${api.basePath}/Items/${item.SeriesId}/Images/Thumb?fillHeight=400&quality=80`;

components/tv/TVPosterCard.tsx

@@ -139,9 +139,10 @@ export const TVPosterCard: React.FC<TVPosterCardProps> = ({
     if (orientation === "horizontal") {
       // Episode: prefer series thumb image for consistent look (like hero section)
       if (item.Type === "Episode") {
-        // First try parent/series thumb (horizontal series artwork)
-        if (item.ParentBackdropItemId && item.ParentThumbImageTag) {
-          return `${api.basePath}/Items/${item.ParentBackdropItemId}/Images/Thumb?fillHeight=700&quality=80&tag=${item.ParentThumbImageTag}`;
+        // First try parent/series thumb (horizontal series artwork).
+        // Matched pair: ParentThumbItemId owns the Thumb tag, not ParentBackdropItemId.
+        if (item.ParentThumbItemId && item.ParentThumbImageTag) {
+          return `${api.basePath}/Items/${item.ParentThumbItemId}/Images/Thumb?fillHeight=700&quality=80&tag=${item.ParentThumbImageTag}`;
         }
         // Fall back to episode's own primary image
         if (item.ImageTags?.Primary) {

package.json

@@ -54,7 +54,6 @@
     "expo-brightness": "~56.0.5",
     "expo-build-properties": "~56.0.18",
     "expo-camera": "~56.0.8",
-    "expo-clipboard": "~56.0.4",
     "expo-constants": "~56.0.18",
     "expo-crypto": "~56.0.4",
     "expo-dev-client": "~56.0.20",

translations/en.json

@@ -410,9 +410,7 @@
         "click_for_more_info": "Click for more info",
         "level": "Level",
         "no_logs_available": "No logs available",
-        "delete_all_logs": "Delete all logs",
-        "copy": "Copy",
-        "copied": "Copied to clipboard"
+        "delete_all_logs": "Delete all logs"
       },
       "languages": {
         "title": "Languages",