- updated version;

src/components/FormFieldRepeater/index.js

@@ -1,14 +1,14 @@
 import React, { useRef, useEffect, useState, useCallback } from 'react';
 import { classNames } from 'primereact/utils';
 import { __ } from '@wordpress/i18n';
-import { head, isEmpty, isNil } from 'ramda';
+import { head, isEmpty, isNil, pluck } from 'ramda';
+import { diff } from 'deep-object-diff';
 
 // components
 import { InputText } from 'primereact/inputtext';
 import { Button } from 'primereact/button';
 import { Menu } from 'primereact/menu';
 import { Dropdown } from 'primereact/dropdown';
-import { diff } from 'deep-object-diff';
 
 const FormFieldRepeater = ({
                                data,
@@ -39,7 +39,7 @@ const FormFieldRepeater = ({
                 setStateFieldData([...stateFieldData, { id: null, value: '', lookUpDataId: null }]);
             }
         }
-    ]
+    ];
 
     const removeItem = (index) => {
         const newData = stateFieldData.toSpliced(index, 1);
@@ -96,6 +96,11 @@ const FormFieldRepeater = ({
         if (!isEmpty(diffData)) {
             const storeFieldData = data ?? [];
             setStateFieldData(storeFieldData);
+            setStateOptionsData(prevState => {
+                const ids = pluck('id', storeFieldData)
+                const objectsToAdd = storeFieldData.filter(o => ids.includes(o.id));
+                return [...prevState, ...objectsToAdd];
+            });
         }
     }, [data]);
 
@@ -105,7 +110,7 @@ const FormFieldRepeater = ({
 
     useEffect(() => {
         setDataFn(fieldName, [...stateFieldData], { shouldValidate: true });
-    }, [stateFieldData])
+    }, [stateFieldData]);
 
     return (
         <div className={classNames(['appForm__field', 'formfieldrepeater'])}>