veza/apps/web/src/features/auth/components/AuthErrorMessage.tsx

32 lines
584 B
TypeScript

import { cn } from '@/lib/utils';
interface AuthErrorMessageProps {
message: string;
className?: string;
id?: string;
}
export function AuthErrorMessage({
message,
className,
id,
}: AuthErrorMessageProps) {
if (!message) {
return null;
}
return (
<div
id={id}
className={cn(
'p-3 rounded-lg bg-red-50 border border-red-200 dark:bg-red-900/20 dark:border-red-800',
className,
)}
role="alert"
aria-live="polite"
>
<p className="text-sm text-red-600 dark:text-red-400">{message}</p>
</div>
);
}