import { Button, Heading, Row, Section, Text } from "@react-email/components";
import Base from "./base";
export type PagamentoConferma_NewMail = {
  mailType: "pagamentoConferma";
  props: PagamentoConfermaProps;
};

type PagamentoConfermaProps = {
  receiptHref: string;
};

const PagamentoConferma = ({ receiptHref }: PagamentoConfermaProps) => {
  return (
    <Base preview="Conferma Pagamento">
      <>
        <Heading className="text-center text-3xl leading-8">
          Conferma Pagamento
        </Heading>
        <Section className="px-5 text-left text-base md:px-12">
          <Row>
            <Text>
              Gentile Cliente, la informiamo che il pagamento è stato confermato
              con successo. Procederemo ad attivare i servizi acquistati se non
              lo fossero già. Può controllare lo stato del suo account nella
              sezione dedicata.
            </Text>
          </Row>
          <Section className="mb-5">
            <Button
              className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
              href={receiptHref}
            >
              Vai al tuo account
            </Button>
          </Section>
        </Section>
      </>
    </Base>
  );
};

export default PagamentoConferma;