1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
import {msg} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {FEEDBACK_FORM_URL, HELP_DESK_URL} from 'lib/constants'
import {usePalette} from 'lib/hooks/usePalette'
import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {s} from 'lib/styles'
import React from 'react'
import {StyleSheet, View} from 'react-native'
import {TextLink} from 'view/com/util/Link'
import {Text} from 'view/com/util/text/Text'
import {useSession} from '#/state/session'
import {DesktopFeeds} from './Feeds'
import {DesktopSearch} from './Search'
export function DesktopRightNav({routeName}: {routeName: string}) {
const pal = usePalette('default')
const {_} = useLingui()
const {hasSession, currentAccount} = useSession()
const {isTablet} = useWebMediaQueries()
if (isTablet) {
return null
}
return (
<View style={[styles.rightNav, pal.view]}>
<View style={{paddingVertical: 20}}>
{routeName === 'Search' ? (
<View style={{marginBottom: 18}}>
<DesktopFeeds />
</View>
) : (
<>
<DesktopSearch />
{hasSession && (
<View style={[pal.border, styles.desktopFeedsContainer]}>
<DesktopFeeds />
</View>
)}
</>
)}
<View
style={[
styles.message,
{
paddingTop: hasSession ? 0 : 18,
},
]}>
<View style={[{flexWrap: 'wrap'}, s.flexRow]}>
{hasSession && (
<>
<TextLink
type="md"
style={pal.link}
href={FEEDBACK_FORM_URL({
email: currentAccount?.email,
handle: currentAccount?.handle,
})}
text={_(msg`Feedback`)}
/>
<Text type="md" style={pal.textLight}>
·
</Text>
</>
)}
<TextLink
type="md"
style={pal.link}
href="https://bsky.social/about/support/privacy-policy"
text={_(msg`Privacy`)}
/>
<Text type="md" style={pal.textLight}>
·
</Text>
<TextLink
type="md"
style={pal.link}
href="https://bsky.social/about/support/tos"
text={_(msg`Terms`)}
/>
<Text type="md" style={pal.textLight}>
·
</Text>
<TextLink
type="md"
style={pal.link}
href={HELP_DESK_URL}
text={_(msg`Help`)}
/>
</View>
</View>
</View>
</View>
)
}
const styles = StyleSheet.create({
rightNav: {
// @ts-ignore web only
position: 'fixed',
// @ts-ignore web only
left: 'calc(50vw + 300px + 20px)',
width: 300,
maxHeight: '100%',
overflowY: 'auto',
},
message: {
paddingVertical: 18,
paddingHorizontal: 12,
},
messageLine: {
marginBottom: 10,
},
desktopFeedsContainer: {
borderTopWidth: 1,
borderBottomWidth: 1,
marginTop: 18,
marginBottom: 18,
},
})
|
