import { SmsPaymentListProps } from '../../model/sms-payment/types';
import { ListDateGroup } from '../list-date-group';

export const SmsPaymentList = ({
    listItems,
    additionalServiceCategory,
    mid,
    onResendClick
}: SmsPaymentListProps) => {

  const getListDateGroup = () => {
    let rs = [];
    let date = '';
    let list = [];
    for (let i = 0; i < listItems.length; i++) {
      let items = listItems[i];
      if(!!items) {
        let sendDate = items?.sendDate;
        sendDate = sendDate?.substring(0, 8);
        if(!!sendDate) {
          if(i === 0) {
            date = sendDate;
          }
          if(date !== sendDate) {
            if(list.length > 0) {
              rs.push(
                <ListDateGroup
                onResendClick={onResendClick}
                additionalServiceCategory={additionalServiceCategory}
                key={ date + '-' + i}
                mid={mid}
                date={ date }
                items={ list }
                ></ListDateGroup>
              );
            }
            date = sendDate;
            list = [];
          }
          list.push(items);
        }
      }
    }
    if (list.length > 0) {
      rs.push(
        <ListDateGroup
          additionalServiceCategory={additionalServiceCategory}
          onResendClick={onResendClick}
          mid={mid}
          key={date + '-last'}
          date={date}
          items={list}
        ></ListDateGroup>
      );
    }
    return rs;
  };

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