From 6bd9cc806455021a7fe3939a3a05893db1c4fc3a Mon Sep 17 00:00:00 2001
From: tapframe <nayifveliya99@gmail.com>
Date: Thu, 19 Jun 2025 23:52:51 +0530
Subject: [PATCH] Refactor Trakt integration for improved session handling and
 UI updates

This update refines the Trakt integration by enhancing session management and updating UI components to better reflect watched states. The useTraktAutosync and useWatchProgress hooks have been optimized for more reliable session tracking and progress display. Additionally, the HeroSection and ActionButtons now provide clearer indicators of content watched status, improving user experience and synchronization with Trakt.
---
 src/components/metadata/SeriesContent.tsx | 35 +++++++++++------------
 1 file changed, 17 insertions(+), 18 deletions(-)

diff --git a/src/components/metadata/SeriesContent.tsx b/src/components/metadata/SeriesContent.tsx
index a8ee4695..bcdf564a 100644
--- a/src/components/metadata/SeriesContent.tsx
+++ b/src/components/metadata/SeriesContent.tsx
@@ -334,14 +334,13 @@ export const SeriesContent: React.FC<SeriesContentProps> = ({
         style={[
           styles.episodeCardHorizontal,
           isTablet && styles.episodeCardHorizontalTablet,
-          // Enhanced border styling
+          // Gradient border styling
           { 
-            borderWidth: 2,
-            borderColor: 'transparent', // Make base border transparent
-            // Add gradient border effect using shadow
-            shadowColor: currentTheme.colors.primary,
-            shadowOffset: { width: 0, height: 0 },
-            shadowOpacity: 0.6,
+            borderWidth: 1,
+            borderColor: 'transparent',
+            shadowColor: '#000',
+            shadowOffset: { width: 0, height: 4 },
+            shadowOpacity: 0.3,
             shadowRadius: 8,
             elevation: 12,
           }
@@ -352,26 +351,26 @@ export const SeriesContent: React.FC<SeriesContentProps> = ({
         {/* Gradient Border Container */}
         <View style={{
           position: 'absolute',
-          top: -2,
-          left: -2,
-          right: -2,
-          bottom: -2,
-          borderRadius: 18,
+          top: -1,
+          left: -1,
+          right: -1,
+          bottom: -1,
+          borderRadius: 17,
           zIndex: -1,
         }}>
           <LinearGradient
             colors={[
-              currentTheme.colors.primary + '80', // 80% opacity
-              currentTheme.colors.primary + '40', // 40% opacity
-              currentTheme.colors.primary + '20', // 20% opacity
-              currentTheme.colors.primary + '40', // 40% opacity
-              currentTheme.colors.primary + '80', // 80% opacity
+              '#ffffff80', // White with 50% opacity
+              '#ffffff40', // White with 25% opacity  
+              '#ffffff20', // White with 12% opacity
+              '#ffffff40', // White with 25% opacity
+              '#ffffff80', // White with 50% opacity
             ]}
             start={{ x: 0, y: 0 }}
             end={{ x: 1, y: 1 }}
             style={{
               flex: 1,
-              borderRadius: 18,
+              borderRadius: 17,
             }}
           />
         </View>