In-app feedback for React Native apps
In-app feedback enables you to ask for feedback from your users. App users can then attach and annotate images/screenshots, include logs and diagnostics, or report a bug while sharing a feedback. It comes with an in-built annotator that helps app users mask any sensitive information, scribble on the screenshots, or add arrows to pinpoint the areas with issues.
Opening feedback screen
- You can explicitly present the feedback screen to users on demand. Use the below method to present the feedback screen.
Copiedimport { Apptics, AppticsFeedback } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.openFeedback();
Report bug with screen annotation
- Use the below method to automatically capture the screenshot and present annotation activity for reporting bug.
Copiedimport { Apptics, AppticsFeedback } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.reportBug();
Enable / disable shake-to-feedback
Shake-to-feedback allows the users to shake their smart devices to open the feedback screen. You can manually enable or disable this feature.
Enable shake for feedback
- Use the below method to enable shake for feedback.
Copiedimport { Apptics, AppticsFeedback } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.enableShakeForFeedback();
Disable shake for feedback
- Use the below method to disable shake for feedback.
Copiedimport { Apptics, AppticsFeedback } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.disableShakeForFeedback();
Send feedback or bug report programmatically
Your app users can send the feedback or report bugs without showing the feedback UI, either silently from background or from your custom feedback UI.
- Use the below method to send the feeback or report bug programatically.
CopiedAppticsFeedback.sendFeedback(
feedback: string,
includeLogs: boolean,
includeDiagnostics: boolean,
guestMailId: string | null,
forceToAnonymous: boolean,
attachments: [string] | null
)
Sample snippet to select attachment from the file picker and send feeback.
Copied// copying file to cache directory before sending feedback.
const res = await DocumentPicker.pickSingle({
type: [DocumentPicker.types.allFiles],
copyTo: 'cachesDirectory',
});
console.log(res.fileCopyUri);
AppticsFeedback.sendFeedback(
"Hello World",
true,
true,
null,
false,
[res.fileCopyUri]
);
Feeback logs and diagnostic info
Apptics' feedback toolkit provides the necessary APIs to add logs and diagnostic info from anywhere in the app. The files containing these data can be sent by the user while sending feedback.
- Use the below method to write the logs that will be attached to the feedback.
Copiedimport { Apptics, AppticsFeedback, LogType } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.writeLog(LogType.Debug, "log message);
- A diagnostic file is a set of key-value pairs, where each pair can be grouped under the given heading. To add diagnostic info, use the below method.
Copiedimport { Apptics, AppticsFeedback, LogType } from '@zoho_apptics/apptics-react-native';
AppticsFeedback.addDiagnosticsInfo("Heading", "key", "value");