diff --git a/src/view/shell/desktop/Feeds.tsx b/src/view/shell/desktop/Feeds.tsx index 383d8f953a..1aa08416ea 100644 --- a/src/view/shell/desktop/Feeds.tsx +++ b/src/view/shell/desktop/Feeds.tsx @@ -1,19 +1,20 @@ -import {StyleSheet, View} from 'react-native' -import {msg} from '@lingui/macro' -import {useLingui} from '@lingui/react' +import React from 'react' +import {View} from 'react-native' +// import {msg} from '@lingui/macro' +// import {useLingui} from '@lingui/react' import {useNavigation, useNavigationState} from '@react-navigation/native' -import {usePalette} from '#/lib/hooks/usePalette' import {getCurrentRoute} from '#/lib/routes/helpers' import {NavigationProp} from '#/lib/routes/types' import {emitSoftReset} from '#/state/events' import {usePinnedFeedsInfos} from '#/state/queries/feed' import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed' -import {TextLink} from '#/view/com/util/Link' +import {atoms as a, useTheme, web} from '#/alf' +import {InlineLinkText} from '#/components/Link' export function DesktopFeeds() { - const pal = usePalette('default') - const {_} = useLingui() + const t = useTheme() + // const {_} = useLingui() const {data: pinnedFeedInfos} = usePinnedFeedsInfos() const selectedFeed = useSelectedFeed() const setSelectedFeed = useSetSelectedFeed() @@ -24,19 +25,30 @@ export function DesktopFeeds() { } return getCurrentRoute(state) }) + if (!pinnedFeedInfos) { return null } + return ( - + {pinnedFeedInfos.map(feedInfo => { const feed = feedInfo.feedDescriptor + const current = route.name === 'Home' && feed === selectedFeed + return ( - { setSelectedFeed(feed) navigation.navigate('Home') @@ -44,56 +56,25 @@ export function DesktopFeeds() { emitSoftReset() } }} - /> + style={[ + a.text_lg, + current + ? [a.font_heavy, t.atoms.text] + : [t.atoms.text_contrast_medium], + ]}> + {feedInfo.displayName} + ) })} - - - + + {/* + + {_(msg`More feeds`)} + + */} ) } - -function FeedItem({ - title, - href, - current, - onPress, -}: { - title: string - href: string - current: boolean - onPress: () => void -}) { - const pal = usePalette('default') - return ( - - - - ) -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - // @ts-ignore web only -prf - overflowY: 'auto', - width: 300, - paddingHorizontal: 12, - paddingVertical: 18, - }, -}) diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx index 4f413211f1..6bdd152d3a 100644 --- a/src/view/shell/desktop/RightNav.tsx +++ b/src/view/shell/desktop/RightNav.tsx @@ -1,22 +1,21 @@ -import {StyleSheet, View} from 'react-native' +import React from 'react' +import {View} from 'react-native' import {msg, Trans} 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 {useKawaiiMode} from '#/state/preferences/kawaii' import {useSession} from '#/state/session' -import {TextLink} from '#/view/com/util/Link' -import {Text} from '#/view/com/util/text/Text' -import {atoms as a} from '#/alf' +import {DesktopFeeds} from '#/view/shell/desktop/Feeds' +import {DesktopSearch} from '#/view/shell/desktop/Search' +import {atoms as a, useTheme, web} from '#/alf' +import {InlineLinkText} from '#/components/Link' import {ProgressGuideList} from '#/components/ProgressGuide/List' -import {DesktopFeeds} from './Feeds' -import {DesktopSearch} from './Search' +import {Text} from '#/components/Typography' export function DesktopRightNav({routeName}: {routeName: string}) { - const pal = usePalette('default') + const t = useTheme() const {_} = useLingui() const {hasSession, currentAccount} = useSession() @@ -28,117 +27,81 @@ export function DesktopRightNav({routeName}: {routeName: string}) { } return ( - - - {routeName === 'Search' ? ( - - - - ) : ( - <> + + + {routeName !== 'Search' && ( + - - {hasSession && ( - <> - - - - - - )} + + )} + {hasSession && ( + <> + + + + )} - - - {hasSession && ( - <> - - - · - - - )} - - - · - - - - · - - - - {kawaii && ( - - - Logo by{' '} - - - + + {hasSession && ( + <> + + {_(msg`Feedback`)} + + {' • '} + )} - + + {_(msg`Privacy`)} + + {' • '} + + {_(msg`Terms`)} + + {' • '} + + {_(msg`Help`)} + + + + {kawaii && ( + + + Logo by{' '} + + @sawaratsuki.bsky.social + + + + )} ) } - -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: StyleSheet.hairlineWidth, - borderBottomWidth: StyleSheet.hairlineWidth, - marginTop: 18, - marginBottom: 18, - }, -})