@@ -16,7 +16,7 @@ import {
1616 ScrollView
1717} from 'react-native' ;
1818
19- import Instabug from 'instabug-reactnative' ;
19+ import Instabug , { BugReporting , FeatureRequests , Surveys } from 'instabug-reactnative' ;
2020
2121
2222const instructions = Platform . select ( {
@@ -31,10 +31,11 @@ export default class App extends Component<{}> {
3131 constructor ( props ) {
3232 super ( props ) ;
3333 this . state = {
34- switchValue : false ,
35- colorTheme : 'Dark '
34+ switchValue : true ,
35+ colorTheme : 'Light '
3636 } ;
37- Instabug . startWithToken ( "APP_TOKEN" , Instabug . invocationEvent . shake ) ;
37+
38+ Instabug . startWithToken ( "APP_TOKEN" , [ Instabug . invocationEvent . shake ] ) ;
3839 Instabug . setReportCategories ( "Performance" , "UI" , "Flow" , "Other" ) ;
3940 Instabug . setPromptOptionsEnabled ( true , true , true ) ;
4041 Instabug . setLocale ( Instabug . locale . english ) ;
@@ -48,9 +49,6 @@ export default class App extends Component<{}> {
4849 Hello { "Instabug's" } awesome user! The purpose of this application is to show you the different
4950 options for customizing the SDK and how easy it is to integrate it to your existing app
5051 </ Text >
51- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showIntroMessage ( ) } >
52- < Text style = { styles . text } > SHOW INTRO MESSAGE </ Text >
53- </ TouchableOpacity >
5452 < TouchableOpacity style = { styles . button } onPress = { ( ) => this . invoke ( ) } >
5553 < Text style = { styles . text } > INVOKE </ Text >
5654 </ TouchableOpacity >
@@ -60,27 +58,31 @@ export default class App extends Component<{}> {
6058 < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendFeedback ( ) } >
6159 < Text style = { styles . text } > SEND FEEDBACK </ Text >
6260 </ TouchableOpacity >
61+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendCrashReport ( ) } >
62+ < Text style = { styles . text } > THROW HANDLED EXCEPTION </ Text >
63+ </ TouchableOpacity >
6364 < TouchableOpacity style = { styles . button } onPress = { ( ) => this . startNewConversation ( ) } >
6465 < Text style = { styles . text } > START A NEW CONVERSATION </ Text >
6566 </ TouchableOpacity >
67+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showNpsSurvey ( ) } >
68+ < Text style = { styles . text } > SHOW NPS SURVEY </ Text >
69+ </ TouchableOpacity >
70+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showMultipleQuestionSurvey ( ) } >
71+ < Text style = { styles . text } > SHOW MULTIPLE QUESTION SURVEY </ Text >
72+ </ TouchableOpacity >
73+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showFeatureRequests ( ) } >
74+ < Text style = { styles . text } > SHOW FEATURE REQUESTS </ Text >
75+ </ TouchableOpacity >
6676 < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showUnreadMessagesCount ( ) } >
6777 < Text style = { styles . text } > GET UNREAD MESSAGES COUNT </ Text >
6878 </ TouchableOpacity >
6979 { this . invocationEvent ( ) }
7080 < Text style = { styles . textColor } > Set primary color </ Text >
7181 < View style = { styles . rowView } >
72- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . setPrimaryColor ( '#FF0000' ) } >
73- < Text style = { styles . text } > RED </ Text >
74- </ TouchableOpacity >
75- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . setPrimaryColor ( '#00FF00' ) } >
76- < Text style = { styles . text } > GREEN </ Text >
77- </ TouchableOpacity >
78- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . setPrimaryColor ( '#0000FF' ) } >
79- < Text style = { styles . text } > BLUE </ Text >
80- </ TouchableOpacity >
81- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . setPrimaryColor ( '#FFFF00' ) } >
82- < Text style = { styles . text } > YELLOW </ Text >
83- </ TouchableOpacity >
82+ < TouchableOpacity style = { buttonColor ( '#FF0000' ) } onPress = { ( ) => this . setPrimaryColor ( '#FF0000' ) } />
83+ < TouchableOpacity style = { buttonColor ( '#00FF00' ) } onPress = { ( ) => this . setPrimaryColor ( '#00FF00' ) } />
84+ < TouchableOpacity style = { buttonColor ( '#0000FF' ) } onPress = { ( ) => this . setPrimaryColor ( '#0000FF' ) } />
85+ < TouchableOpacity style = { buttonColor ( '#FFFF00' ) } onPress = { ( ) => this . setPrimaryColor ( '#FFFF00' ) } />
8486 </ View >
8587 < View style = { styles . switchView } >
8688 < Text style = { styles . textSwitchStyle } > Color Theme: { this . state . colorTheme } </ Text >
@@ -94,28 +96,28 @@ export default class App extends Component<{}> {
9496 }
9597
9698 invocationEvent ( ) {
97- if ( Platform . OS === 'ios ') {
9899 return (
99100 < View >
100101 < Text style = { styles . textColor } > Change Invocation Event < / T e x t >
101102 < View style = { styles . rowView } >
102103 < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Shake' ) } >
103104 < Text style = { styles . textInvoke } > SHAKE </ Text >
104105 </ TouchableOpacity >
105- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Button' ) } >
106- < Text style = { styles . textInvoke } > FLOATING BUTTON </ Text >
107- </ TouchableOpacity >
108106 < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Screenshot' ) } >
109107 < Text style = { styles . textInvoke } > SCREENSHOT </ Text >
110108 </ TouchableOpacity >
109+ < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'twoFingersSwipe' ) } >
110+ < Text style = { styles . textInvoke } > TWO FINGERS SWIPE LEFT</ Text >
111+ </ TouchableOpacity >
112+ < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Button' ) } >
113+ < Text style = { styles . textInvoke } > FLOATING BUTTON </ Text >
114+ </ TouchableOpacity >
111115 < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'None' ) } >
112116 < Text style = { styles . textInvoke } > NONE </ Text >
113117 </ TouchableOpacity >
114118 </ View >
115119 < / V i e w >
116120 ) ;
117- }
118- return ;
119121 }
120122
121123 toggleSwitch = ( value ) => {
@@ -138,30 +140,53 @@ export default class App extends Component<{}> {
138140 }
139141
140142 invoke ( ) {
141- Instabug . invoke ( ) ;
143+ BugReporting . invoke ( ) ;
144+ }
145+
146+ showMultipleQuestionSurvey ( ) {
147+ Surveys . showSurvey ( "ZAKSlVz98QdPyOx1wIt8BA" ) ;
148+ }
149+
150+ showNpsSurvey ( ) {
151+ Surveys . showSurvey ( "pcV_mE2ttqHxT1iqvBxL0w" ) ;
152+ }
153+
154+ showFeatureRequests ( ) {
155+ FeatureRequests . show ( ) ;
142156 }
143157
144158 sendBugReport ( ) {
145- Instabug . invokeWithInvocationMode ( Instabug . invocationMode . newBug ) ;
159+ BugReporting . invokeWithInvocationModeAndOptions ( BugReporting . invocationMode . newBug , [ ] ) ;
160+ }
161+
162+ sendCrashReport ( ) {
163+ try {
164+ throw new Error ( 'Text Handled Exception From Instabug Test App' ) ;
165+ } catch ( Exception ) {
166+ Instabug . reportJSException ( Exception ) ;
167+ alert ( 'Crash report Sent!' ) ;
168+ }
146169 }
147170
148171 sendFeedback ( ) {
149- Instabug . invokeWithInvocationMode ( Instabug . invocationMode . newFeedback ) ;
172+ BugReporting . invokeWithInvocationModeAndOptions ( BugReporting . invocationMode . newFeedback , [ ] ) ;
150173 }
151174
152175 changeInvocationEvent ( invocationEvent ) {
153176 if ( invocationEvent === 'Shake' )
154- Instabug . setInvocationEvent ( Instabug . invocationEvent . shake ) ;
177+ BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . shake ] ) ;
155178 if ( invocationEvent === 'Button' )
156- Instabug . setInvocationEvent ( Instabug . invocationEvent . floatingButton ) ;
179+ Instabug . setInvocationEvent ( BugReporting . invocationEvent . floatingButton ) ;
157180 if ( invocationEvent === 'Screenshot' )
158- Instabug . setInvocationEvent ( Instabug . invocationEvent . screenshot ) ;
181+ BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . screenshot ] ) ;
182+ if ( invocationEvent === 'twoFingersSwipe' )
183+ BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . twoFingersSwipe ] ) ;
159184 if ( invocationEvent === 'None' )
160- Instabug . setInvocationEvent ( Instabug . invocationEvent . none ) ;
185+ BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . none ] ) ;
161186 }
162187
163188 startNewConversation ( ) {
164- Instabug . invokeWithInvocationMode ( Instabug . invocationMode . newChat ) ;
189+ BugReporting . invokeWithInvocationModeAndOptions ( BugReporting . invocationMode . newChat , [ ] ) ;
165190 }
166191
167192 showUnreadMessagesCount ( ) {
@@ -170,12 +195,22 @@ export default class App extends Component<{}> {
170195 } ) ;
171196 }
172197}
173-
198+ buttonColor = function ( myColor ) {
199+ return {
200+ marginTop : 10 ,
201+ padding : 20 ,
202+ paddingRight : 40 ,
203+ alignItems : 'center' ,
204+ borderRadius : 5 ,
205+ marginRight : 5 ,
206+ backgroundColor : myColor ,
207+ }
208+ }
174209const styles = StyleSheet . create ( {
175210 container : {
176211 flex : 1 ,
177212 alignItems : 'center' ,
178- backgroundColor : '#F5FCFF' ,
213+ backgroundColor : '#F5FCFF'
179214 } ,
180215 details : {
181216 textAlign : 'center' ,
@@ -197,7 +232,10 @@ const styles = StyleSheet.create({
197232 } ,
198233 rowView : {
199234 flexDirection : 'row' ,
200- marginTop : 10
235+ marginTop : 10 ,
236+ maxWidth : '100%' ,
237+ flexGrow : 1 ,
238+ flexWrap : 'wrap'
201239 } ,
202240 textColor : {
203241 fontSize : 14 ,
0 commit comments