import React from 'react';

import ObjectListWidget from '@plone/volto/components/manage/Widgets/ObjectListWidget';

import messages from '../../messages';

const ItemSchema = ({ intl }) => {
  return {
    title: intl.formatMessage(messages.searchSection),
    addMessage: intl.formatMessage(messages.add, {
      type: intl.formatMessage(messages.searchSection),
    }),
    properties: {
      label: {
        title: intl.formatMessage(messages.searchSectionLabel),
      },
      section: {
        title: intl.formatMessage(messages.searchSection),
      },
      show_filter: {
        title: intl.formatMessage(messages.showFilter),
        type: 'boolean',
        default: true,
      },
    },
    fieldsets: [
      {
        id: 'default',
        title: 'History-Eintrag',
        fields: ['label', 'section', 'show_filter'],
      },
    ],
    required: [],
  };
};

const SearchSectionsWidget = (props) => {
  return (
    <ObjectListWidget
      schema={ItemSchema}
      {...props}
      value={props.value?.items || props.default?.items || []}
      onChange={(id, value) => props.onChange(id, { items: value })}
    />
  );
};

export default SearchSectionsWidget;