import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeaderCell,
  TableRow,
} from '@/components/ui/table';
import {
  formatAnswerStatusLabel,
  formatInquiryTypeLabel,
  formatOptionalValue,
  maskPhoneNumber,
  type BoardPost,
} from '@/lib/domain/board-post';
import { InquiryRowActions } from './inquiry-row-actions';

interface InquiryTableProps {
  items: BoardPost[];
  page: number;
  pageSize: number;
  totalCount: number;
}

const COLUMN_HEADERS = [
  '번호',
  '질문유형',
  '질문제목',
  '질문자명',
  '전화번호',
  '질문일',
  '상태',
  '답변일',
  '관리',
];

/**
 * 1:1문의 목록 테이블 — 시안 A_BOA_012 ②.
 *
 * **전화번호는 마스킹해서 표시한다**(사용자 확인 사항 — 시안의 `010-12**-**78`). 상세 팝업에서는
 * 답변을 위해 연락처를 확인해야 하므로 원본을 보여준다.
 *
 * "답변일"은 답변이 실제로 달린 경우에만 값이 있고 그 외에는 `-`다(시안 ② "답변일은 답변완료
 * 시에만 표시").
 */
export function InquiryTable({
  items,
  page,
  pageSize,
  totalCount,
}: InquiryTableProps) {
  const offset = (page - 1) * pageSize;

  return (
    <Table>
      <TableHead>
        <TableRow>
          {COLUMN_HEADERS.map((header) => (
            <TableHeaderCell key={header}>{header}</TableHeaderCell>
          ))}
        </TableRow>
      </TableHead>
      <TableBody>
        {items.map((post, index) => (
          <TableRow key={post.id}>
            <TableCell>{totalCount - offset - index}</TableCell>
            <TableCell>{formatInquiryTypeLabel(post.typeCode)}</TableCell>
            <TableCell>{formatOptionalValue(post.title)}</TableCell>
            <TableCell>{formatOptionalValue(post.authorName)}</TableCell>
            <TableCell>{maskPhoneNumber(post.authorPhoneNumber)}</TableCell>
            <TableCell>{formatOptionalValue(post.createdAt)}</TableCell>
            <TableCell>
              {formatAnswerStatusLabel(post.answerStatusCode)}
            </TableCell>
            <TableCell>{formatOptionalValue(post.answeredAt)}</TableCell>
            <TableCell>
              <InquiryRowActions post={post} />
            </TableCell>
          </TableRow>
        ))}
      </TableBody>
    </Table>
  );
}