AdvancedRuleItem.js
2 years ago
AdvancedRuleModalItem.js
2 years ago
AdvancedRulesIsEmpty.js
2 years ago
AdvancedRulesList.js
2 years ago
AdvancedRulesModal.js
2 years ago
ChooseRelatedField.js
2 years ago
EditAdvancedRulesButton.js
2 years ago
EditRulesModalContext.js
2 years ago
HumanReadableRule.js
2 years ago
ValidationBlockMessage.js
2 years ago
ValidationMetaMessage.js
2 years ago
ValidationToggleGroup.js
2 years ago
AdvancedRulesModal.js
57 lines
| 1 | import useBlockAttributes from '../../blocks/hooks/useBlockAttributes'; |
| 2 | import useOnUpdateModal from '../../action-modal/hooks/useOnUpdateModal'; |
| 3 | import Repeater from '../../repeater/components/repeater'; |
| 4 | import RepeaterAddNew from '../../repeater/components/repeater.add.new'; |
| 5 | import AdvancedRuleModalItem from './AdvancedRuleModalItem'; |
| 6 | import RepeaterState from '../../repeater/components/repeater.state'; |
| 7 | import RepeaterHeadContext |
| 8 | from '../../repeater/context/repeater.custom.item.head'; |
| 9 | import humanReadableRule from '../helpers/humanReadableRule'; |
| 10 | |
| 11 | const { |
| 12 | useState, |
| 13 | } = wp.element; |
| 14 | const { |
| 15 | __, |
| 16 | } = wp.i18n; |
| 17 | |
| 18 | function AdvancedRulesModal() { |
| 19 | const [ attributes, setAttributes ] = useBlockAttributes(); |
| 20 | const [ current, setCurrent ] = useState( |
| 21 | () => attributes.validation?.rules ?? [], |
| 22 | ); |
| 23 | |
| 24 | useOnUpdateModal( () => { |
| 25 | setAttributes( prev => ( |
| 26 | { |
| 27 | ...prev, |
| 28 | validation: { |
| 29 | ...attributes.validation, |
| 30 | rules: current, |
| 31 | }, |
| 32 | } |
| 33 | ) ); |
| 34 | } ); |
| 35 | |
| 36 | return <RepeaterState state={ setCurrent }> |
| 37 | <RepeaterHeadContext.Provider value={ { |
| 38 | isSupported: () => true, |
| 39 | render: ( { currentItem } ) => <span |
| 40 | className={ 'repeater-item-title' } |
| 41 | dangerouslySetInnerHTML={ { |
| 42 | __html: humanReadableRule( currentItem ), |
| 43 | } } |
| 44 | /> |
| 45 | } }> |
| 46 | <Repeater items={ current }> |
| 47 | <AdvancedRuleModalItem/> |
| 48 | </Repeater> |
| 49 | </RepeaterHeadContext.Provider> |
| 50 | <RepeaterAddNew> |
| 51 | { __( 'Add Rule', 'jet-form-builder' ) } |
| 52 | </RepeaterAddNew> |
| 53 | </RepeaterState>; |
| 54 | |
| 55 | } |
| 56 | |
| 57 | export default AdvancedRulesModal; |