All Projects → morenoh149 → React Native Contacts

morenoh149 / React Native Contacts

Licence: mit
React Native Contacts

Programming Languages

java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to React Native Contacts

Device Detector Js
A precise user agent parser and device detector written in TypeScript
Stars: ✭ 193 (-85.9%)
Mutual labels:  phone, mobile
Ws Scrcpy
Web client prototype for scrcpy.
Stars: ✭ 164 (-88.02%)
Mutual labels:  phone, mobile
React Native Dynamic Search Bar
Medium Article: https://freakycoder.com/react-native-library-dynamic-search-bar-c03fea9fae36
Stars: ✭ 225 (-83.56%)
Mutual labels:  mobile, react-native-component
Crboxinputview
Verify code input view. Support security type for password.短信验证码输入框,支持密文模式
Stars: ✭ 749 (-45.29%)
Mutual labels:  phone, mobile
React Phone Input 2
📞 Highly customizable phone input component with auto formatting
Stars: ✭ 446 (-67.42%)
Mutual labels:  phone, mobile
Cht Core
The CHT Core Framework makes it faster to build responsive, offline-first digital health apps that equip health workers to provide better care in their communities. It is a central resource of the Community Health Toolkit.
Stars: ✭ 354 (-74.14%)
Mutual labels:  phone, mobile
Arcoreinsideouttrackinggearvr
Inside Out Positional Tracking (6DoF) for GearVR/Cardboard/Daydream using ARCore v1.6.0
Stars: ✭ 150 (-89.04%)
Mutual labels:  phone, mobile
Mobly
E2E test framework for tests with complex environment requirements.
Stars: ✭ 424 (-69.03%)
Mutual labels:  phone, mobile
Phone
With a given country and phone number, validate and reformat the mobile phone number to the E.164 standard. The purpose of this is to allow us to send SMS to mobile phones only.
Stars: ✭ 531 (-61.21%)
Mutual labels:  phone, mobile
Cn Mobile Location
中国手机号码归属地接口
Stars: ✭ 53 (-96.13%)
Mutual labels:  phone, mobile
Tokenscript
TokenScript schema, specs and paper
Stars: ✭ 89 (-93.5%)
Mutual labels:  mobile
Pixelbot
Stars: ✭ 90 (-93.43%)
Mutual labels:  phone
Generator Ngx Rocket
🚀 Extensible Angular 11+ enterprise-grade project generator
Stars: ✭ 1,329 (-2.92%)
Mutual labels:  mobile
React Swipeable
React swipe event handler hook
Stars: ✭ 1,348 (-1.53%)
Mutual labels:  mobile
Flutter Mvvm Provider Demo
Stars: ✭ 89 (-93.5%)
Mutual labels:  mobile
Flutter todo
Yet another Todo app, now using Flutter (with ScopedModel)
Stars: ✭ 94 (-93.13%)
Mutual labels:  mobile
Fluttersocialappuikit
Flutter representation of a Social App Concept.
Stars: ✭ 1,270 (-7.23%)
Mutual labels:  mobile
React Native Onesignal
React Native Library for OneSignal Push Notifications Service
Stars: ✭ 1,270 (-7.23%)
Mutual labels:  mobile
React Swipeable List
Swipeable list component for React.
Stars: ✭ 86 (-93.72%)
Mutual labels:  mobile
Wq.app
💻📱 wq's app library: a JavaScript framework powering offline-first web & native apps for geospatial data collection, mobile surveys, and citizen science. Powered by Redux, React, Material UI and Mapbox GL.
Stars: ✭ 99 (-92.77%)
Mutual labels:  mobile

react-native-contacts

To contribute read CONTRIBUTING.md.

Ask questions on stackoverflow not the issue tracker.

Usage

getAll is a database intensive process, and can take a long time to complete depending on the size of the contacts list. Because of this, it is recommended you access the getAll method before it is needed, and cache the results for future use.

import Contacts from 'react-native-contacts';

Contacts.getAll().then(contacts => {
  // contacts returned
})

See the full API for more methods.

Android permissions

On android you must request permissions beforehand

import { PermissionsAndroid } from 'react-native';
import Contacts from 'react-native-contacts';

PermissionsAndroid.request(
  PermissionsAndroid.PERMISSIONS.READ_CONTACTS,
  {
    'title': 'Contacts',
    'message': 'This app would like to view your contacts.',
    'buttonPositive': 'Please accept bare mortal'
  }
)
.then(Contacts.getAll)
.then(contacts => {
  ...
})

Installation

Please read this entire section.

npm

npm install react-native-contacts --save

yarn

yarn add react-native-contacts

react native version 60 and above

If you are using react native version 0.60 or above you do not have to link this library.

ios

Starting with 0.60 on iOS you have to do the following:

  • Add the following line inside ios/Podfile
target 'app' do
  ...
  pod 'react-native-contacts', :path => '../node_modules/react-native-contacts' <-- add me
  ...
end
  • Run pod install in folder ios

react native below 60

iOS

Using the same instructions as https://facebook.github.io/react-native/docs/linking-libraries-ios.html

  1. open in xcode open ios/yourProject.xcodeproj/
  2. drag ./node_modules/react-native-contacts/ios/RCTContacts.xcodeproj to Libraries in your project view.
  3. In the XCode project navigator, select your project, select the Build Phases tab drag Libraries > RCTContacts.xcodeproj > Products > libRCTContacts.a into the Link Binary With Libraries section. Video to clarify Adding Camera Roll to an ios project in React Native.

Run the app via the Run button in xcode or react-native run-ios in the terminal.

Android

For react native versions 0.60 and above you have to use Android X. Android X support was added to react-native-contacts in version 5.x+. If you are using rn 0.59 and below install rnc versions 4.x instead.

  1. In android/settings.gradle
...
include ':react-native-contacts'
project(':react-native-contacts').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-contacts/android')
  1. In android/app/build.gradle
...
dependencies {
    ...
    implementation project(':react-native-contacts')
}
  1. register module
//  MainApplication.java
import com.rt2zz.reactnativecontacts.ReactNativeContacts; // <--- import

public class MainApplication extends Application implements ReactApplication {
  ......

  @Override
  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
            new ReactNativeContacts()); // <------ add this
  }
  ......
}

Permissions

API 23+

Android requires allowing permissions with https://facebook.github.io/react-native/docs/permissionsandroid.html The READ_CONTACTS permission must be added to your main application's AndroidManifest.xml. If your app creates contacts add WRITE_CONTACTS permission to AndroidManifest.xml and request the permission at runtime.

...
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
...
API 22 and below

Add READ_CONTACTS and/or WRITE_PROFILE permissions to AndroidManifest.xml

...
<uses-permission android:name="android.permission.READ_CONTACTS" />
...

ProGuard

If you use Proguard, the snippet below on proguard-rules.pro Without it, your apk release version could failed

-keep class com.rt2zz.reactnativecontacts.** {*;}
-keepclassmembers class com.rt2zz.reactnativecontacts.** {*;}

All RN versions

ios

Add kit specific "permission" keys to your Xcode Info.plist file, in order to make requestPermission work. Otherwise your app crashes when requesting the specific permission. Open Info.plist. Add key Privacy - Contacts Usage Description with your kit specific permission. The value for the key is optional in development. If you submit to the App Store the value must explain why you need this permission.

screen shot 2016-09-21 at 13 13 21
Accessing note filed on iOS 13 (optional)

If you'd like to read/write the contact's notes, call the iosEnableNotesUsage(true) method before accessing the contact infos. Also, a com.apple.developer.contacts.notes entitlement must be added to the project. Before submitting your app to the AppStore, the permission for using the entitlement has to be granted as well. You can find a more detailed explanation here.

API

  • getAll: Promise<Contact[]> - returns all contacts as an array of objects
  • getAllWithoutPhotos - same as getAll on Android, but on iOS it will not return uris for contact photos (because there's a significant overhead in creating the images)
  • getContactById(contactId): Promise - returns contact with defined contactId (or null if it doesn't exist)
  • getCount(): Promise - returns the number of contacts
  • getPhotoForId(contactId): Promise - returns a URI (or null) for a contacts photo
  • addContact(contact): Promise - adds a contact to the AddressBook.
  • openContactForm(contact) - create a new contact and display in contactsUI.
  • openExistingContact(contact) - where contact is an object with a valid recordID
  • editExistingContact(contact): Promise - add numbers to the contact, where the contact is an object with a valid recordID and an array of phoneNumbers
  • updateContact(contact): Promise - where contact is an object with a valid recordID
  • deleteContact(contact) - where contact is an object with a valid recordID
  • getContactsMatchingString(string): Promise<Contact[]> - where string is any string to match a name (first, middle, family) to
  • getContactsByPhoneNumber(string): Promise<Contact[]> - where string is a phone number to match to.
  • getContactsByEmailAddress(string): Promise<Contact[]> - where string is an email address to match to.
  • checkPermission(): Promise - checks permission to access Contacts ios only
  • requestPermission(): Promise - request permission to access Contacts ios only
  • writePhotoToPath() - writes the contact photo to a given path android only

Example Contact Record

{
  recordID: '6b2237ee0df85980',
  backTitle: '',
  company: '',
  emailAddresses: [{
    label: 'work',
    email: '[email protected]',
  }],
  familyName: 'Jung',
  givenName: 'Carl',
  middleName: '',
  jobTitle: '',
  phoneNumbers: [{
    label: 'mobile',
    number: '(555) 555-5555',
  }],
  hasThumbnail: true,
  thumbnailPath: 'content://com.android.contacts/display_photo/3',
  postalAddresses: [{
    label: 'home',
    formattedAddress: '',
    street: '123 Fake Street',
    pobox: '',
    neighborhood: '',
    city: 'Sample City',
    region: 'CA',
    state: 'CA',
    postCode: '90210',
    country: 'USA',
  }],
  prefix: 'MR',
  suffix: '',
  department: '',
  birthday: {'year': 1988, 'month': 0, 'day': 1 },
  imAddresses: [
    { username: '0123456789', service: 'ICQ'},
    { username: 'johndoe123', service: 'Facebook'}
  ]
}

NOTE

  • on Android versions below 8 the entire display name is passed in the givenName field. middleName and familyName will be "".

Adding Contacts

Currently all fields from the contact record except for thumbnailPath are supported for writing

var newPerson = {
  emailAddresses: [{
    label: "work",
    email: "[email protected]",
  }],
  familyName: "Nietzsche",
  givenName: "Friedrich",
}

Contacts.addContact(newPerson)

Open Contact Form

Currently all fields from the contact record except for thumbnailPath are supported for writing

var newPerson = {
  emailAddresses: [{
    label: "work",
    email: "[email protected]",
  }],
  displayName: "Friedrich Nietzsche"
}

Contacts.openContactForm(newPerson).then(contact => {
  // contact has been saved
})

You may want to edit the contact before saving it into your phone book. So using openContactForm allow you to prompt default phone create contacts UI and the new to-be-added contact will be display on the contacts UI view. Click save or cancel button will exit the contacts UI view.

Updating Contacts

Example

Contacts.getAll().then(contacts => {
  // update the first record
  let someRecord = contacts[0]
  someRecord.emailAddresses.push({
    label: "junk",
    email: "[email protected]",
  })
  Contacts.updateContact(someRecord).then(() => {
    // record updated
  })
})

Update reference contacts by their recordID (as returned by the OS in getContacts). Apple does not guarantee the recordID will not change, e.g. it may be reassigned during a phone migration. Consequently you should always grab a fresh contact list with getContacts before performing update operations.

Add numbers to an existing contact

Example

var newPerson = { 
  recordID: '6b2237ee0df85980',
  phoneNumbers: [{
    label: 'mobile',
    number: '(555) 555-5555',
  }, ...
  ]
}

Contacts.editExistingContact(newPerson).then(contact => {
    //contact updated
});

Add one or more phone numbers to an existing contact. On Android the edited page will be opened. On iOS the already edited contact will be opened with the possibility of further modification.

Bugs

There are issues with updating contacts on Android:

  1. custom labels get overwritten to "Other",
  2. postal address update code doesn't exist. (it exists for addContact) See https://github.com/rt2zz/react-native-contacts/issues/332#issuecomment-455675041 for current discussions.

Delete Contacts

You can delete a record using only it's recordID

Contacts.deleteContact({recordID: 1}).then(recordId => {
  // contact deleted
})

Or by passing the full contact object with a recordID field.

Contacts.deleteContact(contact).then((recordId) => {
  // contact deleted
})

Displaying Thumbnails

The thumbnailPath is the direct URI for the temp location of the contact's cropped thumbnail image.

<Image source={{uri: contact.thumbnailPath}} />

Permissions Methods (optional)

checkPermission - checks permission to access Contacts.
requestPermission - request permission to access Contacts.

Usage as follows:

Contacts.checkPermission().then(permission => {
  // Contacts.PERMISSION_AUTHORIZED || Contacts.PERMISSION_UNDEFINED || Contacts.PERMISSION_DENIED
  if (permission === 'undefined') {
    Contacts.requestPermission().then(permission => {
      // ...
    })
  }
  if (permission === 'authorized') {
    // yay!
  }
  if (permission === 'denied') {
    // x.x
  }
})

These methods are only useful on iOS. For Android you'll have to use https://facebook.github.io/react-native/docs/permissionsandroid.html

These methods do not re-request permission if permission has already been granted or denied. This is a limitation in iOS, the best you can do is prompt the user with instructions for how to enable contacts from the phone settings page Settings > [app name] > contacts.

Example

You can find an example app/showcase here

react-native-contacts example

Maintainers

If your business needs premium react native support please reach out to the maintainer.

harrymoreno.com
Harry Moreno

LICENSE

MIT License

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].