Dialog

import { useState } from "react";

import {
  Button,
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
  DialogTrigger,
} from "@backend-ai/ui/components";

const DialogExample = () => {
  const [isOpen, setIsOpen] = useState<boolean>(false);
  return (
    <Dialog open={isOpen} onOpenChange={setIsOpen}>
      <DialogTrigger asChild>
        <Button variant="outline">Open Dialog</Button>
      </DialogTrigger>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>Dialog Example</DialogTitle>
          <DialogDescription>
            A nice dialog description to show some information about the dialog
            content.
          </DialogDescription>
        </DialogHeader>
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc eu
          ultricies ante. Curabitur bibendum semper risus, ut ultricies nisl
          fermentum et. Duis ut dui ac arcu pharetra fermentum. Nullam vitae
          placerat metus. Suspendisse potenti. Etiam at leo in ex fringilla.
        </p>
        <DialogFooter>
          <Button onClick={() => setIsOpen(false)}>Save</Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
};

export default DialogExample;