import { PanelBody, PanelRow } from '@wordpress/components';
import Fields from "./Fields";
import { useEntityProp } from '@wordpress/core-data';

const Section = ({id, name, fields, meta, setMeta, isOpen = false}) => {

	id = 'jvb-section-'+id;
	const setField = (name, value) => setMeta({ ...meta, [name]: value });
	return (
		<PanelBody name={id} title={name} initialOpen={isOpen}>
			{
				fields.map((field) => {
					return <Fields
						key={field.name}
						field={field}
						value={meta?.[field.name]}
						onChange={(value) => setField(field.name, value)}
						meta={meta}
					/>;
				})
			}
		</PanelBody>
	);
}

export default Section;