From 7af4b913d7ccd60ea3fc6e4c11e36e6ac98e6cd6 Mon Sep 17 00:00:00 2001
From: Fredrik Burmester <fredrik.burmester@gmail.com>
Date: Sun, 18 Jan 2026 16:13:53 +0100
Subject: [PATCH] fix(tv): add keyboard focus to text inputs and polish poster
 styling

---
 app/(auth)/(tabs)/(home)/settings.tv.tsx | 5 ++++-
 components/ContinueWatchingPoster.tv.tsx | 8 ++------
 components/posters/MoviePoster.tv.tsx    | 4 +---
 components/posters/SeriesPoster.tv.tsx   | 4 +---
 4 files changed, 8 insertions(+), 13 deletions(-)

diff --git a/app/(auth)/(tabs)/(home)/settings.tv.tsx b/app/(auth)/(tabs)/(home)/settings.tv.tsx
index ae84f5b3..a4bc7774 100644
--- a/app/(auth)/(tabs)/(home)/settings.tv.tsx
+++ b/app/(auth)/(tabs)/(home)/settings.tv.tsx
@@ -1,7 +1,7 @@
 import { Ionicons } from "@expo/vector-icons";
 import { SubtitlePlaybackMode } from "@jellyfin/sdk/lib/generated-client";
 import { useAtom } from "jotai";
-import React, { useMemo, useState } from "react";
+import React, { useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Animated, Pressable, ScrollView, TextInput, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
@@ -319,6 +319,7 @@ const TVSettingsTextInput: React.FC<{
   secureTextEntry,
   disabled,
 }) => {
+  const inputRef = useRef<TextInput>(null);
   const { focused, handleFocus, handleBlur, animatedStyle } =
     useTVFocusAnimation({ scaleAmount: 1.02 });
 
@@ -329,6 +330,7 @@ const TVSettingsTextInput: React.FC<{
 
   return (
     <Pressable
+      onPress={() => inputRef.current?.focus()}
       onFocus={handleFocus}
       onBlur={handleInputBlur}
       disabled={disabled}
@@ -352,6 +354,7 @@ const TVSettingsTextInput: React.FC<{
           {label}
         </Text>
         <TextInput
+          ref={inputRef}
           value={value}
           placeholder={placeholder}
           placeholderTextColor='#6B7280'
diff --git a/components/ContinueWatchingPoster.tv.tsx b/components/ContinueWatchingPoster.tv.tsx
index 9dda5694..56111119 100644
--- a/components/ContinueWatchingPoster.tv.tsx
+++ b/components/ContinueWatchingPoster.tv.tsx
@@ -66,9 +66,7 @@ const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
         style={{
           width: TV_LANDSCAPE_WIDTH,
           aspectRatio: 16 / 9,
-          borderWidth: 1,
-          borderColor: "#262626",
-          borderRadius: 12,
+          borderRadius: 24,
         }}
       />
     );
@@ -80,10 +78,8 @@ const ContinueWatchingPoster: React.FC<ContinueWatchingPosterProps> = ({
         position: "relative",
         width: TV_LANDSCAPE_WIDTH,
         aspectRatio: 16 / 9,
-        borderRadius: 12,
+        borderRadius: 24,
         overflow: "hidden",
-        borderWidth: 1,
-        borderColor: "#262626",
       }}
     >
       <View
diff --git a/components/posters/MoviePoster.tv.tsx b/components/posters/MoviePoster.tv.tsx
index c4d9daee..1719df96 100644
--- a/components/posters/MoviePoster.tv.tsx
+++ b/components/posters/MoviePoster.tv.tsx
@@ -39,10 +39,8 @@ const MoviePoster: React.FC<MoviePosterProps> = ({
     <View
       style={{
         position: "relative",
-        borderRadius: 12,
+        borderRadius: 24,
         overflow: "hidden",
-        borderWidth: 1,
-        borderColor: "#262626",
         width: TV_POSTER_WIDTH,
         aspectRatio: 10 / 15,
       }}
diff --git a/components/posters/SeriesPoster.tv.tsx b/components/posters/SeriesPoster.tv.tsx
index 5d4bb97a..21b41ff6 100644
--- a/components/posters/SeriesPoster.tv.tsx
+++ b/components/posters/SeriesPoster.tv.tsx
@@ -38,10 +38,8 @@ const SeriesPoster: React.FC<SeriesPosterProps> = ({ item }) => {
         width: TV_POSTER_WIDTH,
         aspectRatio: 10 / 15,
         position: "relative",
-        borderRadius: 12,
+        borderRadius: 24,
         overflow: "hidden",
-        borderWidth: 1,
-        borderColor: "#262626",
       }}
     >
       <Image