import { Stack, Text } from '@mantine/core';
import { stackClasses } from 'styles';

export function ToastError({ err }: { err: any }) {
	const errorResponse = JSON.parse(err.message);
	return (
		<Stack className={stackClasses.VStack} style={{ alignItems: 'flex-start' }}>
			<Text>
				Status: {errorResponse.status} {errorResponse.statusText}
			</Text>
			<Text>Details: {errorResponse.msg}</Text>
			{errorResponse.loc && <Text>Location: {errorResponse.loc}</Text>}
			{errorResponse.type && <Text>Type: {errorResponse.type}</Text>}
		</Stack>
	);
}