@@ -13,120 +13,151 @@ import {
1313 TouchableOpacity ,
1414 processColor ,
1515 Switch ,
16- ScrollView
16+ ScrollView ,
1717} from 'react-native' ;
1818
19- import Instabug , { BugReporting , FeatureRequests , Surveys , Chats , CrashReporting , Replies } from 'instabug-reactnative' ;
20-
19+ import Instabug , {
20+ BugReporting ,
21+ FeatureRequests ,
22+ Surveys ,
23+ Chats ,
24+ CrashReporting ,
25+ Replies ,
26+ } from 'instabug-reactnative' ;
2127
2228const instructions = Platform . select ( {
23- ios : 'Press Cmd+R to reload,\n' +
24- 'Cmd+D or shake for dev menu' ,
25- android : 'Double tap R on your keyboard to reload,\n' +
26- 'Shake or press menu button for dev menu' ,
29+ ios : 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu' ,
30+ android : 'Double tap R on your keyboard to reload,\n' + 'Shake or press menu button for dev menu' ,
2731} ) ;
2832
2933export default class App extends Component < { } > {
30-
3134 constructor ( props ) {
3235 super ( props ) ;
3336 this . state = {
3437 switchValue : true ,
35- colorTheme : 'Light'
38+ colorTheme : 'Light' ,
3639 } ;
3740
38- Instabug . startWithToken ( "YOUR_TOKEN" , [ Instabug . invocationEvent . floatingButton ] ) ;
41+ Instabug . startWithToken ( '068ba9a8c3615035e163dc5f829c73be' , [
42+ Instabug . invocationEvent . floatingButton ,
43+ ] ) ;
3944 }
4045
4146 render ( ) {
4247 return (
43- < View testID = ' welcome' style = { styles . container } >
44- < ScrollView contentContainerStyle = { styles . contentContainer } >
48+ < View testID = " welcome" style = { styles . container } >
49+ < ScrollView contentContainerStyle = { styles . contentContainer } >
4550 < Text style = { styles . details } >
46- Hello { "Instabug's" } awesome user! The purpose of this application is to show you the different
47- options for customizing the SDK and how easy it is to integrate it to your existing app
51+ Hello { "Instabug's" } awesome user! The purpose of this application is to show you the
52+ different options for customizing the SDK and how easy it is to integrate it to your
53+ existing app
4854 </ Text >
49- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . invoke ( ) } >
55+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . invoke ( ) } >
5056 < Text style = { styles . text } > INVOKE </ Text >
5157 </ TouchableOpacity >
52- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendBugReport ( ) } >
58+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendBugReport ( ) } >
5359 < Text style = { styles . text } > SEND BUG REPORT </ Text >
5460 </ TouchableOpacity >
55- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendFeedback ( ) } >
61+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendFeedback ( ) } >
5662 < Text style = { styles . text } > SEND FEEDBACK </ Text >
5763 </ TouchableOpacity >
58- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . startNewConversation ( ) } >
64+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . startNewConversation ( ) } >
5965 < Text style = { styles . text } > ASK A QUESTION </ Text >
6066 </ TouchableOpacity >
61- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendCrashReport ( ) } >
67+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . sendCrashReport ( ) } >
6268 < Text style = { styles . text } > THROW HANDLED EXCEPTION </ Text >
6369 </ TouchableOpacity >
64- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showNpsSurvey ( ) } >
70+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showNpsSurvey ( ) } >
6571 < Text style = { styles . text } > SHOW NPS SURVEY </ Text >
6672 </ TouchableOpacity >
67- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showMultipleQuestionSurvey ( ) } >
73+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showMultipleQuestionSurvey ( ) } >
6874 < Text style = { styles . text } > SHOW MULTIPLE QUESTION SURVEY </ Text >
6975 </ TouchableOpacity >
70- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showFeatureRequests ( ) } >
76+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showFeatureRequests ( ) } >
7177 < Text style = { styles . text } > SHOW FEATURE REQUESTS </ Text >
7278 </ TouchableOpacity >
73- < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showUnreadMessagesCount ( ) } >
79+ < TouchableOpacity style = { styles . button } onPress = { ( ) => this . showUnreadMessagesCount ( ) } >
7480 < Text style = { styles . text } > GET UNREAD MESSAGES COUNT </ Text >
7581 </ TouchableOpacity >
7682 { this . invocationEvent ( ) }
7783 < Text style = { styles . textColor } > Set primary color </ Text >
7884 < View style = { styles . rowView } >
79- < TouchableOpacity style = { buttonColor ( '#FF0000' ) } onPress = { ( ) => this . setPrimaryColor ( '#FF0000' ) } />
80- < TouchableOpacity style = { buttonColor ( '#00FF00' ) } onPress = { ( ) => this . setPrimaryColor ( '#00FF00' ) } />
81- < TouchableOpacity style = { buttonColor ( '#0000FF' ) } onPress = { ( ) => this . setPrimaryColor ( '#0000FF' ) } />
82- < TouchableOpacity style = { buttonColor ( '#FFFF00' ) } onPress = { ( ) => this . setPrimaryColor ( '#FFFF00' ) } />
85+ < TouchableOpacity
86+ style = { buttonColor ( '#FF0000' ) }
87+ onPress = { ( ) => this . setPrimaryColor ( '#FF0000' ) }
88+ />
89+ < TouchableOpacity
90+ style = { buttonColor ( '#00FF00' ) }
91+ onPress = { ( ) => this . setPrimaryColor ( '#00FF00' ) }
92+ />
93+ < TouchableOpacity
94+ style = { buttonColor ( '#0000FF' ) }
95+ onPress = { ( ) => this . setPrimaryColor ( '#0000FF' ) }
96+ />
97+ < TouchableOpacity
98+ style = { buttonColor ( '#FFFF00' ) }
99+ onPress = { ( ) => this . setPrimaryColor ( '#FFFF00' ) }
100+ />
83101 </ View >
84102 < View style = { styles . switchView } >
85103 < Text style = { styles . textSwitchStyle } > Color Theme: { this . state . colorTheme } </ Text >
86- < Switch
87- onValueChange = { this . toggleSwitch }
88- value = { this . state . switchValue } />
104+ < Switch onValueChange = { this . toggleSwitch } value = { this . state . switchValue } />
89105 </ View >
90106 </ ScrollView >
91107 </ View >
92108 ) ;
93109 }
94110
95111 invocationEvent ( ) {
96- return (
97- < View >
98- < Text style = { styles . textColor } > Change Invocation Event < / T e x t >
99- < View style = { styles . rowView } >
100- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Shake' ) } >
101- < Text style = { styles . textInvoke } > SHAKE </ Text >
102- </ TouchableOpacity >
103- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Screenshot' ) } >
104- < Text style = { styles . textInvoke } > SCREENSHOT </ Text >
105- </ TouchableOpacity >
106- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'twoFingersSwipe' ) } >
107- < Text style = { styles . textInvoke } > TWO FINGERS SWIPE LEFT</ Text >
108- </ TouchableOpacity >
109- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'Button' ) } >
110- < Text style = { styles . textInvoke } > FLOATING BUTTON </ Text >
111- </ TouchableOpacity >
112- < TouchableOpacity style = { styles . buttonColor } onPress = { ( ) => this . changeInvocationEvent ( 'None' ) } >
113- < Text style = { styles . textInvoke } > NONE </ Text >
114- </ TouchableOpacity >
115- </ View >
112+ return (
113+ < View >
114+ < Text style = { styles . textColor } > Change Invocation Event < / T e x t >
115+ < View style = { styles . rowView } >
116+ < TouchableOpacity
117+ style = { styles . buttonColor }
118+ onPress = { ( ) => this . changeInvocationEvent ( 'Shake' ) }
119+ >
120+ < Text style = { styles . textInvoke } > SHAKE </ Text >
121+ </ TouchableOpacity >
122+ < TouchableOpacity
123+ style = { styles . buttonColor }
124+ onPress = { ( ) => this . changeInvocationEvent ( 'Screenshot' ) }
125+ >
126+ < Text style = { styles . textInvoke } > SCREENSHOT </ Text >
127+ </ TouchableOpacity >
128+ < TouchableOpacity
129+ style = { styles . buttonColor }
130+ onPress = { ( ) => this . changeInvocationEvent ( 'twoFingersSwipe' ) }
131+ >
132+ < Text style = { styles . textInvoke } > TWO FINGERS SWIPE LEFT</ Text >
133+ </ TouchableOpacity >
134+ < TouchableOpacity
135+ style = { styles . buttonColor }
136+ onPress = { ( ) => this . changeInvocationEvent ( 'Button' ) }
137+ >
138+ < Text style = { styles . textInvoke } > FLOATING BUTTON </ Text >
139+ </ TouchableOpacity >
140+ < TouchableOpacity
141+ style = { styles . buttonColor }
142+ onPress = { ( ) => this . changeInvocationEvent ( 'None' ) }
143+ >
144+ < Text style = { styles . textInvoke } > NONE </ Text >
145+ </ TouchableOpacity >
116146 </ View >
117- ) ;
147+ < / V i e w >
148+ ) ;
118149 }
119150
120- toggleSwitch = ( value ) => {
121- this . setState ( { switchValue : value } )
122- if ( value ) {
123- this . setState ( { colorTheme : 'Light' } ) ;
124- Instabug . setColorTheme ( Instabug . colorTheme . light ) ;
125- } else {
126- this . setState ( { colorTheme : 'Dark' } ) ;
127- Instabug . setColorTheme ( Instabug . colorTheme . dark ) ;
128- }
129- }
151+ toggleSwitch = value => {
152+ this . setState ( { switchValue : value } ) ;
153+ if ( value ) {
154+ this . setState ( { colorTheme : 'Light' } ) ;
155+ Instabug . setColorTheme ( Instabug . colorTheme . light ) ;
156+ } else {
157+ this . setState ( { colorTheme : 'Dark' } ) ;
158+ Instabug . setColorTheme ( Instabug . colorTheme . dark ) ;
159+ }
160+ } ;
130161
131162 setPrimaryColor ( color ) {
132163 Instabug . setPrimaryColor ( color ) ;
@@ -141,11 +172,11 @@ export default class App extends Component<{}> {
141172 }
142173
143174 showMultipleQuestionSurvey ( ) {
144- Surveys . showSurvey ( " ZAKSlVz98QdPyOx1wIt8BA" ) ;
175+ Surveys . showSurvey ( ' ZAKSlVz98QdPyOx1wIt8BA' ) ;
145176 }
146177
147178 showNpsSurvey ( ) {
148- Surveys . showSurvey ( " pcV_mE2ttqHxT1iqvBxL0w" ) ;
179+ Surveys . showSurvey ( ' pcV_mE2ttqHxT1iqvBxL0w' ) ;
149180 }
150181
151182 showFeatureRequests ( ) {
@@ -158,28 +189,29 @@ export default class App extends Component<{}> {
158189
159190 sendCrashReport ( ) {
160191 try {
161- throw new Error ( 'Text Handled Exception From Instabug Test App' ) ;
192+ throw new Error ( 'Text Handled Exception From Instabug Test App' ) ;
162193 } catch ( Exception ) {
163194 CrashReporting . reportJSException ( Exception ) ;
164195 alert ( 'Crash report Sent!' ) ;
165196 }
166197 }
167198
168199 sendFeedback ( ) {
169- BugReporting . showWithOptions ( BugReporting . reportType . feedback , [ BugReporting . option . emailFieldHidden ] ) ;
170-
200+ BugReporting . showWithOptions ( BugReporting . reportType . feedback , [
201+ BugReporting . option . emailFieldHidden ,
202+ ] ) ;
171203 }
172204
173205 changeInvocationEvent ( invocationEvent ) {
174- if ( invocationEvent === 'Shake' )
206+ if ( invocationEvent === 'Shake' )
175207 BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . shake ] ) ;
176- if ( invocationEvent === 'Button' )
208+ if ( invocationEvent === 'Button' )
177209 BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . floatingButton ] ) ;
178- if ( invocationEvent === 'Screenshot' )
210+ if ( invocationEvent === 'Screenshot' )
179211 BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . screenshot ] ) ;
180- if ( invocationEvent === 'twoFingersSwipe' )
212+ if ( invocationEvent === 'twoFingersSwipe' )
181213 BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . twoFingersSwipe ] ) ;
182- if ( invocationEvent === 'None' )
214+ if ( invocationEvent === 'None' )
183215 BugReporting . setInvocationEvents ( [ BugReporting . invocationEvent . none ] ) ;
184216 }
185217
@@ -188,52 +220,52 @@ export default class App extends Component<{}> {
188220 }
189221
190222 showUnreadMessagesCount ( ) {
191- Replies . getUnreadRepliesCount ( ( count ) => {
192- alert ( " Messages: " + count ) ;
223+ Replies . getUnreadRepliesCount ( count => {
224+ alert ( ' Messages: ' + count ) ;
193225 } ) ;
194226 }
195227}
196228buttonColor = function ( myColor ) {
197229 return {
198230 marginTop : 10 ,
199231 padding : 20 ,
200- paddingRight : 40 ,
232+ paddingRight : 40 ,
201233 alignItems : 'center' ,
202234 borderRadius : 5 ,
203235 marginRight : 5 ,
204236 backgroundColor : myColor ,
205- }
206- }
237+ } ;
238+ } ;
207239const styles = StyleSheet . create ( {
208240 container : {
209241 flex : 1 ,
210242 alignItems : 'center' ,
211- backgroundColor : '#F5FCFF'
243+ backgroundColor : '#F5FCFF' ,
212244 } ,
213245 details : {
214246 textAlign : 'center' ,
215247 color : '#333333' ,
216248 margin : 20 ,
217- marginTop : Platform . OS === 'ios' ? 40 : 20
249+ marginTop : Platform . OS === 'ios' ? 40 : 20 ,
218250 } ,
219251 text : {
220252 color : '#FFFFFF' ,
221253 fontSize : 12 ,
222- fontWeight : 'bold'
254+ fontWeight : 'bold' ,
223255 } ,
224256 button : {
225257 marginTop : 10 ,
226- backgroundColor : " #1D82DC" ,
258+ backgroundColor : ' #1D82DC' ,
227259 padding : 10 ,
228260 alignItems : 'center' ,
229- borderRadius : 5
261+ borderRadius : 5 ,
230262 } ,
231263 rowView : {
232264 flexDirection : 'row' ,
233265 marginTop : 10 ,
234- maxWidth : '100%' ,
266+ maxWidth : '100%' ,
235267 flexGrow : 1 ,
236- flexWrap : 'wrap'
268+ flexWrap : 'wrap' ,
237269 } ,
238270 textColor : {
239271 fontSize : 14 ,
@@ -242,16 +274,16 @@ const styles = StyleSheet.create({
242274 } ,
243275 buttonColor : {
244276 marginTop : 10 ,
245- backgroundColor : " #1D82DC" ,
277+ backgroundColor : ' #1D82DC' ,
246278 padding : 10 ,
247279 alignItems : 'center' ,
248280 borderRadius : 5 ,
249- marginRight : 5
281+ marginRight : 5 ,
250282 } ,
251283 textSwitchStyle : {
252284 marginTop : 10 ,
253285 marginRight : 5 ,
254- fontWeight : 'bold'
286+ fontWeight : 'bold' ,
255287 } ,
256288 switchView : {
257289 flexDirection : 'row' ,
@@ -260,9 +292,9 @@ const styles = StyleSheet.create({
260292 textInvoke : {
261293 color : '#FFFFFF' ,
262294 fontSize : 10 ,
263- fontWeight : 'bold'
295+ fontWeight : 'bold' ,
264296 } ,
265297 contentContainer : {
266- padding : 10
267- }
298+ padding : 10 ,
299+ } ,
268300} ) ;
0 commit comments