Merge pull request #2987 from StoDevX/android-tableview-sections

Fix up the background color of Section on Android

Author: hawkrives

modules/tableview/index.js

@@ -1,4 +1,26 @@
 // @flow
 
+import * as React from 'react'
+import {Platform} from 'react-native'
+import {androidLightBackground} from '@frogpond/colors'
+
+import {
+	TableView,
+	Section as IosSection,
+	Cell,
+} from 'react-native-tableview-simple'
+
 export * from './cells'
-export {TableView, Section, Cell} from 'react-native-tableview-simple'
+
+let AndroidSection = props => (
+	<IosSection sectionTintColor={androidLightBackground} {...props} />
+)
+let Section
+
+if (Platform.OS === 'android') {
+	Section = AndroidSection
+} else {
+	Section = IosSection
+}
+
+export {TableView, Section, Cell}

source/views/settings/screens/overview/login-credentials.js

@@ -13,7 +13,6 @@ import {
 import {type ReduxState} from '../../../../redux'
 import {connect} from 'react-redux'
 import noop from 'lodash/noop'
-import {sectionBgColor} from '@frogpond/colors'
 
 type ReduxStateProps = {
 	initialUsername: string,
@@ -72,7 +71,6 @@ class CredentialsLoginSection extends React.Component<Props, State> {
 			<Section
 				footer="St. Olaf login enables the &quot;meals remaining&quot; feature."
 				header="ST. OLAF LOGIN"
-				sectionTintColor={sectionBgColor}
 			>
 				{loggedIn ? (
 					<Cell title={`Logged in as ${username}.`} />

source/views/settings/screens/overview/miscellany.js

@@ -4,7 +4,6 @@ import {Section, PushButtonCell} from '@frogpond/tableview'
 import {type NavigationScreenProp} from 'react-navigation'
 import {trackedOpenUrl} from '@frogpond/open-url'
 import * as Icons from '@hawkrives/react-native-alternate-icons'
-import {sectionBgColor} from '@frogpond/colors'
 import {GH_BASE_URL} from '../../../../lib/constants'
 
 type Props = {navigation: NavigationScreenProp<*>}
@@ -40,7 +39,7 @@ export class MiscellanySection extends React.Component<Props, State> {
 
 	render() {
 		return (
-			<Section header="MISCELLANY" sectionTintColor={sectionBgColor}>
+			<Section header="MISCELLANY">
 				{this.state.canChangeIcon ? (
 					<PushButtonCell
 						onPress={this.onAppIconButton}

source/views/settings/screens/overview/odds-and-ends.js

@@ -5,7 +5,6 @@ import {appVersion, appBuild} from '@frogpond/constants'
 import {setFeedbackStatus} from '../../../../redux/parts/settings'
 import type {ReduxState} from '../../../../redux'
 import {connect} from 'react-redux'
-import {sectionBgColor} from '@frogpond/colors'
 
 type Props = {}
 
@@ -15,7 +14,7 @@ export class OddsAndEndsSection extends React.Component<Props> {
 		let build = appBuild()
 
 		return (
-			<Section header="ODDS &amp; ENDS" sectionTintColor={sectionBgColor}>
+			<Section header="ODDS &amp; ENDS">
 				<Cell cellStyle="RightDetail" detail={version} title="Version" />
 				{build && (
 					<Cell cellStyle="RightDetail" detail={build} title="Build Number" />

source/views/settings/screens/overview/support.js

@@ -7,7 +7,6 @@ import {sendEmail} from '../../../../components/send-email'
 import DeviceInfo from 'react-native-device-info'
 import {appVersion, appBuild} from '@frogpond/constants'
 import {refreshApp} from '../../../../lib/refresh'
-import {sectionBgColor} from '@frogpond/colors'
 
 type Props = {navigation: NavigationScreenProp<*>}
 
@@ -52,7 +51,7 @@ export class SupportSection extends React.Component<Props> {
 
 	render() {
 		return (
-			<Section header="SUPPORT" sectionTintColor={sectionBgColor}>
+			<Section header="SUPPORT">
 				<PushButtonCell onPress={openEmail} title="Contact Us" />
 				<PushButtonCell onPress={this.onFaqButton} title="FAQs" />
 				<PushButtonCell onPress={this.onResetButton} title="Reset Everything" />