2019-11-04 09:00:59 +01:00
|
|
|
import React, { memo, useState } from 'react';
|
|
|
|
|
import { get } from 'lodash';
|
2019-10-29 18:03:06 +01:00
|
|
|
import PropTypes from 'prop-types';
|
2019-11-04 09:00:59 +01:00
|
|
|
import useDataManager from '../../hooks/useDataManager';
|
|
|
|
|
import Button from './Button';
|
|
|
|
|
import Wrapper from './Wrapper';
|
2019-10-29 18:03:06 +01:00
|
|
|
|
|
|
|
|
const DynamicZone = ({ name }) => {
|
2019-11-04 09:00:59 +01:00
|
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
|
|
|
const { allLayoutData, layout } = useDataManager();
|
|
|
|
|
const dynamicZoneAvailableComponents = get(
|
|
|
|
|
layout,
|
|
|
|
|
['schema', 'attributes', name, 'components'],
|
|
|
|
|
[]
|
|
|
|
|
);
|
|
|
|
|
console.log({ allLayoutData, dynamicZoneAvailableComponents });
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
Dynamic components data here
|
|
|
|
|
<Wrapper>
|
|
|
|
|
<Button
|
|
|
|
|
isOpen={isOpen}
|
|
|
|
|
type="button"
|
|
|
|
|
onClick={() => setIsOpen(prev => !prev)}
|
|
|
|
|
>
|
|
|
|
|
X
|
|
|
|
|
</Button>
|
|
|
|
|
</Wrapper>
|
|
|
|
|
</>
|
|
|
|
|
);
|
2019-10-29 18:03:06 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
DynamicZone.propTypes = {
|
|
|
|
|
name: PropTypes.string.isRequired,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export { DynamicZone };
|
|
|
|
|
export default memo(DynamicZone);
|