import { LinkPaymentPendingDateGroup } from './link-payment-pending-date-group';

interface LinkPaymentPendingTransaction {
  transactionId: string;
  customerName: string;
  status: string;
  channel: string;
  amount: number;
}

interface LinkPaymentPendingListProps {
  listItems: Record<string, LinkPaymentPendingTransaction[]>;
}

export const LinkPaymentPendingList = ({
  listItems
}: LinkPaymentPendingListProps) => {

  const getListDateGroup = () => {
    let rs = [];
    for (const [key, value] of Object.entries(listItems)) {
      rs.push(
        <LinkPaymentPendingDateGroup
          key={key}
          date={key}
          items={value}
        />
      );  
    }
    return rs;
  };

  return (
    <>
      <div className="transaction-list">
        {getListDateGroup()}
      </div>
    </>
  )
};