import { ActionButton } from "@/components/ui/ActionButton/ActionButton";
import Typography, {
  TypographyProps,
} from "@/components/ui/Typography/Typography";
import { cn } from "@/lib/utils";

interface StillHaveQuestionsProps
  extends Omit<React.ComponentProps<"div">, "title"> {
  title?: TypographyProps<"h3">;
  actionButton?: React.ComponentProps<typeof ActionButton>;
  contactButton?: React.ComponentProps<typeof ActionButton>;
}

export default function StillHaveQuestions({
  title,
  actionButton,
  contactButton,
  ...props
}: StillHaveQuestionsProps) {
  return (
    <div
      {...props}
      className={cn("w-full flex flex-col items-center gap-4", props.className)}
    >
      {title && (
        <Typography
          as="h3"
          font="inter"
          size="sm"
          {...title}
          className={cn("text-[#6B7280] leading-[20px]", title.className)}
        />
      )}
      {actionButton && (
        <ActionButton
          {...actionButton}
          className={cn(
            "text-[18px] font-inter font-medium",
            "rounded-[16px]",
            "animate-scale-pulse",
            actionButton.className
          )}
        />
      )}
      {contactButton && (
        <ActionButton
          {...contactButton}
          className={cn(
            "bg-transparent",
            "text-primary text-base font-inter font-medium",
            "py-3",
            "rounded-[16px]",
            contactButton.className
          )}
          variant="outline"
        >
          <svg
            width="17"
            height="16"
            viewBox="0 0 17 16"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M5.04688 11.5C5.875 11.5 6.54688 12.1719 6.54688 13V13.5L8.8125 11.8C9.07187 11.6062 9.3875 11.5 9.7125 11.5H14.0469C14.3219 11.5 14.5469 11.275 14.5469 11V2C14.5469 1.725 14.3219 1.5 14.0469 1.5H2.04688C1.77188 1.5 1.54688 1.725 1.54688 2V11C1.54688 11.275 1.77188 11.5 2.04688 11.5H5.04688ZM6.54688 15.375L6.54063 15.3813L6.38125 15.5L5.84688 15.9C5.69688 16.0125 5.49375 16.0312 5.32188 15.9469C5.15 15.8625 5.04688 15.6906 5.04688 15.5V14.8344V14.6344V14.625V14.5V13H3.54688H2.04688C0.94375 13 0.046875 12.1031 0.046875 11V2C0.046875 0.896875 0.94375 0 2.04688 0H14.0469C15.15 0 16.0469 0.896875 16.0469 2V11C16.0469 12.1031 15.15 13 14.0469 13H9.7125L6.54688 15.375Z"
              fill="#3B82F6"
            />
          </svg>
          {contactButton.children}
        </ActionButton>
      )}
    </div>
  );
}
