Merge pull request #2191 from StoDevX/hawken-credits-custom-icon

Hawken's tweaks to the credits-custom-icon PR

Author: hawkrives

images/icon-images.js

@@ -1,6 +1,29 @@
 // @flow
 
 export const icons = {
-  oldMain: require('./about/IconTrans.png'),
-  windmill: require('../ios/AllAboutOlaf/windmill-icon/windmill.png'),
+	oldMain: require('./about/IconTrans.png'),
+	windmill: require('../ios/AllAboutOlaf/windmill-icon/windmill.png'),
+}
+
+export const defaultIcon = icons.oldMain
+
+// eslint-disable camelcase
+export const iosToNamedIconsMap: {[key: string]: $Keys<typeof icons>} = {
+	icon_type_windmill: 'windmill',
+	default: 'oldMain',
+}
+// eslint-enable camelcase
+
+export function lookup(iosIconName: $Keys<typeof iosToNamedIconsMap>): number {
+	const iconName = iosToNamedIconsMap[iosIconName]
+	if (!iconName) {
+		return defaultIcon
+	}
+
+	const icon = icons[iconName]
+	if (!icon) {
+		return defaultIcon
+	}
+
+	return icon
 }

source/views/components/logo.js

@@ -0,0 +1,38 @@
+// @flow
+
+import * as React from 'react'
+import * as Icons from '@hawkrives/react-native-alternate-icons'
+import glamorous from 'glamorous-native'
+
+import {lookup as getAppIcon} from '../../../images/icon-images'
+
+const LogoImage = glamorous.image({
+	width: 100,
+	height: 100,
+	alignSelf: 'center',
+})
+
+type Props = {
+	style?: StyleSheet,
+}
+
+type State = {
+	icon: number,
+}
+
+export class AppLogo extends React.Component<Props, State> {
+	state = {
+		icon: getAppIcon('default'),
+	}
+
+	async componentWillMount() {
+		const name = await Icons.getIconName()
+		console.warn(name)
+		this.setState(() => ({icon: getAppIcon(name)}))
+	}
+
+	render() {
+		console.warn(this.state.icon)
+		return <LogoImage source={this.state.icon} style={this.props.style} />
+	}
+}

source/views/settings/credits.js

@@ -5,23 +5,14 @@ import {data as credits} from '../../../docs/credits.json'
 import glamorous from 'glamorous-native'
 import {Platform} from 'react-native'
 import {iOSUIKit, material} from 'react-native-typography'
-
-import {icons as appIcons} from '../../../images/icon-images'
-import * as Icons from '@hawkrives/react-native-alternate-icons'
-import type {TopLevelViewPropsType} from '../types'
+import {AppLogo} from '../components/logo'
 
 const Container = glamorous.scrollView({
 	backgroundColor: c.white,
 	paddingHorizontal: 5,
 	paddingVertical: 10,
 })
 
-const Logo = glamorous.image({
-	width: 100,
-	height: 100,
-	alignSelf: 'center',
-})
-
 const Title = glamorous.text({
 	textAlign: 'center',
 	marginTop: 10,
@@ -58,49 +49,22 @@ const Contributors = glamorous(About)({
 
 const formatPeopleList = arr => arr.map(w => w.replace(' ', ' ')).join(' • ')
 
-type Props = TopLevelViewPropsType
-
-type State = {
-	iconType: null | string,
-}
-
-export default class CreditsView extends React.Component<Props, State> {
-	static navigationOptions = {
-		title: 'Credits',
-	}
+export default function CreditsView() {
+	return (
+		<Container contentInsetAdjustmentBehavior="automatic">
+			<AppLogo />
 
-	state = {
-		iconType: null,
-	}
+			<Title>{credits.name}</Title>
+			<About>{credits.content}</About>
 
-	componentWillMount() {
-		this.getIcon()
-	}
+			<Heading>Contributors</Heading>
+			<Contributors>{formatPeopleList(credits.contributors)}</Contributors>
 
-	getIcon = async () => {
-		const name = await Icons.getIconName()
-		this.setState(() => ({iconType: name}))
-	}
-
-	render() {
-		const image =
-			this.state.iconType === 'default' ? appIcons.oldMain : appIcons.windmill
-
-		return (
-			<Container contentInsetAdjustmentBehavior="automatic">
-				<Logo source={image} />
-
-				<Title>{credits.name}</Title>
-				<About>{credits.content}</About>
-
-				<Heading>Contributors</Heading>
-				<Contributors>{formatPeopleList(credits.contributors)}</Contributors>
-
-				<Heading>Acknowledgements</Heading>
-				<Contributors>
-					{formatPeopleList(credits.acknowledgements)}
-				</Contributors>
-			</Container>
-		)
-	}
+			<Heading>Acknowledgements</Heading>
+			<Contributors>{formatPeopleList(credits.acknowledgements)}</Contributors>
+		</Container>
+	)
+}
+CreditsView.navigationOptions = {
+	title: 'Credits',
 }