"use client";

import { useState } from "react";
import { Modal, ModalContent } from "@heroui/modal";
import AddProductReview from "./AddProductReview";
import { ReviewButton } from "@components/common/button/ReviewButton";


export default function ReviewAdd({
  productId,
}: {productId: string;}) {
  const [open, setOpen] = useState(false);

  return (
    <>
      <div>
          <ReviewButton setShowForm={setOpen} />
      </div>

      <Modal
        isOpen={open}
        onOpenChange={setOpen}
        backdrop="blur"
        size="4xl"
        hideCloseButton
        scrollBehavior="inside"
        placement="center"
        classNames={{
          wrapper: "z-[100] items-center justify-center",
          backdrop: "z-[99]",
          base: "bg-white/90 dark:bg-black/80 backdrop-blur-xl  rounded-xl mx-4",
        }}
      >
        <ModalContent className="p-0 border-none">
          {(onClose) => (
            <AddProductReview
              productId={productId}
              onClose={onClose}
            />
          )}
        </ModalContent>
      </Modal>
    </>
  );
}


