Be able of browsing phone contact list when creating a new person

[Doreapp]

When creating a new person, be able of opening the contact list of the phone (device) and selecting a contact. This contact would be imported as a new person (filling the fields of the New person form), including the phone number field.

It may look like:

function ContactPickerButton() {
  const [selectedContact, setSelectedContact] = useState(null);

  const handleClick = () => {
    navigator.contacts.pickContact((contact) => {
      setSelectedContact(contact);
    });
  };

  return (
    <div>
      <button onClick={handleClick}>
        Select a contact
      </button>
      {selectedContact && (
        <div>
          <p>Name: {selectedContact.displayName}</p>
          <p>Phone number: {selectedContact.phoneNumbers[0].value}</p>
        </div>
      )}
    <div/>
  );
}

[Doreapp]

According to the documentation firefox android doesn't supports navigator.contacts API. In addition, for an unknown reason yet, I am unable to get

const supported = ('contacts' in navigator && 'ContactsManager' in window);

to be true event when using Chrome, while the demo works perfectly.

Thus, this issue will be in standby for now.

[Doreapp]

Let's reopen this issue, as chrome also allows install as app functionality and the picking works as soon as the website is served using HTTPS