import { IMAGE_ROOT } from '@/shared/constants/common';
import { AlarmItem  } from './alarm-item';
import { AlarmItemProps } from '../model/types';


export const AlarmList = () => {

  const alarmItems: Array<AlarmItemProps> = [
    {title: '시스템 안정화를 위한 정기 점검이 예정되어 있습니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '가맹점 관리 메뉴에 거래내역 엑셀 다운로드 기능이 추가 되었습니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '신규 가맹점을 대상으로 거래수수료 인하 혜택을 12월까지 제공합니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '앱의 안정성과 사용성을 개선한 버전 2.3.1이 출시되었습니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '점검 시간 동안 일부 서비스 이용이 제한될 수 있으니 미리 확인해주세요.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '가맹점 관리 메뉴에 거래내역 엑셀 다운로드 기능이 추가 되었습니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '신규 가맹점을 대상으로 거래수수료 인하 혜택을 12월까지 제공합니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '앱의 안정성과 사용성을 개선한 버전 2.3.1이 출시되었습니다.', category: '공지사항', date: '2025.06.01 10:00:00'},
    {title: '점검 시간 동안 일부 서비스 이용이 제한될 수 있으니 미리 확인해주세요.', category: '공지사항', date: '2025.06.01 10:00:00'},
  ];
  const getAlarmItems = () => {
    let rs = [];
    for(let i=0;i<alarmItems.length;i++){
      rs.push(
        <AlarmItem
          title={ alarmItems[i]?.title }
          category={ alarmItems[i]?.category }
          date={ alarmItems[i]?.date }
        ></AlarmItem>
      )
    }
    return rs;
  };
  return (
    <>
      <div className="notice-box sub">
        { getAlarmItems() }
      </div>
      <div className="notice-alert">※ 알림은 90일간 보관 후 삭제됩니다.</div>
    </>
  );
};