'use client';

import * as React from 'react';
import clsx from 'clsx';
import { BlueButton } from '@/components/BlueButton/BlueButton';

import styles from './cta.module.scss';

export default function CTA(props: {
  title?: string;
  subtitle?: string;
  button?: string;
  className?: string;
  extract?: JSX.Element;
}) {
  return (
    <div className={clsx(styles.buttonContainer, props.className)}>
      <h2>{props.title || '成为平凯星辰授权经销伙伴'}</h2>
      {props.subtitle && <h5>{props.subtitle}</h5>}
      <div className={styles.buttonGroup}>
        <a
          href="https://www.pingcap.cn/partner/compatibility_certification"
          target="_blank"
        >
          <BlueButton>{props.button || '申请加入'}</BlueButton>
        </a>
      </div>
    </div>
  );
}