import { StyleSheet } from 'react-native';
import { SFSymbol } from './ui/SFSymbol';

interface TabBarIconProps {
	sfSymbol: string;
	fallbackIcon: string;
	color: string;
}

export const TabBarIcon = ({ sfSymbol, fallbackIcon, color }: TabBarIconProps) => {
	return (
		<SFSymbol
			name={sfSymbol}
			fallbackIcon={fallbackIcon as any}
			color={color}
			size={24}
			style={styles.tabBarIcon}
		/>
	);
};

export const styles = StyleSheet.create({
	tabBarIcon: {
		marginBottom: -3,
	},
});