forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Update support links (#977)
* Add the new zendesk feedback form URL
* Dont wrap handle or display name in the drawer
* Add help link
* Tune drawer footer layout
* Type fixes
* make helpdesk urls more composable for future
* fix typo
---------
Co-authored-by: Ansh Nanda <anshnanda10@gmail.com>
authored by
Paul Frazee
Ansh Nanda
and committed by
GitHub
d442b1cd
3a6073ab
+71
-15
+1
src/lib/analytics/types.ts
+1
src/lib/analytics/types.ts
+20
-2
src/lib/constants.ts
+20
-2
src/lib/constants.ts
···
1
-
export const FEEDBACK_FORM_URL =
2
-
'https://docs.google.com/forms/d/e/1FAIpQLSdavFRXTdB6tRobaFrRR2A1gv3b-IBHwQkBmNZTRpoqmcrPrQ/viewform?usp=sf_link'
1
+
const HELP_DESK_LANG = 'en-us'
2
+
export const HELP_DESK_URL = `https://blueskyweb.zendesk.com/hc/${HELP_DESK_LANG}`
3
+
4
+
const BASE_FEEDBACK_FORM_URL = `${HELP_DESK_URL}/requests/new`
5
+
export function FEEDBACK_FORM_URL({
6
+
email,
7
+
handle,
8
+
}: {
9
+
email?: string
10
+
handle?: string
11
+
}): string {
12
+
let str = BASE_FEEDBACK_FORM_URL
13
+
if (email) {
14
+
str += `?tf_anonymous_requester_email=${encodeURIComponent(email)}`
15
+
if (handle) {
16
+
str += `&tf_17205412673421=${encodeURIComponent(handle)}`
17
+
}
18
+
}
19
+
return str
20
+
}
3
21
4
22
export const MAX_DISPLAY_NAME = 64
5
23
export const MAX_DESCRIPTION = 256
+35
-10
src/view/shell/Drawer.tsx
+35
-10
src/view/shell/Drawer.tsx
···
16
16
FontAwesomeIconStyle,
17
17
} from '@fortawesome/react-native-fontawesome'
18
18
import {s, colors} from 'lib/styles'
19
-
import {FEEDBACK_FORM_URL} from 'lib/constants'
19
+
import {FEEDBACK_FORM_URL, HELP_DESK_URL} from 'lib/constants'
20
20
import {useStores} from 'state/index'
21
21
import {
22
22
HomeIcon,
···
116
116
117
117
const onPressFeedback = React.useCallback(() => {
118
118
track('Menu:FeedbackClicked')
119
-
Linking.openURL(FEEDBACK_FORM_URL)
119
+
Linking.openURL(
120
+
FEEDBACK_FORM_URL({
121
+
email: store.session.currentSession?.email,
122
+
handle: store.session.currentSession?.handle,
123
+
}),
124
+
)
125
+
}, [track, store.session.currentSession])
126
+
127
+
const onPressHelp = React.useCallback(() => {
128
+
track('Menu:HelpClicked')
129
+
Linking.openURL(HELP_DESK_URL)
120
130
}, [track])
131
+
121
132
// rendering
122
133
// =
123
134
···
138
149
<UserAvatar size={80} avatar={store.me.avatar} />
139
150
<Text
140
151
type="title-lg"
141
-
style={[pal.text, s.bold, styles.profileCardDisplayName]}>
152
+
style={[pal.text, s.bold, styles.profileCardDisplayName]}
153
+
numberOfLines={1}>
142
154
{store.me.displayName || store.me.handle}
143
155
</Text>
144
-
<Text type="2xl" style={[pal.textLight, styles.profileCardHandle]}>
156
+
<Text
157
+
type="2xl"
158
+
style={[pal.textLight, styles.profileCardHandle]}
159
+
numberOfLines={1}>
145
160
@{store.me.handle}
146
161
</Text>
147
162
<Text
···
299
314
<TouchableOpacity
300
315
accessibilityRole="link"
301
316
accessibilityLabel="Send feedback"
302
-
accessibilityHint="Opens Google Forms feedback link"
317
+
accessibilityHint=""
303
318
onPress={onPressFeedback}
304
319
style={[
305
320
styles.footerBtn,
···
310
325
]}>
311
326
<FontAwesomeIcon
312
327
style={pal.link as FontAwesomeIconStyle}
313
-
size={19}
328
+
size={18}
314
329
icon={['far', 'message']}
315
330
/>
316
-
<Text type="2xl-medium" style={[pal.link, s.pl10]}>
331
+
<Text type="lg-medium" style={[pal.link, s.pl10]}>
317
332
Feedback
333
+
</Text>
334
+
</TouchableOpacity>
335
+
<TouchableOpacity
336
+
accessibilityRole="link"
337
+
accessibilityLabel="Send feedback"
338
+
accessibilityHint=""
339
+
onPress={onPressHelp}
340
+
style={[styles.footerBtn]}>
341
+
<Text type="lg-medium" style={[pal.link, s.pl10]}>
342
+
Help
318
343
</Text>
319
344
</TouchableOpacity>
320
345
</View>
···
495
520
496
521
footer: {
497
522
flexDirection: 'row',
498
-
justifyContent: 'space-between',
499
-
paddingRight: 30,
523
+
gap: 8,
524
+
paddingRight: 20,
500
525
paddingTop: 20,
501
526
paddingLeft: 20,
502
527
},
···
507
532
borderRadius: 25,
508
533
},
509
534
footerBtnFeedback: {
510
-
paddingHorizontal: 24,
535
+
paddingHorizontal: 20,
511
536
},
512
537
footerBtnFeedbackLight: {
513
538
backgroundColor: '#DDEFFF',