From 6c201e285aee30f24cb97fe05191a20a1f9e1d82 Mon Sep 17 00:00:00 2001
From: AdityasahuX07 <smily998800@gmail.com>
Date: Wed, 3 Dec 2025 15:41:23 +0530
Subject: [PATCH] Fix for filter tabs in Library UI element cropped off in
 mobile devices.

Fixes #135
---
 src/screens/LibraryScreen.tsx | 29 ++++++++++++++---------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/screens/LibraryScreen.tsx b/src/screens/LibraryScreen.tsx
index 3f7d6e6..470575e 100644
--- a/src/screens/LibraryScreen.tsx
+++ b/src/screens/LibraryScreen.tsx
@@ -964,22 +964,20 @@ const LibraryScreen = () => {
 
         {/* Content Container */}
         <View style={[styles.contentContainer, { backgroundColor: currentTheme.colors.darkBackground }]}>
-          {!showTraktContent && (
-            <ScrollView 
-              horizontal 
-              showsHorizontalScrollIndicator={false}
-              contentContainerStyle={styles.filtersContainer}
-              style={styles.filtersScrollView}
-            >
-              {renderFilter('trakt', 'Trakt', 'pan-tool')}
-              {renderFilter('movies', 'Movies', 'movie')}
-              {renderFilter('series', 'TV Shows', 'live-tv')}
-            </ScrollView>
-          )}
+            {!showTraktContent && (
+              // Replaced ScrollView with View and used the modified style
+              <View
+                style={styles.filtersContainer}
+              >
+                {renderFilter('trakt', 'Trakt', 'pan-tool')}
+                {renderFilter('movies', 'Movies', 'movie')}
+                {renderFilter('series', 'TV Shows', 'live-tv')}
+              </View>
+            )}
 
-          {showTraktContent ? renderTraktContent() : renderContent()}
+            {showTraktContent ? renderTraktContent() : renderContent()}
+          </View>
         </View>
-      </View>
 
       {/* DropUpMenu integration */}
       {selectedItem && (
@@ -1081,6 +1079,7 @@ const styles = StyleSheet.create({
   },
   filtersContainer: {
     flexDirection: 'row',
+    justifyContent: 'center',
     paddingHorizontal: 16,
     paddingBottom: 16,
     paddingTop: 8,
@@ -1353,4 +1352,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default LibraryScreen; 
\ No newline at end of file
+export default LibraryScreen;