How to use the cozy-doctypes.Contact.getDisplayName function in cozy-doctypes

const ContactPicker = props => {
  const { placeholder, onChange, value, ...rest } = props
  const [showContactsList, setShowContactsList] = useState(false)

  const handleChange = contact => {
    onChange(contact)
  }

  return (
    <>
       setShowContactsList(true)}>
        {value ? Contact.getDisplayName(value) : placeholder}
      
      {showContactsList && (
         setShowContactsList(false)}
          onItemClick={handleChange}
        />
      )}
    
  )
}

return contacts.filter(contact => {
    const displayName = Contact.getDisplayName(contact)

    if (!displayName) {
      return false
    }

    return displayName.toLowerCase().includes(f)
  })
}