44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import { useRosettaColors } from "@/app/hooks/useRosettaColors";
|
|
import { useDialog } from "@/app/providers/DialogProvider/useDialog";
|
|
import { Menu } from "@mantine/core";
|
|
import { IconAlertCircle, IconRefresh, IconTrash } from "@tabler/icons-react";
|
|
|
|
interface MessageErrorProps {
|
|
text: string;
|
|
messageId: string;
|
|
}
|
|
|
|
export function MessageError(props : MessageErrorProps) {
|
|
const colors = useRosettaColors();
|
|
const {sendMessage, deleteMessageById} = useDialog();
|
|
|
|
const retry = async () => {
|
|
deleteMessageById(props.messageId);
|
|
sendMessage(props.text, []);
|
|
}
|
|
|
|
const remove = () => {
|
|
deleteMessageById(props.messageId);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Menu withArrow shadow="md" width={170}>
|
|
<Menu.Target>
|
|
<IconAlertCircle stroke={3} size={15} color={colors.error}></IconAlertCircle>
|
|
</Menu.Target>
|
|
<Menu.Dropdown>
|
|
{props.text.trim() != "" && <Menu.Item onClick={retry} leftSection={<IconRefresh size={14} />}>
|
|
Retry
|
|
</Menu.Item> }
|
|
<Menu.Item
|
|
color="red" onClick={remove}
|
|
leftSection={<IconTrash size={14} />}
|
|
>
|
|
Remove
|
|
</Menu.Item>
|
|
</Menu.Dropdown>
|
|
</Menu>
|
|
</>
|
|
);
|
|
} |