import * as classNames from "classnames";
import * as React from "react";
import { Link, ILinkProps } from "../Link";

interface IAskProps {
  title: string;
  subtitle?: string;
  link?: ILinkProps;
  titleFirst?: boolean;
  subtitleFirst?: boolean;
  className?: string;
}

export const Ask = ({ titleFirst = false, subtitleFirst = false, title, subtitle, link, className }: IAskProps) => (
  <div className={classNames("ask", {
    [className]: className
  })}>
    {subtitleFirst && <h4 className="ask__subtitle">{subtitle}</h4>}
    <h3 className="ask__title">
      {titleFirst && title}
      <Link {...link} />
      {!titleFirst && title}
    </h3>
    {!subtitleFirst && <h4 className="ask__subtitle">{subtitle}</h4>}
  </div>
)