import React from "react";
import styles from "../styles/account.module.css";
import { ContentCopy as ContentCopyIcon } from "@mui/icons-material";

interface AccountProfileCompanyProps {
  company: string;
  companyKey: string;
  commissionRate: number;
  onCopy: () => void;
}

const AccountProfileCompany: React.FC<AccountProfileCompanyProps> = ({
  company,
  companyKey,
  commissionRate,
  onCopy
}) => (
  <div className={styles.card}>
    <h3 className={styles.sectionTitle}>Рабочая информация</h3>
    <div className={styles.infoGrid}>
      <div>
        <label className={styles.label}>Компания</label>
        <div className={styles.value}>{company}</div>
      </div>
      <div>
        <label className={styles.label}>Код компании</label>
        <div className={styles.companyCodeRow}>
          <div className={styles.companyCodeBox}>{companyKey}</div>
          <button className={styles.copyButton} onClick={onCopy} title="Скопировать код компании">
            <ContentCopyIcon fontSize="small" />
          </button>
        </div>
      </div>
      <div>
        <label className={styles.label}>Процент комиссии</label>
        <div className={styles.commissionValue}>{commissionRate}%</div>
      </div>
    </div>
  </div>
);

export default AccountProfileCompany;