Make scroll indicator visible in dark mode

farshed · Aug 3, 2020 · 8e562c3 · 8e562c3
1 parent 0b8cbba
commit 8e562c3
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 8 deletions.
diff --git a/App.js b/App.js
@@ -14,7 +14,7 @@ export default function App() {
 		store.dispatch({ type: 'set_playback', payload: false }); // To make sure currentTrack is paused at startup
 		if (Text.defaultProps == null) Text.defaultProps = {};
 		Text.defaultProps.allowFontScaling = false;
-		console.disableYellowBox = true;
+		// console.disableYellowBox = true;
 	}, []);
 
 	function renderApp(isReady) {

diff --git a/src/screens/AlbumsScreen.js b/src/screens/AlbumsScreen.js
@@ -48,6 +48,7 @@ function AlbumsScreen(props) {
 				renderItem={renderAlbums}
 				getItemLayout={flatListItemLayout}
 				keyExtractor={(asset) => asset.title.toString()}
+				indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 			/>
 		</View>
 	);
@@ -56,7 +57,8 @@ function AlbumsScreen(props) {
 function mapStateToProps(state) {
 	return {
 		albums: state.media.albums,
-		currentTrack: state.playback.currentTrack
+		currentTrack: state.playback.currentTrack,
+		theme: state.settings.theme
 	};
 }
 

diff --git a/src/screens/ArtistsScreen.js b/src/screens/ArtistsScreen.js
@@ -48,6 +48,7 @@ function ArtistsScreen(props) {
 				renderItem={renderArtists}
 				getItemLayout={flatListItemLayout}
 				keyExtractor={(asset) => asset.title.toString()}
+				indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 			/>
 		</View>
 	);
@@ -56,7 +57,8 @@ function ArtistsScreen(props) {
 function mapStateToProps(state) {
 	return {
 		artists: state.media.artists,
-		currentTrack: state.playback.currentTrack
+		currentTrack: state.playback.currentTrack,
+		theme: state.settings.theme
 	};
 }
 

diff --git a/src/screens/SearchScreen.js b/src/screens/SearchScreen.js
@@ -41,6 +41,7 @@ function SearchScreen(props) {
 				renderItem={({ item }) => <RenderTrack item={item} setOptions={setModal} />}
 				keyExtractor={(asset) => asset.id.toString()}
 				style={[styles.resultsWrapper, renderMargin]}
+				indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 			/>
 		) : (
 			<PlaceholderWrapper>
@@ -78,11 +79,15 @@ function SearchScreen(props) {
 function mapStateToProps(state) {
 	return {
 		currentTrack: state.playback.currentTrack,
-		media: state.media.mediaFiles
+		media: state.media.mediaFiles,
+		theme: state.settings.theme
 	};
 }
 
-export default connect(mapStateToProps, actions)(SearchScreen);
+export default connect(
+	mapStateToProps,
+	actions
+)(SearchScreen);
 
 const Wrapper = styled.View`
 	flex: 1;

diff --git a/src/screens/ShowContentScreen.js b/src/screens/ShowContentScreen.js
@@ -23,6 +23,7 @@ function ShowFolderScreen(props) {
 				renderItem={({ item }) => <RenderTrack item={item} setOptions={setModal} />}
 				data={props.route.params.content}
 				getItemLayout={flatListItemLayout}
+				indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 			/>
 			<OptionsModal
 				selectedTrack={modal.item}
@@ -34,7 +35,10 @@ function ShowFolderScreen(props) {
 }
 
 function mapStateToProps(state) {
-	return { currentTrack: state.playback.currentTrack };
+	return {
+		currentTrack: state.playback.currentTrack,
+		theme: state.settings.theme
+	};
 }
 
 export default connect(

diff --git a/src/screens/ShowPlaylistScreen.js b/src/screens/ShowPlaylistScreen.js
@@ -25,6 +25,7 @@ function ShowPlaylistScreen(props) {
 				keyExtractor={(asset) => asset.id.toString()}
 				renderItem={({ item }) => <RenderTrack item={item} setOptions={setModal} />}
 				getItemLayout={flatListItemLayout}
+				indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 			/>
 			<OptionsModal
 				selectedTrack={modal.item}
@@ -41,7 +42,10 @@ function ShowPlaylistScreen(props) {
 }
 
 function mapStateToProps(state) {
-	return { currentTrack: state.playback.currentTrack };
+	return {
+		currentTrack: state.playback.currentTrack,
+		theme: state.settings.theme
+	};
 }
 
 export default connect(

diff --git a/src/screens/TracksScreen.js b/src/screens/TracksScreen.js
@@ -63,6 +63,7 @@ function TracksScreen(props) {
 						scrollEventThrottle={16}
 						contentContainerStyle={styles.flatlistContent}
 						initialScrollIndex={currentTrack.index || undefined}
+						indicatorStyle={props.theme === 'dark' ? 'white' : 'black'}
 					/>
 					<OptionsModal
 						selectedTrack={modal.item}
@@ -88,7 +89,8 @@ function mapStateToProps(state) {
 	return {
 		currentTrack: state.playback.currentTrack,
 		media: state.media.mediaFiles,
-		mediaLoaded: state.media.mediaLoaded
+		mediaLoaded: state.media.mediaLoaded,
+		theme: state.settings.theme
 	};
 }