Replace platform-specific icon usage with platformPrefixIconName helper

modules/filter/active-filter-button.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import type {FilterType} from './types'
 import {
 	Platform,
 	StyleProp,
 	StyleSheet,
 	Text,
@@ -11,6 +11,7 @@
 } from 'react-native'
 import Icon from 'react-native-vector-icons/Ionicons'
 import * as c from '@frogpond/colors'
+import {platformPrefixIconName} from '../icon/platform-prefix-icon-name'
 
 type Props<T extends object> = {
 	filter: FilterType<T>
@@ -25,11 +26,7 @@
 	onRemove,
 	style,
 }: Props<T>): JSX.Element {
-	let iconName = Platform.select({
-		ios: 'ios-close-circle',
-		android: 'md-close-circle',
-		default: '',
-	})
+	let iconName = platformPrefixIconName('close-circle')
 
 	let iconColor = c.label
 

modules/filter/filter-toolbar-button.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import {useRef, useState} from 'react'
 import {
 	Platform,
 	StyleProp,
 	StyleSheet,
 	Text,
@@ -13,6 +13,7 @@
 import {FilterPopover} from './filter-popover'
 import * as c from '@frogpond/colors'
 import {Touchable} from '@frogpond/touchable'
+import {platformPrefixIconName} from '../icon/platform-prefix-icon-name'
 
 const buttonStyles = StyleSheet.create({
 	button: {
@@ -35,11 +36,7 @@
 	},
 })
 
-const ICON_NAME = Platform.select({
-	ios: 'ios-chevron-down',
-	android: 'md-chevron-down',
-	default: '',
-})
+const ICON_NAME = platformPrefixIconName('chevron-down')
 
 type Props<T extends object> = {
 	filter: FilterType<T>

modules/food-menu/food-item-row.tsx

@@ -1,13 +1,14 @@
 import * as React from 'react'
 import {Platform, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'
 import {DietaryTags} from './dietary-tags'
 import {Column, Row} from '@frogpond/layout'
 import {Detail, ListRow, Title} from '@frogpond/lists'
 import type {MasterCorIconMapType, MenuItemType} from './types'
 import * as c from '@frogpond/colors'
 import Icon from 'react-native-vector-icons/Ionicons'
+import {platformPrefixIconName} from '../icon/platform-prefix-icon-name'
 
-const specialsIcon = Platform.OS === 'ios' ? 'ios-star' : 'md-star'
+const specialsIcon = platformPrefixIconName('star')
 
 type Props = {
 	corIcons: MasterCorIconMapType

modules/navigation-buttons/favorite.tsx

@@ -1,17 +1,17 @@
 import * as React from 'react'
 import {Platform} from 'react-native'
 import Icon from 'react-native-vector-icons/Ionicons'
 import {Touchable} from '@frogpond/touchable'
 import {rightButtonStyles as styles} from './styles'
+import {platformPrefixIconName} from '../icon/platform-prefix-icon-name'
 
 type Props = {
 	onFavorite: () => unknown
 	favorited: boolean
 }
 
-const filled = Platform.OS === 'ios' ? 'ios-heart' : 'md-heart'
-const outlined =
-	Platform.OS === 'ios' ? 'ios-heart-outline' : 'md-heart-outline'
+const filled = platformPrefixIconName('heart')
+const outlined = platformPrefixIconName('heart-outline')
 
 export function FavoriteButton(props: Props): JSX.Element {
 	const icon = props.favorited ? filled : outlined

modules/navigation-buttons/search.tsx

@@ -4,6 +4,7 @@ import Icon from 'react-native-vector-icons/Ionicons'
 import {Touchable} from '@frogpond/touchable'
 import {useTheme} from '@frogpond/app-theme'
 import {commonStyles, rightButtonStyles as styles} from './styles'
+import {platformPrefixIconName} from '../icon/platform-prefix-icon-name'
 
 type Props = {
 	onPress: () => void
@@ -27,9 +28,7 @@ export function SearchButton(props: Props): JSX.Element {
 				</Text>
 			) : (
 				<Icon
-					name={
-						Platform.OS === 'ios' ? 'ios-search-outline' : 'md-search-outline'
-					}
+					name={platformPrefixIconName('search-outline')}
 					style={styles.icon}
 				/>
 			)}

source/views/sis/balances-acknowledgement.tsx

@@ -12,6 +12,7 @@
 	acknowledgeAcknowledgement,
 	selectAcknowledgement,
 } from '../../redux/parts/settings'
+import {platformPrefixIconName} from '../../../modules/icon/platform-prefix-icon-name'
 
 let Paragraph = Platform.OS === 'android' ? AndroidP : IosP
 let Ack = Platform.OS === 'android' ? AndroidAck : IosAck
@@ -67,7 +68,7 @@
 
 const TitleLeftIcon: React.FC<{size: number; color: string}> = (props) => {
 	return (
-		<Icon name="md-warning" size={props.size} style={{color: props.color}} />
+		<Icon name={platformPrefixIconName('warning')} size={props.size} style={{color: props.color}} />
 	)
 }
 

source/views/stoprint/components/error.tsx

@@ -1,9 +1,10 @@
 import * as React from 'react'
 import {Platform, RefreshControl, ScrollView, StyleSheet} from 'react-native'
 import Icon from 'react-native-vector-icons/Ionicons'
 import {NoticeView} from '@frogpond/notice'
 import * as c from '@frogpond/colors'
 import {openEmail} from '../../settings/screens/overview/support'
+import {platformPrefixIconName} from '../../../../modules/icon/platform-prefix-icon-name'
 
 const ERROR_MESSAGE =
 	"Make sure you are connected to the St. Olaf Network via eduroam or the VPN. If you are, please report this so we can make sure it doesn't happen again."
@@ -15,11 +16,7 @@
 }
 
 export function StoPrintErrorView(props: Props): JSX.Element {
-	let iconName: string =
-		Platform.select({
-			ios: 'ios-bug',
-			android: 'md-bug',
-		}) ?? 'ios-bug'
+	let iconName: string = platformPrefixIconName('bug')
 
 	return (
 		<ScrollView

source/views/stoprint/components/notice.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import {
 	Platform,
 	RefreshControl,
 	ScrollView,
 	StyleSheet,
@@ -9,6 +9,7 @@
 import Icon from 'react-native-vector-icons/Ionicons'
 import {NoticeView} from '@frogpond/notice'
 import * as c from '@frogpond/colors'
+import {platformPrefixIconName} from '../../../../modules/icon/platform-prefix-icon-name'
 
 type Props = {
 	buttonText: string
@@ -23,7 +24,7 @@
 export const StoPrintNoticeView = (props: Props): React.ReactElement => {
 	let {buttonText, description, header, onPress, text, onRefresh, refreshing} =
 		props
-	let iconName = Platform.OS === 'ios' ? 'ios-print' : 'md-print'
+	let iconName = platformPrefixIconName('print')
 
 	return (
 		<ScrollView

source/views/streaming/radio/buttons.tsx

@@ -1,10 +1,11 @@
 import * as React from 'react'
 import {Platform, StyleSheet, Text, View} from 'react-native'
 import * as c from '@frogpond/colors'
 import type {Glyphs} from '@frogpond/icon'
 import {Icon} from '@frogpond/icon'
 import {Touchable} from '@frogpond/touchable'
 import {useTheme} from './theme'
+import {platformPrefixIconName} from '../../../../modules/icon/platform-prefix-icon-name'
 
 type ActionButtonProps = {
 	icon: Glyphs
@@ -36,7 +37,7 @@
 export function CallButton({onPress}: CallButtonProps): JSX.Element {
 	return (
 		<SmallActionButton
-			icon={Platform.OS === 'ios' ? 'ios-call' : 'md-call'}
+			icon={platformPrefixIconName('call')}
 			onPress={onPress}
 		/>
 	)
@@ -51,7 +52,7 @@
 }: ShowCalendarButtonProps): JSX.Element {
 	return (
 		<SmallActionButton
-			icon={Platform.OS === 'ios' ? 'ios-calendar' : 'md-calendar'}
+			icon={platformPrefixIconName('calendar')}
 			onPress={onPress}
 		/>
 	)

source/views/streaming/radio/controller.tsx

@@ -19,6 +19,7 @@
 import {openUrl} from '@frogpond/open-url'
 import {useNavigation} from '@react-navigation/native'
 import {RadioScheduleParamList} from '../../../navigation/types'
+import {platformPrefixIconName} from '../../../../modules/icon/platform-prefix-icon-name'
 
 // If you want to fix the inline player, switch to `true`
 const ALLOW_INLINE_PLAYER = false
@@ -34,23 +35,23 @@
 	const {state, onPlay, onPause, onLink} = props
 
 	if (!ALLOW_INLINE_PLAYER) {
-		return <ActionButton icon="ios-planet" onPress={onLink} text="Open" />
+		return <ActionButton icon={platformPrefixIconName('planet')} onPress={onLink} text="Open" />
 	}
 
 	switch (state) {
 		case 'paused':
-			return <ActionButton icon="ios-play" onPress={onPlay} text="Listen" />
+			return <ActionButton icon={platformPrefixIconName('play')} onPress={onPlay} text="Listen" />
 
 		case 'checking':
 			return (
 				<ActionButton icon="code-working" onPress={onPause} text="Starting" />
 			)
 
 		case 'playing':
-			return <ActionButton icon="ios-pause" onPress={onPlay} text="Pause" />
+			return <ActionButton icon={platformPrefixIconName('pause')} onPress={onPlay} text="Pause" />
 
 		default:
-			return <ActionButton icon="ios-bug" onPress={noop} text="Error" />
+			return <ActionButton icon={platformPrefixIconName('bug')} onPress={noop} text="Error" />
 	}
 }