import type React from 'react';
import { Card, Table, Tag } from 'antd';
import type { TableProps } from "antd";

interface CommitRecord {
  id: string;
  message: string;
  author: string;
  date: string;
  repository: string;
}

interface CommitHistoryProps {
  commits: CommitRecord[];
  loading?: boolean;
}


const CommitHistory: React.FC<CommitHistoryProps> = ({ commits, loading }) => {

  const columns: TableProps<CommitRecord>['columns'] = [
    {
      title: '提交信息',
      dataIndex: 'message',
      key: 'message',
      width: '40%',
    },
    {
      title: '作者',
      dataIndex: 'author',
      key: 'author',
      width: '15%',
    },
    {
      title: '日期',
      dataIndex: 'date',
      key: 'date',
      width: '20%',
      sorter: (a, b) => new Date(a.date).getTime() - new Date(b.date).getTime(),
    },
    {
      title: '仓库',
      dataIndex: 'repository',
      key: 'repository',
      width: '15%',
      render: (text: string) => <Tag color="blue">{text}</Tag>,
    },
  ];

  const filteredCommits = commits;

  return (
    <Card title="提交历史" className="commit-history">
      <Table
        columns={columns}
        dataSource={filteredCommits}
        rowKey="id"
        loading={loading}
        pagination={{ pageSize: 10 }}
      />
    </Card>
  );
};

export default CommitHistory;