fix(migration ra-ui-2.8.5): migrated field/

src/components/field/ArrayField.js

@@ -1,4 +1,4 @@
-import { Component, cloneElement } from 'react';
+import { Component, cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
 import get from 'lodash/get';
 import pure from 'recompose/pure';
@@ -111,7 +111,7 @@ export class ArrayField extends Component {
     } = this.props;
     const { ids, data } = this.state;
 
-    return cloneElement(children, {
+    return cloneElement(Children.only(children), {
       ids,
       data,
       isLoading: false,

src/components/field/BooleanField.js

@@ -4,6 +4,8 @@ import get from 'lodash/get';
 import pure from 'recompose/pure';
 import FalseIcon from '@material-ui/icons/Clear';
 import TrueIcon from '@material-ui/icons/Done';
+import compose from 'recompose/compose';
+import { translate } from 'ra-core';
 import styled from 'styled-components';
 
 
@@ -16,33 +18,69 @@ const BooleanTypography = styled.div`
     line-height: 1.46429em;
 `;
 
+const BooleanFieldLabel = styled.span`
+  // Move the text out of the flow of the container.
+  position: absolute;
+
+   // Reduce its height and width to just one pixel.
+  height: 1;
+  width: 1;
+
+   // Hide any overflowing elements or text.
+  overflow: hidden;
+
+   // Clip the box to zero pixels.
+  clip: rect(0, 0, 0, 0);
+
+   // Text won't wrap to a second line.
+  white-space: nowrap;
+`;
+
 export const BooleanField = ({
-  className, source, record = {}, ...rest
+  className,
+  classes,
+  source,
+  record = {},
+  translate,
+  valueLabelTrue,
+  valueLabelFalse,
+  ...rest
 }) => {
-  if (get(record, source) === false) {
+  const value = get(record, source);
+  let ariaLabel = value ? valueLabelTrue : valueLabelFalse;
+
+  if (!ariaLabel) {
+    ariaLabel = value === false
+      ? translate('ra.boolean.false')
+      : translate('ra.boolean.true');
+  }
+
+  if (value === false) {
     return (
       <BooleanTypography
         className={className}
         {...sanitizeRestProps(rest)}
       >
+        <BooleanFieldLabel>{ariaLabel}</BooleanFieldLabel>
         <FalseIcon />
       </BooleanTypography>
     );
   }
 
-  if (get(record, source) === true) {
+  if (value === true) {
     return (
       <BooleanTypography
         className={className}
         {...sanitizeRestProps(rest)}
       >
+        <BooleanFieldLabel>{ariaLabel}</BooleanFieldLabel>
         <TrueIcon />
       </BooleanTypography>
     );
   }
 
   return (
-    <span
+    <BooleanTypography
       className={className}
       {...sanitizeRestProps(rest)}
     />
@@ -59,9 +97,18 @@ BooleanField.propTypes = {
   record: PropTypes.object,
   sortBy: PropTypes.string,
   source: PropTypes.string.isRequired,
+  valueLabelTrue: PropTypes.string,
+  valueLabelFalse: PropTypes.string,
+};
+
+BooleanField.defaultProps = {
+  translate: x => x,
 };
 
-const PureBooleanField = pure(BooleanField);
+const PureBooleanField = compose(
+  pure,
+  translate
+)(BooleanField);
 
 PureBooleanField.defaultProps = {
   addLabel: true,

src/components/field/ReferenceArrayField.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Children } from 'react';
 import PropTypes from 'prop-types';
 import Progress from '@bootstrap-styled/v4/lib/Progress';
 import ProgressBar from '@bootstrap-styled/v4/lib/Progress/ProgressBar';
@@ -23,7 +23,7 @@ export const ReferenceArrayFieldView = ({
     );
   }
 
-  return React.cloneElement(children, {
+  return React.cloneElement(Children.only(children), {
     className,
     resource: reference,
     ids,

src/components/field/ReferenceField.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Children } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { ReferenceFieldController } from 'ra-core';
@@ -37,7 +37,7 @@ export const ReferenceFieldView = ({
         className={className}
         onClick={stopPropagation}
       >
-        {React.cloneElement(children, {
+        {React.cloneElement(Children.only(children), {
           className: classnames(
             children.props.className,
           ),
@@ -52,7 +52,7 @@ export const ReferenceFieldView = ({
     );
   }
 
-  return React.cloneElement(children, {
+  return React.cloneElement(Children.only(children), {
     record: referenceRecord,
     resource: reference,
     allowEmpty,

src/components/field/ReferenceManyField.js

@@ -1,4 +1,4 @@
-import React, { Fragment, cloneElement } from 'react';
+import React, { Fragment, cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
 import { ReferenceManyFieldController } from 'ra-core';
 
@@ -20,7 +20,7 @@ export const ReferenceManyFieldView = ({
   total,
 }) => (
   <Fragment>
-    {cloneElement(children, {
+    {cloneElement(Children.only(children), {
       className,
       resource: reference,
       ids,