import * as React from 'react' ; import PropTypes from 'prop-types' ; import get from 'lodash/get' ; import { makeStyles } from '@material-ui/core/styles' ; import Typography from '@material-ui/core/Typography' ; import classnames from 'classnames' ; import { useRecordContext } from 'ra-core' ; import sanitizeFieldRestProps from './sanitizeFieldRestProps' ; import { PublicFieldProps , InjectedFieldProps , fieldPropTypes } from './types' ; example const FileField = ( props ) => { const { className , classes : classesOverride , emptyText , source , title , src , target , download , ping , rel , ... rest } = props ; const record = useRecordContext ( props ) ; const sourceValue = get ( record , source ) ; const classes = useStyles ( props ) ; if ( ! sourceValue ) { return emptyText ? ( < Typography component = "span" variant = "body2" className = { className } { ... sanitizeFieldRestProps ( rest ) } > { emptyText } < /Typography>) : (<div className={classnames(classes.root, className)} {...sanitizeFieldRestProps(rest)}/ > ) ; } if ( Array . isArray ( sourceValue ) ) { return ( < ul className = { classnames ( classes . root , className ) } { ... sanitizeFieldRestProps ( rest ) } > { sourceValue . map ( ( file , index ) => { const fileTitleValue = get ( file , title ) || title ; const srcValue = get ( file , src ) || title ; return ( < li key = { index } > < a href = { srcValue } title = { fileTitleValue } target = { target } download = { download } ping = { ping } rel = { rel } > { fileTitleValue } < /a> < /li>); } ) } < /ul>); } const titleValue = get ( record , title ) || title ; return ( < div className = { classnames ( classes . root , className ) } { ... sanitizeFieldRestProps ( rest ) } > < a href = { sourceValue } title = { titleValue } target = { target } download = { download } ping = { ping } rel = { rel } > { titleValue } < /a> < /div>); } ; FileField . defaultProps = { addLabel : true , } ; const useStyles = makeStyles ( { root : { display : 'inline-block' } , } , { name : 'RaFileField' } ) ; export interface FileFieldProps extends PublicFieldProps , InjectedFieldProps { src ? : string ; title ? : string ; target ? : string ; download ? : boolean | string ; ping ? : string ; rel ? : string ; classes ? : object ; } FileField . propTypes = { ... fieldPropTypes , src : PropTypes . string , title : PropTypes . string , target : PropTypes . string , download : PropTypes . oneOfType ( [ PropTypes . bool , PropTypes . string ] ) , ping : PropTypes . string , rel : PropTypes . string , } ; export default FileField ;