import React from "react";
import {
  Semantic,
  Modal,
  Button,
  ButtonType,
  Stack,
} from "@komi-app/creator-ui";
import { smartScheduleFindMoreURL } from "constants/dca";
import { useLocation } from "react-router-dom";

interface SmartScheduleEducationModalProps {
  visible: boolean;
  onSchedule: () => void;
  onDismiss: () => void;
}

export function SmartScheduleEducationModal({
  visible,
  onSchedule,
  onDismiss,
}: SmartScheduleEducationModalProps) {
  return (
    <Modal
      isOpen={visible}
      dismissible={false}
      heading="New rules for bulk sending introduced by Google and Yahoo"
      body={
        <Stack direction="column" spacing={1}>
          Due to new domain warming and email deliverability rules introduced by
          Google and Yahoo in February 2024, you might not be able to send to
          all your fans at once. If that&apos;s the case, we&apos;ll create a
          sending schedule for you.
          <Button
            type={ButtonType.LINK}
            size="xsmall"
            href={smartScheduleFindMoreURL}
            target="_blank"
            rel="noopener noreferrer"
            label="Find Out More"
          />
        </Stack>
      }
      buttons={[
        {
          semantic: Semantic.PRIMARY,
          label: "Schedule",
          onClick: () => onSchedule(),
        },
        {
          semantic: Semantic.SECONDARY,
          label: "Cancel",
          onClick: () => onDismiss(),
        },
      ]}
    />
  );
}
