import { ListDateGroup } from '../list-date-group';
import { AccountHolderAuthListProps } from '../../model/account-holder-auth/types';

export const AccountHolderAuthList = ({
  additionalServiceCategory,
  listItems,
  mid,
  setDetailData
}: AccountHolderAuthListProps) => {

  const getListDateGroup = () => {
    let rs = [];
    let date = '';
    let list = [];
    for (let i = 0; i < listItems.length; i++) {
      let items = listItems[i];
      if (!!items) {
        let requestDate = items?.requestDate;
        requestDate = requestDate?.substring(0, 8);
        if (!!requestDate) {
          if (i === 0) {
            date = requestDate;
          }
          if (date !== requestDate) {

            if (list.length > 0) {
              rs.push(
                <ListDateGroup
                  additionalServiceCategory={ additionalServiceCategory }
                  key={ date + '-' + i }
                  mid={ mid }
                  date={ date }
                  items={ list }
                  setDetailData={ setDetailData }
                ></ListDateGroup>
              );
            }
            date = requestDate;
            list = [];
          }
          list.push(items);
        }
      }
    }
    if (list.length > 0) {
      rs.push(
        <ListDateGroup
          additionalServiceCategory={ additionalServiceCategory }
          mid={ mid }
          key={ date + '-last' }
          date={ date }
          items={ list }
          setDetailData={ setDetailData }
        ></ListDateGroup>
      )
    }
    return rs;
  };

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