import { View } from 'react-native';
import Icon from '~/components/atoms/Icon';

export const TabBarIcon = (props: {
	name: string;
	color: string;
	focused?: boolean;
	size?: number;
}) => {
	// If focused, use the filled version of the icon by removing '-outline' suffix
	const iconName = props.focused ? props.name.replace('-outline', '') : props.name;

	return (
		<View className="mb-[-3px]">
			<Icon name={iconName} size={props.size || 28} color={props.color} />
		</View>
	);
};
