import React from 'react';
import { useNavigation } from '@react-navigation/native';
import { useSafeAreaInsets } from 'react-native-safe-area-context';

import IconButton from '~/components/button/IconButton';
import size from '~/styles/size';

const BackButton = () => {
	const navigation = useNavigation();
	const insets = useSafeAreaInsets();

	return (
		<IconButton
			style={{
				position: 'absolute',
				top: insets.top,
				left: insets.left,
				padding: 20,
				zIndex: 2,
			}} onPress={() => navigation.goBack()}
			icon="chevron-left"
			size={size.icon.small}
			color="#fff"
		/>
	);
}

export default BackButton;