Merge pull request #515 from creative-commoners/pulls/4.0/field-is-an…

…-only-child FIX TextCheckboxGroupField should passthrough if it has only one child
silverstripe · Nov 20, 2018 · b8698c6 · b8698c6
2 parents a0ec072 + 84ab525
commit b8698c6
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 15 deletions.
diff --git a/client/dist/js/bundle.js b/client/dist/js/bundle.js
diff --git a/client/src/components/TextCheckboxGroupField/TextCheckboxGroupField.js b/client/src/components/TextCheckboxGroupField/TextCheckboxGroupField.js
@@ -3,21 +3,27 @@ import { InputGroup, InputGroupAddon, InputGroupText } from 'reactstrap';
 import fieldHolder from 'components/FieldHolder/FieldHolder';
 
 const TextCheckboxGroupField = (props) => {
-    const { children } = props;
+  const { children } = props;
 
-    const childrenWithProps = React.Children.toArray(
-      React.Children.map(children, child =>
-        React.cloneElement(child, { noHolder: true })
-      )
-    );
-    return (
-      <InputGroup className="text-checkout-group-field">
-        {childrenWithProps[0]}
-        <InputGroupAddon addonType="append">
-          <InputGroupText>{childrenWithProps[1]}</InputGroupText>
-        </InputGroupAddon>
-      </InputGroup>
-    );
+  const childrenWithProps = React.Children.toArray(
+    React.Children.map(children, child =>
+      React.cloneElement(child, { noHolder: true })
+    )
+  );
+
+  // If the checkbox has been removed, just render the TextField on its own
+  if (childrenWithProps.length === 1) {
+    return childrenWithProps[0];
+  }
+
+  return (
+    <InputGroup className="text-checkout-group-field">
+      {childrenWithProps[0]}
+      <InputGroupAddon addonType="append">
+        <InputGroupText>{childrenWithProps[1]}</InputGroupText>
+      </InputGroupAddon>
+    </InputGroup>
+  );
 };
 
 export default fieldHolder(TextCheckboxGroupField);