diff options
Diffstat (limited to 'src/view')
-rw-r--r-- | src/view/com/auth/login/ChooseAccountForm.tsx | 3 | ||||
-rw-r--r-- | src/view/com/auth/login/Login.tsx | 5 | ||||
-rw-r--r-- | src/view/com/feeds/FeedPage.tsx | 15 | ||||
-rw-r--r-- | src/view/com/modals/SwitchAccount.tsx | 2 | ||||
-rw-r--r-- | src/view/com/pager/FeedsTabBarMobile.tsx | 4 | ||||
-rw-r--r-- | src/view/com/testing/TestCtrls.e2e.tsx | 8 | ||||
-rw-r--r-- | src/view/com/util/AccountDropdownBtn.tsx | 6 | ||||
-rw-r--r-- | src/view/com/util/PostSandboxWarning.tsx | 6 | ||||
-rw-r--r-- | src/view/screens/Settings.tsx | 2 | ||||
-rw-r--r-- | src/view/shell/Drawer.tsx | 98 | ||||
-rw-r--r-- | src/view/shell/desktop/RightNav.tsx | 5 |
11 files changed, 94 insertions, 60 deletions
diff --git a/src/view/com/auth/login/ChooseAccountForm.tsx b/src/view/com/auth/login/ChooseAccountForm.tsx index c4a3b158c..8c94ef2da 100644 --- a/src/view/com/auth/login/ChooseAccountForm.tsx +++ b/src/view/com/auth/login/ChooseAccountForm.tsx @@ -5,7 +5,6 @@ import {useAnalytics} from 'lib/analytics/analytics' import {Text} from '../../util/text/Text' import {UserAvatar} from '../../util/UserAvatar' import {s} from 'lib/styles' -import {AccountData} from 'state/models/session' import {usePalette} from 'lib/hooks/usePalette' import {Trans, msg} from '@lingui/macro' import {useLingui} from '@lingui/react' @@ -62,7 +61,7 @@ export const ChooseAccountForm = ({ onSelectAccount, onPressBack, }: { - onSelectAccount: (account?: AccountData) => void + onSelectAccount: (account?: SessionAccount) => void onPressBack: () => void }) => { const {track, screen} = useAnalytics() diff --git a/src/view/com/auth/login/Login.tsx b/src/view/com/auth/login/Login.tsx index de00d6ca2..27d08812c 100644 --- a/src/view/com/auth/login/Login.tsx +++ b/src/view/com/auth/login/Login.tsx @@ -4,7 +4,6 @@ import {useAnalytics} from 'lib/analytics/analytics' import {LoggedOutLayout} from 'view/com/util/layouts/LoggedOutLayout' import {useStores, DEFAULT_SERVICE} from 'state/index' import {ServiceDescription} from 'state/models/session' -import {AccountData} from 'state/models/session' import {usePalette} from 'lib/hooks/usePalette' import {logger} from '#/logger' import {ChooseAccountForm} from './ChooseAccountForm' @@ -14,7 +13,7 @@ import {SetNewPasswordForm} from './SetNewPasswordForm' import {PasswordUpdatedForm} from './PasswordUpdatedForm' import {useLingui} from '@lingui/react' import {msg} from '@lingui/macro' -import {useSession} from '#/state/session' +import {useSession, SessionAccount} from '#/state/session' enum Forms { Login, @@ -41,7 +40,7 @@ export const Login = ({onPressBack}: {onPressBack: () => void}) => { accounts.length ? Forms.ChooseAccount : Forms.Login, ) - const onSelectAccount = (account?: AccountData) => { + const onSelectAccount = (account?: SessionAccount) => { if (account?.service) { setServiceUrl(account.service) } diff --git a/src/view/com/feeds/FeedPage.tsx b/src/view/com/feeds/FeedPage.tsx index ffae6cbf4..6a846f677 100644 --- a/src/view/com/feeds/FeedPage.tsx +++ b/src/view/com/feeds/FeedPage.tsx @@ -23,6 +23,7 @@ import useAppState from 'react-native-appstate-hook' import {logger} from '#/logger' import {msg} from '@lingui/macro' import {useLingui} from '@lingui/react' +import {useSession} from '#/state/session' export const FeedPage = observer(function FeedPageImpl({ testID, @@ -38,6 +39,7 @@ export const FeedPage = observer(function FeedPageImpl({ renderEndOfFeed?: () => JSX.Element }) { const store = useStores() + const {isSandbox} = useSession() const pal = usePalette('default') const {_} = useLingui() const {isDesktop} = useWebMediaQueries() @@ -140,7 +142,7 @@ export const FeedPage = observer(function FeedPageImpl({ style={[pal.text, {fontWeight: 'bold'}]} text={ <> - {store.session.isSandbox ? 'SANDBOX' : 'Bluesky'}{' '} + {isSandbox ? 'SANDBOX' : 'Bluesky'}{' '} {hasNew && ( <View style={{ @@ -173,7 +175,16 @@ export const FeedPage = observer(function FeedPageImpl({ ) } return <></> - }, [isDesktop, pal.view, pal.text, pal.textLight, store, hasNew, _]) + }, [ + isDesktop, + pal.view, + pal.text, + pal.textLight, + store, + hasNew, + _, + isSandbox, + ]) return ( <View testID={testID} style={s.h100pct}> diff --git a/src/view/com/modals/SwitchAccount.tsx b/src/view/com/modals/SwitchAccount.tsx index 05d0da37a..3481b861c 100644 --- a/src/view/com/modals/SwitchAccount.tsx +++ b/src/view/com/modals/SwitchAccount.tsx @@ -64,7 +64,7 @@ function SwitchAccountCard({account}: {account: SessionAccount}) { </Text> </TouchableOpacity> ) : ( - <AccountDropdownBtn handle={account.handle} /> + <AccountDropdownBtn account={account} /> )} </View> ) diff --git a/src/view/com/pager/FeedsTabBarMobile.tsx b/src/view/com/pager/FeedsTabBarMobile.tsx index 8c29ad6ab..d79bfe94e 100644 --- a/src/view/com/pager/FeedsTabBarMobile.tsx +++ b/src/view/com/pager/FeedsTabBarMobile.tsx @@ -19,12 +19,14 @@ import {useLingui} from '@lingui/react' import {useMinimalShellMode} from 'lib/hooks/useMinimalShellMode' import {useSetDrawerOpen} from '#/state/shell/drawer-open' import {useShellLayout} from '#/state/shell/shell-layout' +import {useSession} from '#/state/session' export const FeedsTabBar = observer(function FeedsTabBarImpl( props: RenderTabBarFnProps & {testID?: string; onPressSelected: () => void}, ) { const pal = usePalette('default') const store = useStores() + const {isSandbox} = useSession() const {_} = useLingui() const setDrawerOpen = useSetDrawerOpen() const items = useHomeTabs(store.preferences.pinnedFeeds) @@ -59,7 +61,7 @@ export const FeedsTabBar = observer(function FeedsTabBarImpl( </TouchableOpacity> </View> <Text style={[brandBlue, s.bold, styles.title]}> - {store.session.isSandbox ? 'SANDBOX' : 'Bluesky'} + {isSandbox ? 'SANDBOX' : 'Bluesky'} </Text> <View style={[pal.view]}> <Link diff --git a/src/view/com/testing/TestCtrls.e2e.tsx b/src/view/com/testing/TestCtrls.e2e.tsx index 2f36609e9..489705d10 100644 --- a/src/view/com/testing/TestCtrls.e2e.tsx +++ b/src/view/com/testing/TestCtrls.e2e.tsx @@ -3,6 +3,7 @@ import {Pressable, View} from 'react-native' import {useStores} from 'state/index' import {navigate} from '../../../Navigation' import {useModalControls} from '#/state/modals' +import {useSessionApi} from '#/state/session' /** * This utility component is only included in the test simulator @@ -14,16 +15,17 @@ const BTN = {height: 1, width: 1, backgroundColor: 'red'} export function TestCtrls() { const store = useStores() + const {logout, login} = useSessionApi() const {openModal} = useModalControls() const onPressSignInAlice = async () => { - await store.session.login({ + await login({ service: 'http://localhost:3000', identifier: 'alice.test', password: 'hunter2', }) } const onPressSignInBob = async () => { - await store.session.login({ + await login({ service: 'http://localhost:3000', identifier: 'bob.test', password: 'hunter2', @@ -45,7 +47,7 @@ export function TestCtrls() { /> <Pressable testID="e2eSignOut" - onPress={() => store.session.logout()} + onPress={() => logout()} accessibilityRole="button" style={BTN} /> diff --git a/src/view/com/util/AccountDropdownBtn.tsx b/src/view/com/util/AccountDropdownBtn.tsx index 158ed9b6d..96ce678ff 100644 --- a/src/view/com/util/AccountDropdownBtn.tsx +++ b/src/view/com/util/AccountDropdownBtn.tsx @@ -8,11 +8,11 @@ import {s} from 'lib/styles' import {usePalette} from 'lib/hooks/usePalette' import {DropdownItem, NativeDropdown} from './forms/NativeDropdown' import * as Toast from '../../com/util/Toast' -import {useSessionApi} from '#/state/session' +import {useSessionApi, SessionAccount} from '#/state/session' import {useLingui} from '@lingui/react' import {msg} from '@lingui/macro' -export function AccountDropdownBtn({handle}: {handle: string}) { +export function AccountDropdownBtn({account}: {account: SessionAccount}) { const pal = usePalette('default') const {removeAccount} = useSessionApi() const {_} = useLingui() @@ -21,7 +21,7 @@ export function AccountDropdownBtn({handle}: {handle: string}) { { label: 'Remove account', onPress: () => { - removeAccount({handle}) + removeAccount(account) Toast.show('Account removed from quick access') }, icon: { diff --git a/src/view/com/util/PostSandboxWarning.tsx b/src/view/com/util/PostSandboxWarning.tsx index 21f5f7b90..b2375c703 100644 --- a/src/view/com/util/PostSandboxWarning.tsx +++ b/src/view/com/util/PostSandboxWarning.tsx @@ -1,13 +1,13 @@ import React from 'react' import {StyleSheet, View} from 'react-native' import {Text} from './text/Text' -import {useStores} from 'state/index' import {usePalette} from 'lib/hooks/usePalette' +import {useSession} from '#/state/session' export function PostSandboxWarning() { - const store = useStores() + const {isSandbox} = useSession() const pal = usePalette('default') - if (store.session.isSandbox) { + if (isSandbox) { return ( <View style={styles.container}> <Text diff --git a/src/view/screens/Settings.tsx b/src/view/screens/Settings.tsx index e2cd4c9e7..e56a50d79 100644 --- a/src/view/screens/Settings.tsx +++ b/src/view/screens/Settings.tsx @@ -102,7 +102,7 @@ function SettingsAccountCard({account}: {account: SessionAccount}) { </Text> </TouchableOpacity> ) : ( - <AccountDropdownBtn handle={account.handle} /> + <AccountDropdownBtn account={account} /> )} </View> ) diff --git a/src/view/shell/Drawer.tsx b/src/view/shell/Drawer.tsx index 99e1d7d98..609348e4d 100644 --- a/src/view/shell/Drawer.tsx +++ b/src/view/shell/Drawer.tsx @@ -47,6 +47,57 @@ import {Trans, msg} from '@lingui/macro' import {useLingui} from '@lingui/react' import {useSetDrawerOpen} from '#/state/shell' import {useModalControls} from '#/state/modals' +import {useSession, SessionAccount} from '#/state/session' +import {useProfileQuery} from '#/state/queries/profile' + +export function DrawerProfileCard({ + account, + onPressProfile, +}: { + account: SessionAccount + onPressProfile: () => void +}) { + const {_} = useLingui() + const pal = usePalette('default') + const {data: profile} = useProfileQuery({did: account.did}) + + return ( + <TouchableOpacity + testID="profileCardButton" + accessibilityLabel={_(msg`Profile`)} + accessibilityHint="Navigates to your profile" + onPress={onPressProfile}> + <UserAvatar + size={80} + avatar={profile?.avatar} + // See https://github.com/bluesky-social/social-app/pull/1801: + usePlainRNImage={true} + /> + <Text + type="title-lg" + style={[pal.text, s.bold, styles.profileCardDisplayName]} + numberOfLines={1}> + {profile?.displayName || account.handle} + </Text> + <Text + type="2xl" + style={[pal.textLight, styles.profileCardHandle]} + numberOfLines={1}> + @{account.handle} + </Text> + <Text type="xl" style={[pal.textLight, styles.profileCardFollowers]}> + <Text type="xl-medium" style={pal.text}> + {formatCountShortOnly(profile?.followersCount ?? 0)} + </Text>{' '} + {pluralize(profile?.followersCount || 0, 'follower')} ·{' '} + <Text type="xl-medium" style={pal.text}> + {formatCountShortOnly(profile?.followsCount ?? 0)} + </Text>{' '} + following + </Text> + </TouchableOpacity> + ) +} export const DrawerContent = observer(function DrawerContentImpl() { const theme = useTheme() @@ -58,6 +109,7 @@ export const DrawerContent = observer(function DrawerContentImpl() { const {track} = useAnalytics() const {isAtHome, isAtSearch, isAtFeeds, isAtNotifications, isAtMyProfile} = useNavigationTabState() + const {currentAccount} = useSession() const {notifications} = store.me @@ -135,11 +187,11 @@ export const DrawerContent = observer(function DrawerContentImpl() { track('Menu:FeedbackClicked') Linking.openURL( FEEDBACK_FORM_URL({ - email: store.session.currentSession?.email, - handle: store.session.currentSession?.handle, + email: currentAccount?.email, + handle: currentAccount?.handle, }), ) - }, [track, store.session.currentSession]) + }, [track, currentAccount]) const onPressHelp = React.useCallback(() => { track('Menu:HelpClicked') @@ -159,42 +211,12 @@ export const DrawerContent = observer(function DrawerContentImpl() { <SafeAreaView style={s.flex1}> <ScrollView style={styles.main}> <View style={{}}> - <TouchableOpacity - testID="profileCardButton" - accessibilityLabel={_(msg`Profile`)} - accessibilityHint="Navigates to your profile" - onPress={onPressProfile}> - <UserAvatar - size={80} - avatar={store.me.avatar} - // See https://github.com/bluesky-social/social-app/pull/1801: - usePlainRNImage={true} + {currentAccount && ( + <DrawerProfileCard + account={currentAccount} + onPressProfile={onPressProfile} /> - <Text - type="title-lg" - style={[pal.text, s.bold, styles.profileCardDisplayName]} - numberOfLines={1}> - {store.me.displayName || store.me.handle} - </Text> - <Text - type="2xl" - style={[pal.textLight, styles.profileCardHandle]} - numberOfLines={1}> - @{store.me.handle} - </Text> - <Text - type="xl" - style={[pal.textLight, styles.profileCardFollowers]}> - <Text type="xl-medium" style={pal.text}> - {formatCountShortOnly(store.me.followersCount ?? 0)} - </Text>{' '} - {pluralize(store.me.followersCount || 0, 'follower')} ·{' '} - <Text type="xl-medium" style={pal.text}> - {formatCountShortOnly(store.me.followsCount ?? 0)} - </Text>{' '} - following - </Text> - </TouchableOpacity> + )} </View> <InviteCodes style={{paddingLeft: 0}} /> diff --git a/src/view/shell/desktop/RightNav.tsx b/src/view/shell/desktop/RightNav.tsx index cb62b4be2..98f54c7ed 100644 --- a/src/view/shell/desktop/RightNav.tsx +++ b/src/view/shell/desktop/RightNav.tsx @@ -17,10 +17,9 @@ import {useModalControls} from '#/state/modals' import {useSession} from '#/state/session' export const DesktopRightNav = observer(function DesktopRightNavImpl() { - const store = useStores() const pal = usePalette('default') const palError = usePalette('error') - const {hasSession, currentAccount} = useSession() + const {isSandbox, hasSession, currentAccount} = useSession() const {isTablet} = useWebMediaQueries() if (isTablet) { @@ -32,7 +31,7 @@ export const DesktopRightNav = observer(function DesktopRightNavImpl() { {hasSession && <DesktopSearch />} {hasSession && <DesktopFeeds />} <View style={styles.message}> - {store.session.isSandbox ? ( + {isSandbox ? ( <View style={[palError.view, styles.messageLine, s.p10]}> <Text type="md" style={[palError.text, s.bold]}> SANDBOX. Posts and accounts are not permanent. |