fix: moving nested arrays now properly persists row count

payloadcms · Mar 24, 2021 · 5f9a5c8 · 5f9a5c8
1 parent 39000bd
commit 5f9a5c8
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 8 deletions.
diff --git a/src/admin/components/forms/field-types/Array/Array.tsx b/src/admin/components/forms/field-types/Array/Array.tsx
@@ -10,7 +10,6 @@ import buildStateFromSchema from '../../Form/buildStateFromSchema';
 import useFieldType from '../../useFieldType';
 import Error from '../../Error';
 import { array } from '../../../../../fields/validations';
-import getDataByPath from '../../Form/getDataByPath';
 import Banner from '../../../elements/Banner';
 import { Props, RenderArrayProps } from './types';
 
@@ -40,7 +39,7 @@ const ArrayFieldType: React.FC<Props> = (props) => {
   } = props;
 
   const [rows, dispatchRows] = useReducer(reducer, []);
-  const { initialState, dispatchFields } = useForm();
+  const { getDataByPath, dispatchFields } = useForm();
 
   const path = pathFromProps || name;
 
@@ -88,9 +87,9 @@ const ArrayFieldType: React.FC<Props> = (props) => {
   }, [moveRow]);
 
   useEffect(() => {
-    const data = getDataByPath(initialState, path);
+    const data = getDataByPath(path);
     dispatchRows({ type: 'SET_ALL', data: data || [] });
-  }, [initialState, path]);
+  }, [getDataByPath, path]);
 
   useEffect(() => {
     setValue(rows?.length || 0);

diff --git a/src/admin/components/forms/field-types/Blocks/Blocks.tsx b/src/admin/components/forms/field-types/Blocks/Blocks.tsx
@@ -14,7 +14,6 @@ import useFieldType from '../../useFieldType';
 import Popup from '../../../elements/Popup';
 import BlockSelector from './BlockSelector';
 import { blocks as blocksValidator } from '../../../../../fields/validations';
-import getDataByPath from '../../Form/getDataByPath';
 import Banner from '../../../elements/Banner';
 import { Props, RenderBlockProps } from './types';
 
@@ -48,7 +47,7 @@ const Blocks: React.FC<Props> = (props) => {
   const path = pathFromProps || name;
 
   const [rows, dispatchRows] = useReducer(reducer, []);
-  const { initialState, dispatchFields } = useForm();
+  const { getDataByPath, dispatchFields } = useForm();
 
   const memoizedValidate = useCallback((value) => {
     const validationResult = validate(
@@ -107,9 +106,9 @@ const Blocks: React.FC<Props> = (props) => {
   }, [moveRow]);
 
   useEffect(() => {
-    const data = getDataByPath(initialState, path);
+    const data = getDataByPath(path);
     dispatchRows({ type: 'SET_ALL', data: data || [] });
-  }, [initialState, path]);
+  }, [getDataByPath, path]);
 
   useEffect(() => {
     setValue(rows?.length || 0);

diff --git a/src/admin/components/forms/field-types/rowReducer.tsx b/src/admin/components/forms/field-types/rowReducer.tsx
@@ -54,6 +54,7 @@ const reducer = (currentState, action) => {
       const movingRowState = { ...stateCopy[moveFromIndex] };
       stateCopy.splice(moveFromIndex, 1);
       stateCopy.splice(moveToIndex, 0, movingRowState);
+
       return stateCopy;
     }