import { Typography } from "@mui/material";
import { FC } from "react";
import { QuizMetricType } from "@model/quizSettings";
import { IntegrationButton } from "./IntegrationButton";

type PartnerItemProps = {
  setIsModalOpen: (value: boolean) => void;
  setCompanyName: (value: keyof typeof QuizMetricType) => void;
  logo?: JSX.Element;
  title?: string;
  name: string;
};

export const ServiceButton: FC<PartnerItemProps> = ({
  setIsModalOpen,
  logo,
  title,
  name,
  setCompanyName,
}) => {
  const handleClick = () => {
    setCompanyName(name as keyof typeof QuizMetricType);
    setIsModalOpen(true);
  };

  return (
    <IntegrationButton onClick={handleClick}>
      {logo && logo}
      <Typography
        sx={{
          fontSize: "18px",
          fontWeight: "400",
          marginLeft: "15px",
        }}
      >
        {title && title}
      </Typography>
    </IntegrationButton>
  );
}; 