https://github.com/ridvanaltun/react-native-critizr
React Native wrapper for Critizr
https://github.com/ridvanaltun/react-native-critizr
critizr react-native
Last synced: 3 months ago
JSON representation
React Native wrapper for Critizr
- Host: GitHub
- URL: https://github.com/ridvanaltun/react-native-critizr
- Owner: ridvanaltun
- License: mit
- Created: 2022-05-08T16:32:19.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2022-08-18T15:04:24.000Z (almost 4 years ago)
- Last Synced: 2025-04-16T03:18:46.417Z (about 1 year ago)
- Topics: critizr, react-native
- Language: Java
- Homepage:
- Size: 1.23 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# react-native-critizr
[](https://npmjs.com/package/react-native-critizr)
[](https://npmjs.com/package/react-native-critizr)
[](https://circleci.com/gh/ridvanaltun/react-native-critizr/tree/master)
[](https://github.com/ridvanaltun/react-native-critizr/blob/master/LICENSE)
> React Native wrapper for Critizr
## Getting started
```sh
npm install react-native-critizr
```
### Additional installation steps
#### Android
This module does not require any extra step after rebuilding your app.
#### iOS
1. Add the Critizr SDK by adding the following line to your Podfile.
```
pod "Critizr-ios", :git => "https://github.com/critizr/critizr-ios-pod.git", :tag => "1.2.8"
```
2. Then install it
```sh
pod install
```
3. Fill in the Critizr API Key in the info.plist file before calling methods on the Critizr SDK:
```xml
CritizrAPIKey
Critizr API Key
```
4. Fill in the Critizr environment in the info.plist file before calling methods on the Critizr SDK (don't forget to replace it with your own):
```xml
CritizrEnvironement
PreProduction
```
or
```xml
CritizrEnvironement
Production
```
## Usage
Importing the library:
```js
import Critizr from 'react-native-critizr';
```
Initiliaze (Only works on Android):
```js
Critizr.init({
apiKey: 'my-secret-api-key',
languageCode: 'en',
});
```
Manage language:
```js
const language = await Critizr.getLanguage();
Critizr.setLanguage('fr');
```
Set user for current instance:
```js
Critizr.setUser({
firstname: 'Michael',
lastname: 'Scott',
email: 'michael.scott@dundermifflin.com',
phone: '0123456789',
crmId: '123ABC',
});
```
Open feedback display:
```js
// you don't have to give any parameter
Critizr.openFeedbackDisplay();
// show a targeted place
Critizr.openFeedbackDisplay({ placeId: 'your-place-id' });
//
// show a targeted place with different modes
//
Critizr.openFeedbackDisplay({
placeId: 'your-place-id',
mode: Critizr.FEEDBACK_MODES.START_WITH_FEEDBACK, // default
});
Critizr.openFeedbackDisplay({
placeId: 'your-place-id',
mode: Critizr.FEEDBACK_MODES.START_WITH_QUIZ,
});
Critizr.openFeedbackDisplay({
placeId: 'your-place-id',
mode: Critizr.FEEDBACK_MODES.ONLY_QUIZ,
});
```
Open store display:
```js
Critizr.openStoreDisplay('your-place-id');
```
Get ratings using event listener:
```js
useEffect(() => {
const listener = Critizr.addEventListener(
Critizr.EVENTS.RATING_RESULT,
(e) => {
if (e?.customerRelationship) {
setResult(
`Customer Relationship: ${e.customerRelationship}, Satisfaction: ${e.satisfaction}`
);
} else {
setResult('Event Rating Error!');
}
}
);
return () => listener.remove();
}, []);
```
You can perceive whether the user gives feedback (Only works on Android):
```js
useEffect(() => {
const listener = Critizr.addEventListener(
Critizr.EVENTS.FEEDBACK_SENT,
(_) => {
console.log('User given a feedback!');
}
);
return () => listener.remove();
}, []);
```
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT