React Native Sdk Integration

List of requirements

Fully supported on Android Lollipop (API 21) and later.
Fully supported on iOS 14+.
Supported on React Native v0.72.1 and lower.
From the Feedier platform
- Public API key (Organizations → Integration)
- Carrier ID = Survey ID (Sources → Survey → Info)

Known limitations:

The Feedier React Native integration requires an internet connection. The offline mode is supported on the web side, but not yet on the mobile side.

SDK performance

Fully cached, all assets loaded from the Feedier API are 100% cached.
Supports localization in 20+ languages from the Feedier Dashboard
Supports all Feedier 16+ question types as well as conditions based on the previous answers and attribute values

Key principles

The SDK is designed with 3 key principles:

Be very striaghtforward with only one method.
Be very efficient, Feedier’s backend is extensively using cache to have very limited impact on your app’s performances.
Be fully GDPR compliant, Feedier does not monitor not track any use activity besides the one sent when initializing the widget.

How to install the package in your app?

Run npm i feedier-widget-react-native
Import the Feedier module in your App
import FeedierWidgetComponent, { FeedierWidget } from 'feedier-widget-react-native';
Initialize the FeedierWidget in your App’s constructor
FeedierWidget.init( api_key, carrier_id, attribute_values debug, force, endpoint )

Argument	Type	Description

Argument	Type	Description
`api_key`	Required, `string`	Your Feedier Organization’s public key.
`carrier_id`	Required, `integer`	The Survey ID you are displaying, available from your Feedier Dashboard or with the Feedier REST API.
`attribute_values`	Optional, `object`	Object of Attributes for analysis and correlation in Feedier. Example: `{ app_version: '1.1211.19', user_type: 'customer', customer_segment: 'A', user_id: 'AJAJKN12NQ', source: 'android' }`
`debug`	Optional, `boolean`	If enabled, the SDK will send in the console all the widget state. This is useful when developping but not recommended on production.
`force`	Optional, `boolean`	if `true`, the Expiration days (from Feedier Dashboard) option will not be used when assessing whether the widget should be displayed or not. So if it’s false (or not set) the visibility of the widget will be managed by the Expiration days. Example, in the widget config from Feedier : When completed, the next time the widget will be displayed would be in 30 days. Except if you use the `force: true` option which would override it.
`endpoint`	Optional, `string`	Buy default, this is the Feedier Production endpoint but ifyou have a Feedier dedicated instance, you want to put your instance’s API endpoint here. Example: `https://api.feedier.demos.alkalab.com`

Open the Widget from any method / hook / class:

FeedierWidget.openWidget()

The widget will be automatically closed when the feedback is received. The user will not see the widget again until the expiration time (see force documentation above to change this behavior).

Other methods

FeedierWidget.closeWidget()

Example code

// In your App's header
import FeedierWidgetComponent, { FeedierWidget } from 'feedier-widget-react-native';

...

// In your App's constructor 
FeedierWidget.init(
    'OwcuoeC6K1lxxxxxxx0YM2i8gOny',
    123,
    attribute_values = {
        app_version: '1.1211.19',
        user_type: 'customer',
        customer_segment: 'A',
        user_id: 'AJAJKN12NQ',
        source: 'android',
    },
    false,
    false
)

// Example of method to open the widget
const openModal = () => {
    FeedierWidget.openWidget()
}

...

// In your App's JSX
<FeedierWidgetComponent />

You have now successfully setup the Feedier React Native SDK.

Here is an example of the result in Feedier based on the Attribute Values you defined in attribute_values:

Screenshot 2024-01-28 at 14.46.27-20240128-134633.png

Any questions, ask our Support team at support@feedier.com

Our team can also provide functional application based on the React Native SDK upon request.