Alert1

1import { Alert, AlertDescription, AlertTitle } from "@/ui/alert";
2import { DangerTriangle, InfoCircle } from "@mynaui/icons-react";
3 
4export default function Alert1() {
5  return (
6    <>
7      <Alert>
8        <InfoCircle className="size-4" />
9        <AlertTitle>You have a new invoice due.</AlertTitle>
10        <AlertDescription>
11          This is the alert description that shows some information.
12        </AlertDescription>
13      </Alert>
14      <Alert variant="destructive">
15        <DangerTriangle className="size-4" />
16        <AlertTitle>Something went wrong with your submission.</AlertTitle>
17        <AlertDescription>
18          Please check your connection and try again. If the problem persists,
19          contact support.
20        </AlertDescription>
21      </Alert>
22    </>
23  );
24}