[Dashboard] Remove Drawer from LazyMint form (#5264)

## Problem solved

Short description of the bug fixed or feature added

<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on refactoring the `NFTLazyMintButton` and `LazyMintNftForm` components to replace the `Drawer` UI component with a `Sheet` component for a better user interface experience during the NFT minting process.

### Detailed summary
- Replaced `Drawer` with `Sheet` in `NFTLazyMintButton`.
- Added `SheetTrigger` and `SheetContent` to manage the button and form display.
- Introduced `setOpen` state in `NFTLazyMintButton` to control the `Sheet`.
- Modified `LazyMintNftForm` to accept `setOpen` prop for closing the `Sheet`.
- Updated success and error handling with `toast` notifications instead of modal context.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

Author: kien-ngo

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/nfts/components/lazy-mint-button.tsx

@@ -1,9 +1,16 @@
 "use client";
+import {
+  Sheet,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from "@/components/ui/sheet";
 import { MinterOnly } from "@3rdweb-sdk/react/components/roles/minter-only";
-import { useDisclosure } from "@chakra-ui/react";
 import { PlusIcon } from "lucide-react";
+import { useState } from "react";
 import type { ThirdwebContract } from "thirdweb";
-import { Button, Drawer } from "tw-components";
+import { Button } from "tw-components";
 import { LazyMintNftForm } from "./lazy-mint-form";
 
 interface NFTLazyMintButtonProps {
@@ -16,26 +23,30 @@ export const NFTLazyMintButton: React.FC<NFTLazyMintButtonProps> = ({
   isErc721,
   ...restButtonProps
 }) => {
-  const { isOpen, onOpen, onClose } = useDisclosure();
+  const [open, setOpen] = useState(false);
   return (
     <MinterOnly contract={contract}>
-      <Drawer
-        allowPinchZoom
-        preserveScrollBarGap
-        size="lg"
-        onClose={onClose}
-        isOpen={isOpen}
-      >
-        <LazyMintNftForm contract={contract} isErc721={isErc721} />
-      </Drawer>
-      <Button
-        colorScheme="primary"
-        leftIcon={<PlusIcon className="size-5" />}
-        {...restButtonProps}
-        onClick={onOpen}
-      >
-        Single Upload
-      </Button>
+      <Sheet open={open} onOpenChange={setOpen}>
+        <SheetTrigger asChild>
+          <Button
+            colorScheme="primary"
+            leftIcon={<PlusIcon className="size-5" />}
+            {...restButtonProps}
+          >
+            Single Upload
+          </Button>
+        </SheetTrigger>
+        <SheetContent className="w-full overflow-y-auto sm:min-w-[540px] lg:min-w-[700px]">
+          <SheetHeader>
+            <SheetTitle className="text-left">Mint NFT</SheetTitle>
+          </SheetHeader>
+          <LazyMintNftForm
+            contract={contract}
+            isErc721={isErc721}
+            setOpen={setOpen}
+          />
+        </SheetContent>
+      </Sheet>
     </MinterOnly>
   );
 };