import contentPeopleData from './view.content-people.block-all.yml';
import contentPeopleTwig from './view.content-people.block-all.twig';
import './view.content-people.block-all.js';

import viewTwig from '@ui-views/view/component/view.twig';
import '@ui-views/view/component/view.js';
import viewGridTwig from '@ui-views/grid/component/grid.twig';
import '@ui-views/grid/component/grid.js';

import imgTwig from '@ui-base/img/_img.twig';

/**
 * Storybook Definition.
 */
export default {
  title: 'Views/Content People',
};

export const blockAll = (args) => {
  // Create deep copy of data and merge args.
  let data = JSON.parse(JSON.stringify(contentPeopleData ?? {}));
  data = Object.assign(data, args);

  return viewTwig({
    view_id: 'content-people',
    view_display_id: 'block-all',
    view_format: 'grid',
    view_columns: 3,
    view_rows: viewGridTwig({
      view_items: [{
        'content': [
          {
            'content': contentPeopleTwig({
              ...data,
              view_field_erm_headshot: imgTwig({ image_src: data.view_field_erm_headshot })
            }),
          },
          {
            'content': contentPeopleTwig({
              ...data,
              view_field_erm_headshot: imgTwig({ image_src: data.view_field_erm_headshot })
            }),
          }
        ],
      }],
    }),
  })
}
