diff --git a/src/client/components/controls/Button/index.js b/src/client/components/controls/Button/index.js
index 5371540f34..aa491b667d 100644
--- a/src/client/components/controls/Button/index.js
+++ b/src/client/components/controls/Button/index.js
@@ -25,7 +25,7 @@ class Button extends Component {
...this.props,
className: classes,
onClick: this.props.onClick,
- disabled: this.props.disabled
+ disabled: this.props.disabled,
};
}
@@ -33,14 +33,20 @@ class Button extends Component {
switch (this.props.el) {
case 'link':
return (
-
+
{this.props.children}
);
case 'anchor':
return (
-
+
{this.props.children}
);
diff --git a/src/client/components/forms/Form/index.js b/src/client/components/forms/Form/index.js
index aa153cdb77..9b3ae0e2cf 100644
--- a/src/client/components/forms/Form/index.js
+++ b/src/client/components/forms/Form/index.js
@@ -1,4 +1,4 @@
-import React, { useState, useReducer, useCallback } from 'react';
+import React, { useState, useReducer } from 'react';
import { useHistory } from 'react-router-dom';
import PropTypes from 'prop-types';
import flatten, { unflatten } from 'flat';
@@ -18,14 +18,20 @@ const reduceToFieldNames = fields => fields.reduce((acc, field) => {
}, []);
const reindexRows = ({
- fieldName, fields, rowFieldNamesAsArray, totalRows, index: adjustmentIndex, type,
+ fieldName, fields, rowFieldNamesAsArray, totalRows, index: adjustmentIndex, adjustmentType,
}) => {
return Array.from(Array(totalRows).keys()).reduce((reindexedRows, _, rowIndex) => {
const currentRow = rowFieldNamesAsArray.reduce((fieldAcc, rowFieldName) => {
let newIndex;
- switch (type) {
+ const defaultFieldValues = {
+ value: null,
+ valid: true,
+ };
+
+ switch (adjustmentType) {
case 'addAfter':
newIndex = rowIndex <= adjustmentIndex ? rowIndex : rowIndex + 1;
+
if (rowIndex === adjustmentIndex) {
return {
...fieldAcc,
@@ -38,12 +44,12 @@ const reindexRows = ({
};
case 'remove':
- if (rowIndex === adjustmentIndex) return { ...fieldAcc };
+ if (rowIndex === adjustmentIndex) return fieldAcc;
newIndex = rowIndex < adjustmentIndex ? rowIndex : rowIndex - 1;
return {
...fieldAcc,
- [`${fieldName}.${newIndex}.${rowFieldName}`]: fields[`${fieldName}.${rowIndex}.${rowFieldName}`],
+ [`${fieldName}.${newIndex}.${rowFieldName}`]: fields[`${fieldName}.${rowIndex}.${rowFieldName}`] || { ...defaultFieldValues },
};
default:
@@ -83,7 +89,7 @@ const Form = (props) => {
const { addStatus } = useStatusList();
function adjustRows({
- index, fieldName, fields: fieldsForInsert, totalRows, type,
+ index, fieldName, fields: fieldsForInsert, totalRows, adjustmentType,
}) {
const rowFieldNamesAsArray = reduceToFieldNames(fieldsForInsert);
const reindexedRows = reindexRows({
@@ -92,16 +98,20 @@ const Form = (props) => {
rowFieldNamesAsArray,
totalRows,
index,
- type,
+ adjustmentType,
});
const stateWithoutFields = { ...fields };
Array.from(Array(totalRows).keys()).forEach((rowIndex) => {
rowFieldNamesAsArray.forEach((rowFieldName) => { delete stateWithoutFields[`${fieldName}.${rowIndex}.${rowFieldName}`]; });
});
+ console.log({
+ ...stateWithoutFields,
+ ...reindexedRows,
+ });
dispatchFields({
- type,
+ type: 'replace',
value: {
...stateWithoutFields,
...reindexedRows,
diff --git a/src/client/components/forms/RenderFields/index.js b/src/client/components/forms/RenderFields/index.js
index 248e402182..a5c6e3ab45 100644
--- a/src/client/components/forms/RenderFields/index.js
+++ b/src/client/components/forms/RenderFields/index.js
@@ -1,4 +1,4 @@
-import React, { useState, useCallback } from 'react';
+import React from 'react';
import PropTypes from 'prop-types';
import fieldTypes from '../field-types';
diff --git a/src/client/components/forms/field-types/Repeater/index.js b/src/client/components/forms/field-types/Repeater/index.js
index 6de387b021..8014364593 100644
--- a/src/client/components/forms/field-types/Repeater/index.js
+++ b/src/client/components/forms/field-types/Repeater/index.js
@@ -8,7 +8,6 @@ import RepeatFieldButton from '../../../controls/RepeatFieldButton';
import Button from '../../../controls/Button';
import X from '../../../graphics/X';
-
import './index.scss';
const baseClass = 'field-repeater';
@@ -34,7 +33,7 @@ const Repeater = (props) => {
fieldName: name,
totalRows: internalRowCount,
fields,
- type: 'addAfter',
+ adjustmentType: 'addAfter',
});
}
@@ -45,7 +44,7 @@ const Repeater = (props) => {
fieldName: name,
totalRows: internalRowCount,
fields,
- type: 'remove',
+ adjustmentType: 'remove',
});
}
@@ -59,6 +58,10 @@ const Repeater = (props) => {
className="repeater"
>
+ {iterableInternalRowCount.length === 0
+ && (
+ addNewRow({ rowIndex: 0 })} />
+ )}
{iterableInternalRowCount.map((_, rowIndex) => {
return (