@originallyus/feedback-rn-sdk 1.0.2 → 1.0.4

package/README.md

@@ -5,18 +5,18 @@ A cross-platform Feedback component for React Native.
 ## Installation
 
 Add package:
-
 ```sh
 npm install @originallyus/feedback-rn-sdk
 ```
 
-or
+## Install Peer Dependencies
 
-```sh
-yarn add @originallyus/feedback-rn-sdk
+These packages are specified as peerDependencies and need to be installed separatedly.
+```
+yarn add axios crypto-js react-native-encrypted-storage react-native-device-info react-native-rate react-native-root-sibling
 ```
 
-<!-- Copy folder [feedback/](https://gitlab.com/originallyus/feedback-rn-sdk/-/tree/master/feedback) to the project root: -->
+## Install Custom Fonts
 
 Package requires custom fonts found in `fonts` folder:
 
@@ -34,3 +34,92 @@ OpenSans-SemiBold.ttf
 Please follow this guide to install fonts: [`Install Fonts to RN App`](https://medium.com/@prathiba2796/how-to-add-and-use-custom-fonts-in-react-native-369d5bba9203)
 
 Please do not change the filenames as Android are using those to identify fonts. These filenames follows actual PostScript Name of the fonts.
+
+
+## Quick Start
+
+Please initalize the SDK once in App.js. The mounting point of the SDK should be placed directly in your App.js for it to stay on top of all other views.
+
+```js
+import AIAFeedback from '@originallyus/feedback-rn-sdk';
+
+const App = (props) => {
+  // This initialization should done once inside App.js
+  const feedbackRef = useRef();
+};
+
+// in your render function 
+return (
+  // Make sure the app is full screen and vertical align center
+  <View style={{ flex: 1, justifyContent: 'center' }}>
+    <YourOtherContainerView></YourOtherContainerView>
+
+    {/* Please insert this mount point directly in your App.js,
+        preferably at the bottom of your root view tree for it to stay on top of all other views */}
+    <AIAFeedback ref={feedbackRef} />
+  </View>
+);
+```
+
+All other functions to be invoked on feedbackRef.current can be done anywhere in your application code (can also be inside App.js)
+
+```js
+import AIAFeedback from '@originallyus/feedback-rn-sdk';
+
+const OtherComponent = (props) => {
+  // This is a singleton. The initialization should have already been done inside App.js
+  const feedbackRef = useRef();
+
+  const setupFeedbackSDK = () => {
+    // Please contact us to obtain an App Secret specific to your Bundle ID/Package ID
+    feedbackRef.current.setAppSecret('QcJasjiu2olMBxHyFohKJ');
+  };
+
+  const setLanguage = (language) => {
+    // Use international language codes: "en", "zh", "zh_tw", "ms", "ta", "id", "th", "tl", "vi"
+    // Note: our backend must be loaded with the translation content before a language can be used. Invalid languages will automatically fallback to English
+    feedbackRef.current.setLanguage(language);
+  };
+
+  const setAppUserId = () => {
+    // This is an optional User ID provided by the host app.
+    feedbackRef.current.setAppUserId('1234');
+  };
+
+  const setMetadata = () => {
+    // This is an optional metadata provided by the host app. Supports string format only.
+    feedbackRef.current.setMetadata('policy_1234567890');
+  };
+
+  const testRatingForm = (eventTag) => {
+    // This will always show the Feedback form for testing/debugging purpose
+    // You may troubleshoot this in "Request (Testing)" section in CMS
+    feedbackRef.current.setFormSlug('native_rating_form');
+    feedbackRef.current.testRatingForm(eventTag);
+  };
+
+  const showRatingForm = (eventTag) => {
+    // This may not always show/trigger the form, depending on the Response Frequency & Prompt Frequency configuration on backend
+    // You may troubleshoot this in "Request" section in CMS
+    feedbackRef.current.showRatingForm(eventTag);
+  };
+};
+```
+
+
+## Callback Function (optional)
+
+An optional callback function can be provided as parameter to capture the outcome of the SDK.
+
+  - **formDidShow = false** is triggered when there is no form to be shown, this callback function will be triggered almost immediately.
+  - **formDidShow = true** is triggered when has been shown and user has finished interacting with it or dismiss/cancel it
+
+```js
+feedbackRef.current.testRatingForm(eventTag, (formDidShow) => {
+  console.log("formDidShow", formDidShow);
+});
+
+feedbackRef.current.showRatingForm(eventTag, (formDidShow) => {
+  console.log("formDidShow", formDidShow);
+});
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@originallyus/feedback-rn-sdk",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "A cross-platform Feedback component for React Native.",
   "main": "lib/commonjs/index",
   "react-native": "lib/commonjs/index",
@@ -58,10 +58,6 @@
   "resolutions": {
     "@types/react": "17.0.21"
   },
-  "peerDependencies": {
-    "react": "*",
-    "react-native": "*"
-  },
   "workspaces": [
     "example"
   ],
@@ -136,13 +132,17 @@
       ]
     ]
   },
+  "peerDependencies": {
+    "axios": "*",
+    "crypto-js": "*",
+    "react": "*",
+    "react-native": "*",
+    "react-native-device-info": "*",
+    "react-native-encrypted-storage": "*",
+    "react-native-rate": "*",
+    "react-native-root-siblings": "*"
+  },
   "dependencies": {
-    "axios": "^1.6.5",
-    "crypto-js": "^4.2.0",
-    "react-native-android-keyboard-adjust-originallyus": "^1.0.2",
-    "react-native-device-info": "^10.12.0",
-    "react-native-encrypted-storage": "^4.0.3",
-    "react-native-rate": "^1.2.12",
-    "react-native-screens": "^3.29.0"
+    "react-native-android-keyboard-adjust-originallyus": "*"
   }
 }