import '../../setup-fixture';

import { PopupManager } from '../../ui-kit/PopupManager/PopupManager';
import { OfficesAtmsMap } from './OfficesAtmsMap';
import { type OfficesAtmsMapContent } from './OfficesAtmsMapContent';

const OFFICE_MAP: OfficesAtmsMapContent = {
  data: {
    dataType: 'offices',
  },
};

const ATM_MAP: OfficesAtmsMapContent = {
  data: {
    dataType: 'atms',
    __html:
      '<p>' +
      'Держатели платежных карт Visa, MasterCard и МИР АО «Россельхозбанк» могут снимать без дополнительных комиссий наличные денежные средства в банкоматах банков-партнеров:' +
      '</p>',
    list: [
      { text: 'АО «Альфа-Банк»', image: { src: 'alphabank.svg', size: { width: 24, height: 24 } } },
      {
        text: 'ПАО «Промсвязьбанк»',
        image: { src: 'psbbank.svg', size: { width: 24, height: 24 } },
      },
      { text: 'ПАО «РОСБАНК»', image: { src: 'rosbank.svg', size: { width: 24, height: 24 } } },
      {
        text: 'АО «Райффайзенбанк»',
        image: { src: 'rayfbank.svg', size: { width: 24, height: 24 } },
      },
    ],
  },
};

export default {
  offices: (
    <div className="container grid grid-cols-12">
      <OfficesAtmsMap className="col-span-12" {...OFFICE_MAP} />
      <PopupManager />
    </div>
  ),
  atms: (
    <div className="container grid grid-cols-12">
      <OfficesAtmsMap className="col-span-12" {...ATM_MAP} />
      <PopupManager />
    </div>
  ),
};