https://github.com/mortada-codes/react-native-otp
https://github.com/mortada-codes/react-native-otp
react-native-otp
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/mortada-codes/react-native-otp
- Owner: mortada-codes
- Created: 2019-03-21T11:05:45.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-02-28T23:33:34.000Z (over 3 years ago)
- Last Synced: 2025-04-07T08:38:40.581Z (about 1 year ago)
- Topics: react-native-otp
- Language: Java
- Size: 122 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-native-react-native-otp
## Getting started
`$ npm install react-native-autodetect-otp --save`
### follow play servies docs to generate hash
https://developers.google.com/identity/sms-retriever/verify
### Manual installation
#### Android
1. Open up `android/app/src/main/java/[...]/MainActivity.java`
- Add `import com.reactlibrary.RNReactNativeOtpPackage;` to the imports at the top of the file
- Add `new RNReactNativeOtpPackage()` to the list returned by the `getPackages()` method
2. Append the following lines to `android/settings.gradle`:
```
include ':react-native-react-native-otp'
project(':react-native-react-native-otp').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-react-native-otp/android')
```
3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:
```
compile project(':react-native-react-native-otp')
```
4. add this code to manifest
```
```
## Usage
```javascript
import { NativeEventEmitter, NativeModules } from 'react-native';
import RNReactNativeOtp from 'react-native-autodetect-otp';
const { ModuleWithEmitter } = NativeModules;
const eventEmitter = new NativeEventEmitter(ModuleWithEmitter);
const onReceiveOTP = ({otp}) => {
console.log(otp);
}
const onOTPTimeout = (event) => {
console.log(event);
}
class VerifyOTP extends Component{
async componentDidMount(){
const result = await RNReactNativeOtp.requestSMS();
this.unsubscribe = ReactNativeOtp.detectorEmitter((result)=>{
// you will get the sms message here
})
})
}
componentWillUnmout(){
this.unsubscribe()
timeoutSubscription.remove();
}
}
```
```
result object properties:
result.otp : the sms message
result.status : fail || success
```