diff --git a/src/assets/scss/components/fieldsRepeater.scss b/src/assets/scss/components/fieldsRepeater.scss index 05b478a..54599fb 100644 --- a/src/assets/scss/components/fieldsRepeater.scss +++ b/src/assets/scss/components/fieldsRepeater.scss @@ -11,7 +11,9 @@ } .fieldsRepeater__heading { - + align-items: center; + display: flex; + justify-content: space-between; } .fieldsRepeater__fields { diff --git a/src/pages/DomandaEditPreInstructor/components/RepeaterFields/index.js b/src/pages/DomandaEditPreInstructor/components/RepeaterFields/index.js index 46b6708..e56ecdd 100644 --- a/src/pages/DomandaEditPreInstructor/components/RepeaterFields/index.js +++ b/src/pages/DomandaEditPreInstructor/components/RepeaterFields/index.js @@ -1,18 +1,19 @@ import React, { useMemo, useState, useEffect } from 'react'; import { klona } from 'klona'; import { useForm } from 'react-hook-form'; +import { isEmpty } from 'ramda'; +import { __ } from '@wordpress/i18n'; // tools import uniqid from '../../../../helpers/uniqid'; // components import FormField from '../../../../components/FormField'; -import { __ } from '@wordpress/i18n'; import { Button } from 'primereact/button'; const RepeaterFields = ({ sourceId, sourceName }) => { const [items, setItems] = useState([]); - const [chosen, setChosen] = useState({}); + const [chosen, setChosen] = useState(''); const [formInitialData, setFormInitialData] = useState({}); const { control, @@ -29,6 +30,7 @@ const RepeaterFields = ({ sourceId, sourceName }) => { }, [formInitialData]), mode: 'onChange' }); const watchName = watch('name'); + const watchFile = watch('file'); const onSubmit = () => { }; @@ -40,6 +42,9 @@ const RepeaterFields = ({ sourceId, sourceName }) => { } const addNew = () => { + setValue('name', ''); + setValue('file', {}); + trigger(); const uid = uniqid('f'); const newItem = { fieldId: uid, @@ -47,23 +52,49 @@ const RepeaterFields = ({ sourceId, sourceName }) => { file: {}, } setItems([...items, newItem]); - setChosen(newItem); + setChosen(uid); + trigger(); } useEffect(() => { - trigger(); - }, [chosen]); + const updatedItems = items.map((o) => { + return o.fieldId === chosen ? { + ...o, + name: watchName + } : o; + }) + setItems([...updatedItems]); + }, [watchName]); - console.log('items', items); + useEffect(() => { + const updatedItems = items.map((o) => { + return o.fieldId === chosen ? { + ...o, + file: watchFile + } : o; + }) + setItems([...updatedItems]); + }, [watchFile]); + + useEffect(() => { + console.log('items', items); + }, [items]); + + //console.log('items', items, chosen); return (