diff --git a/packages/ra-ui-materialui/src/field/ArrayField.tsx b/packages/ra-ui-materialui/src/field/ArrayField.tsx index cb504b1762d..eb9d4f4f979 100644 --- a/packages/ra-ui-materialui/src/field/ArrayField.tsx +++ b/packages/ra-ui-materialui/src/field/ArrayField.tsx @@ -117,7 +117,7 @@ const getDataAndIds = ( * ); * TagsField.defaultProps = { addLabel: true }; */ -export const ArrayField = (props: ArrayFieldProps) => { +export const ArrayField = memo((props: ArrayFieldProps) => { const { addLabel, basePath, @@ -178,12 +178,13 @@ export const ArrayField = (props: ArrayFieldProps) => { })} ); -}; +}); +// @ts-ignore ArrayField.defaultProps = { addLabel: true, }; - +// @ts-ignore ArrayField.propTypes = { ...fieldPropTypes, fieldKey: PropTypes.string, @@ -201,4 +202,4 @@ interface State { ArrayField.displayName = 'ArrayField'; -export default memo(ArrayField); +export default ArrayField; diff --git a/packages/ra-ui-materialui/src/field/ChipField.tsx b/packages/ra-ui-materialui/src/field/ChipField.tsx index c2a5175fdbb..2f44723c8a8 100644 --- a/packages/ra-ui-materialui/src/field/ChipField.tsx +++ b/packages/ra-ui-materialui/src/field/ChipField.tsx @@ -17,7 +17,7 @@ const useStyles = makeStyles( { name: 'RaChipField' } ); -export const ChipField = (props: ChipFieldProps) => { +export const ChipField = memo((props: ChipFieldProps) => { const { className, classes: classesOverride, @@ -49,13 +49,15 @@ export const ChipField = (props: ChipFieldProps) => { {...sanitizeFieldRestProps(rest)} /> ); -}; +}); +// @ts-ignore ChipField.defaultProps = { addLabel: true, }; - +// @ts-ignore ChipField.propTypes = { + // @ts-ignore ...ChipField.propTypes, ...fieldPropTypes, }; @@ -65,4 +67,4 @@ export interface ChipFieldProps InjectedFieldProps, Omit {} -export default memo(ChipField); +export default ChipField; diff --git a/packages/ra-ui-materialui/src/field/DateField.tsx b/packages/ra-ui-materialui/src/field/DateField.tsx index 4217b78845e..5ab21f0359a 100644 --- a/packages/ra-ui-materialui/src/field/DateField.tsx +++ b/packages/ra-ui-materialui/src/field/DateField.tsx @@ -42,7 +42,7 @@ const toLocaleStringSupportsLocales = (() => { * // renders the record { id: 1234, new Date('2012-11-07') } as * mercredi 7 novembre 2012 */ -export const DateField = (props: DateFieldProps) => { +export const DateField = memo((props: DateFieldProps) => { const { className, emptyText, @@ -89,12 +89,13 @@ export const DateField = (props: DateFieldProps) => { {dateString} ); -}; +}); +// @ts-ignore DateField.defaultProps = { addLabel: true, }; - +// @ts-ignore DateField.propTypes = { // @ts-ignore ...Typography.propTypes, @@ -116,4 +117,4 @@ export interface DateFieldProps showTime?: boolean; } -export default memo(DateField); +export default DateField; diff --git a/packages/ra-ui-materialui/src/field/EmailField.tsx b/packages/ra-ui-materialui/src/field/EmailField.tsx index 24338e784da..cfb80be5864 100644 --- a/packages/ra-ui-materialui/src/field/EmailField.tsx +++ b/packages/ra-ui-materialui/src/field/EmailField.tsx @@ -11,7 +11,7 @@ import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; // useful to prevent click bubbling in a datagrid with rowClick const stopPropagation = e => e.stopPropagation(); -const EmailField = (props: EmailFieldProps) => { +const EmailField = memo((props: EmailFieldProps) => { const { className, source, emptyText, ...rest } = props; const record = useRecordContext(props); const value = get(record, source); @@ -39,12 +39,12 @@ const EmailField = (props: EmailFieldProps) => { {value} ); -}; - +}); +// @ts-ignore EmailField.defaultProps = { addLabel: true, }; - +// @ts-ignore EmailField.propTypes = fieldPropTypes; export interface EmailFieldProps @@ -52,4 +52,4 @@ export interface EmailFieldProps InjectedFieldProps, AnchorHTMLAttributes {} -export default memo(EmailField); +export default EmailField; diff --git a/packages/ra-ui-materialui/src/field/NumberField.tsx b/packages/ra-ui-materialui/src/field/NumberField.tsx index 2d72148aa0e..d82f9282758 100644 --- a/packages/ra-ui-materialui/src/field/NumberField.tsx +++ b/packages/ra-ui-materialui/src/field/NumberField.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { FC, memo } from 'react'; +import { memo } from 'react'; import PropTypes from 'prop-types'; import get from 'lodash/get'; import Typography, { TypographyProps } from '@material-ui/core/Typography'; @@ -42,58 +42,55 @@ const hasNumberFormat = !!( * // renders the record { id: 1234, price: 25.99 } as * 25,99 $US */ -export const NumberField: FC = memo( - props => { - const { - className, - emptyText, - source, - locales, - options, - textAlign, - ...rest - } = props; - const record = useRecordContext(props); - if (!record) { - return null; - } - const value = get(record, source); - if (value == null) { - return emptyText ? ( - - {emptyText} - - ) : null; - } - - return ( +export const NumberField = memo((props: NumberFieldProps) => { + const { + className, + emptyText, + source, + locales, + options, + textAlign, + ...rest + } = props; + const record = useRecordContext(props); + if (!record) { + return null; + } + const value = get(record, source); + if (value == null) { + return emptyText ? ( - {hasNumberFormat - ? value.toLocaleString(locales, options) - : value} + {emptyText} - ); + ) : null; } -); + + return ( + + {hasNumberFormat ? value.toLocaleString(locales, options) : value} + + ); +}); // what? TypeScript loses the displayName if we don't set it explicitly NumberField.displayName = 'NumberField'; +// @ts-ignore NumberField.defaultProps = { addLabel: true, textAlign: 'right', }; - +// @ts-ignore NumberField.propTypes = { // @ts-ignore ...Typography.propTypes, diff --git a/packages/ra-ui-materialui/src/field/SelectField.tsx b/packages/ra-ui-materialui/src/field/SelectField.tsx index efff2a4cc43..c3dda0b03d9 100644 --- a/packages/ra-ui-materialui/src/field/SelectField.tsx +++ b/packages/ra-ui-materialui/src/field/SelectField.tsx @@ -67,7 +67,7 @@ import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; * * **Tip**: sets `translateChoice` to false by default. */ -export const SelectField = (props: SelectFieldProps) => { +export const SelectField = memo((props: SelectFieldProps) => { const { className, emptyText, @@ -113,18 +113,19 @@ export const SelectField = (props: SelectFieldProps) => { {choiceText} ); -}; +}); +// @ts-ignore SelectField.defaultProps = { optionText: 'name', optionValue: 'id', translateChoice: true, }; - +// @ts-ignore SelectField.defaultProps = { addLabel: true, }; - +// @ts-ignore SelectField.propTypes = { // @ts-ignore ...Typography.propTypes, @@ -147,4 +148,4 @@ export interface SelectFieldProps SelectField.displayName = 'SelectField'; -export default memo(SelectField); +export default SelectField; diff --git a/packages/ra-ui-materialui/src/field/TextField.tsx b/packages/ra-ui-materialui/src/field/TextField.tsx index 2244b42e33d..e762c1e2257 100644 --- a/packages/ra-ui-materialui/src/field/TextField.tsx +++ b/packages/ra-ui-materialui/src/field/TextField.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { FC, memo, ElementType } from 'react'; +import { memo, ElementType } from 'react'; import get from 'lodash/get'; import Typography, { TypographyProps } from '@material-ui/core/Typography'; import { useRecordContext } from 'ra-core'; @@ -7,7 +7,7 @@ import { useRecordContext } from 'ra-core'; import sanitizeFieldRestProps from './sanitizeFieldRestProps'; import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; -const TextField: FC = memo(props => { +const TextField = memo((props: TextFieldProps) => { const { className, source, emptyText, ...rest } = props; const record = useRecordContext(props); const value = get(record, source); @@ -28,11 +28,11 @@ const TextField: FC = memo(props => { // what? TypeScript loses the displayName if we don't set it explicitly TextField.displayName = 'TextField'; - +// @ts-ignore TextField.defaultProps = { addLabel: true, }; - +// @ts-ignore TextField.propTypes = { // @ts-ignore ...Typography.propTypes, diff --git a/packages/ra-ui-materialui/src/field/UrlField.tsx b/packages/ra-ui-materialui/src/field/UrlField.tsx index b80f515415a..7dc6dc496e4 100644 --- a/packages/ra-ui-materialui/src/field/UrlField.tsx +++ b/packages/ra-ui-materialui/src/field/UrlField.tsx @@ -6,7 +6,7 @@ import { Typography, Link } from '@material-ui/core'; import { useRecordContext } from 'ra-core'; import { PublicFieldProps, InjectedFieldProps, fieldPropTypes } from './types'; -const UrlField = (props: UrlFieldProps) => { +const UrlField = memo((props: UrlFieldProps) => { const { className, emptyText, source, ...rest } = props; const record = useRecordContext(props); const value = get(record, source); @@ -33,12 +33,13 @@ const UrlField = (props: UrlFieldProps) => { {value} ); -}; +}); +// @ts-ignore UrlField.defaultProps = { addLabel: true, }; - +// @ts-ignore UrlField.propTypes = fieldPropTypes; UrlField.displayName = 'UrlField'; @@ -47,4 +48,4 @@ export interface UrlFieldProps InjectedFieldProps, AnchorHTMLAttributes {} -export default memo(UrlField); +export default UrlField;