Rework the rightnav overflow behavior to not obscure the scroll region (#2199)

+65 -67

1 changed file

expand all

src

view

shell

desktop

RightNav.tsx

+65 -67

src/view/shell/desktop/RightNav.tsx

··· 15 15 import {Plural, Trans, msg, plural} from '@lingui/macro' 16 16 import {useSession} from '#/state/session' 17 17 import {useInviteCodesQuery} from '#/state/queries/invites' 18 - import {ScrollView} from '#/view/com/util/Views' 19 18 20 19 export function DesktopRightNav() { 21 20 const pal = usePalette('default') ··· 30 29 31 30 return ( 32 31 <View style={[styles.rightNav, pal.view]}> 33 - <ScrollView contentContainerStyle={{borderWidth: 0}}> 34 - <View style={{paddingVertical: 20}}> 35 - <DesktopSearch /> 32 + <View style={{paddingVertical: 20}}> 33 + <DesktopSearch /> 36 34 37 - {hasSession && ( 38 - <View style={{paddingTop: 18, marginBottom: 18}}> 39 - <DesktopFeeds /> 40 - </View> 41 - )} 35 + {hasSession && ( 36 + <View style={{paddingTop: 18, marginBottom: 18}}> 37 + <DesktopFeeds /> 38 + </View> 39 + )} 42 40 43 - <View 44 - style={[ 45 - styles.message, 46 - { 47 - paddingTop: hasSession ? 0 : 18, 48 - }, 49 - ]}> 50 - {isSandbox ? ( 51 - <View style={[palError.view, styles.messageLine, s.p10]}> 52 - <Text type="md" style={[palError.text, s.bold]}> 53 - SANDBOX. Posts and accounts are not permanent. 54 - </Text> 55 - </View> 56 - ) : undefined} 57 - <View style={[s.flexRow]}> 58 - {hasSession && ( 59 - <> 60 - <TextLink 61 - type="md" 62 - style={pal.link} 63 - href={FEEDBACK_FORM_URL({ 64 - email: currentAccount?.email, 65 - handle: currentAccount?.handle, 66 - })} 67 - text={_(msg`Feedback`)} 68 - /> 69 - <Text type="md" style={pal.textLight}> 70 -  ·  71 - </Text> 72 - </> 73 - )} 74 - <TextLink 75 - type="md" 76 - style={pal.link} 77 - href="https://blueskyweb.xyz/support/privacy-policy" 78 - text={_(msg`Privacy`)} 79 - /> 80 - <Text type="md" style={pal.textLight}> 81 -  ·  82 - </Text> 83 - <TextLink 84 - type="md" 85 - style={pal.link} 86 - href="https://blueskyweb.xyz/support/tos" 87 - text={_(msg`Terms`)} 88 - /> 89 - <Text type="md" style={pal.textLight}> 90 -  ·  41 + <View 42 + style={[ 43 + styles.message, 44 + { 45 + paddingTop: hasSession ? 0 : 18, 46 + }, 47 + ]}> 48 + {isSandbox ? ( 49 + <View style={[palError.view, styles.messageLine, s.p10]}> 50 + <Text type="md" style={[palError.text, s.bold]}> 51 + SANDBOX. Posts and accounts are not permanent. 91 52 </Text> 92 - <TextLink 93 - type="md" 94 - style={pal.link} 95 - href={HELP_DESK_URL} 96 - text={_(msg`Help`)} 97 - /> 98 53 </View> 54 + ) : undefined} 55 + <View style={[s.flexRow]}> 56 + {hasSession && ( 57 + <> 58 + <TextLink 59 + type="md" 60 + style={pal.link} 61 + href={FEEDBACK_FORM_URL({ 62 + email: currentAccount?.email, 63 + handle: currentAccount?.handle, 64 + })} 65 + text={_(msg`Feedback`)} 66 + /> 67 + <Text type="md" style={pal.textLight}> 68 +  ·  69 + </Text> 70 + </> 71 + )} 72 + <TextLink 73 + type="md" 74 + style={pal.link} 75 + href="https://blueskyweb.xyz/support/privacy-policy" 76 + text={_(msg`Privacy`)} 77 + /> 78 + <Text type="md" style={pal.textLight}> 79 +  ·  80 + </Text> 81 + <TextLink 82 + type="md" 83 + style={pal.link} 84 + href="https://blueskyweb.xyz/support/tos" 85 + text={_(msg`Terms`)} 86 + /> 87 + <Text type="md" style={pal.textLight}> 88 +  ·  89 + </Text> 90 + <TextLink 91 + type="md" 92 + style={pal.link} 93 + href={HELP_DESK_URL} 94 + text={_(msg`Help`)} 95 + /> 99 96 </View> 97 + </View> 100 98 101 - {hasSession && <InviteCodes />} 102 - </View> 103 - </ScrollView> 99 + {hasSession && <InviteCodes />} 100 + </View> 104 101 </View> 105 102 ) 106 103 } ··· 176 173 // @ts-ignore web only 177 174 left: 'calc(50vw + 320px)', 178 175 width: 304, 179 - height: '100%', 176 + maxHeight: '100%', 177 + overflowY: 'auto', 180 178 }, 181 179 182 180 message: {

Configure Feed

Configure Feed