diff options
Diffstat (limited to 'src/components')
5 files changed, 68 insertions, 90 deletions
diff --git a/src/components/PostControls/RepostButton.web.tsx b/src/components/PostControls/RepostButton.web.tsx index 48720b753..e8e02d2c0 100644 --- a/src/components/PostControls/RepostButton.web.tsx +++ b/src/components/PostControls/RepostButton.web.tsx @@ -62,11 +62,17 @@ export const RepostButton = ({ </Menu.Trigger> <Menu.Outer style={{minWidth: 170}}> <Menu.Item - label={isReposted ? _(msg`Undo repost`) : _(msg`Repost`)} + label={ + isReposted + ? _(msg`Undo repost`) + : _(msg({message: `Repost`, context: `action`})) + } testID="repostDropdownRepostBtn" onPress={onRepost}> <Menu.ItemText> - {isReposted ? _(msg`Undo repost`) : _(msg`Repost`)} + {isReposted + ? _(msg`Undo repost`) + : _(msg({message: `Repost`, context: `action`}))} </Menu.ItemText> <Menu.ItemIcon icon={Repost} position="right" /> </Menu.Item> diff --git a/src/components/VideoPostCard.tsx b/src/components/VideoPostCard.tsx index c28adad8b..191c7b82a 100644 --- a/src/components/VideoPostCard.tsx +++ b/src/components/VideoPostCard.tsx @@ -390,6 +390,7 @@ export function CompactVideoPostCard({ if (!AppBskyEmbedVideo.isView(embed)) return null const likeCount = post?.likeCount ?? 0 + const showLikeCount = false const {thumbnail} = embed const black = getBlackColor(t) @@ -475,47 +476,51 @@ export function CompactVideoPostCard({ /> <MediaInsetBorder /> - <View style={[a.absolute, a.inset_0]}> + <View style={[a.absolute, a.inset_0, t.atoms.shadow_sm]}> <View style={[a.absolute, a.inset_0, a.p_sm, {bottom: 'auto'}]}> <View - style={[a.relative, a.rounded_full, {width: 20, height: 20}]}> + style={[a.relative, a.rounded_full, {width: 24, height: 24}]}> <UserAvatar type="user" - size={20} + size={24} avatar={post.author.avatar} /> <MediaInsetBorder /> </View> </View> - <View - style={[ - a.absolute, - a.inset_0, - a.pt_2xl, - { - top: 'auto', - }, - ]}> - <LinearGradient - colors={[black, 'rgba(0, 0, 0, 0)']} - locations={[0.02, 1]} - start={{x: 0, y: 1}} - end={{x: 0, y: 0}} - style={[a.absolute, a.inset_0, {opacity: 0.9}]} - /> + {showLikeCount && ( <View - style={[a.relative, a.z_10, a.p_sm, a.flex_row, a.gap_md]}> - {likeCount > 0 && ( - <View style={[a.flex_row, a.align_center, a.gap_xs]}> - <Heart size="sm" fill="white" /> - <Text style={[a.text_sm, a.font_bold, {color: 'white'}]}> - {formatCount(i18n, likeCount)} - </Text> - </View> - )} + style={[ + a.absolute, + a.inset_0, + a.pt_2xl, + { + top: 'auto', + }, + ]}> + <LinearGradient + colors={[black, 'rgba(0, 0, 0, 0)']} + locations={[0.02, 1]} + start={{x: 0, y: 1}} + end={{x: 0, y: 0}} + style={[a.absolute, a.inset_0, {opacity: 0.9}]} + /> + + <View + style={[a.relative, a.z_10, a.p_sm, a.flex_row, a.gap_md]}> + {likeCount > 0 && ( + <View style={[a.flex_row, a.align_center, a.gap_xs]}> + <Heart size="sm" fill="white" /> + <Text + style={[a.text_sm, a.font_bold, {color: 'white'}]}> + {formatCount(i18n, likeCount)} + </Text> + </View> + )} + </View> </View> - </View> + )} </View> </View> </Hider.Content> diff --git a/src/components/dialogs/EmailDialog/data/useAccountEmailState.ts b/src/components/dialogs/EmailDialog/data/useAccountEmailState.ts index 377411107..f25369f8d 100644 --- a/src/components/dialogs/EmailDialog/data/useAccountEmailState.ts +++ b/src/components/dialogs/EmailDialog/data/useAccountEmailState.ts @@ -1,7 +1,7 @@ -import {useCallback, useEffect, useState} from 'react' -import {useQuery, useQueryClient} from '@tanstack/react-query' +import {useEffect, useMemo, useState} from 'react' +import {useQuery} from '@tanstack/react-query' -import {useAgent} from '#/state/session' +import {useAgent, useSessionApi} from '#/state/session' import {emitEmailVerified} from '#/components/dialogs/EmailDialog/events' export type AccountEmailState = { @@ -11,57 +11,36 @@ export type AccountEmailState = { export const accountEmailStateQueryKey = ['accountEmailState'] as const -export function useInvalidateAccountEmailState() { - const qc = useQueryClient() - - return useCallback(() => { - return qc.invalidateQueries({ - queryKey: accountEmailStateQueryKey, - }) - }, [qc]) -} - -export function useUpdateAccountEmailStateQueryCache() { - const qc = useQueryClient() - - return useCallback( - (data: AccountEmailState) => { - return qc.setQueriesData( - { - queryKey: accountEmailStateQueryKey, - }, - data, - ) - }, - [qc], - ) -} - export function useAccountEmailState() { const agent = useAgent() + const {partialRefreshSession} = useSessionApi() const [prevIsEmailVerified, setPrevEmailIsVerified] = useState( !!agent.session?.emailConfirmed, ) - const fallbackData: AccountEmailState = { - isEmailVerified: !!agent.session?.emailConfirmed, - email2FAEnabled: !!agent.session?.emailAuthFactor, - } - const query = useQuery<AccountEmailState>({ + const state: AccountEmailState = useMemo( + () => ({ + isEmailVerified: !!agent.session?.emailConfirmed, + email2FAEnabled: !!agent.session?.emailAuthFactor, + }), + [agent.session], + ) + + /** + * Only here to refetch on focus, when necessary + */ + useQuery({ enabled: !!agent.session, - refetchOnWindowFocus: true, + /** + * Only refetch if the email verification s incomplete. + */ + refetchOnWindowFocus: !prevIsEmailVerified, queryKey: accountEmailStateQueryKey, queryFn: async () => { - // will also trigger updates to `#/state/session` data - const {data} = await agent.resumeSession(agent.session!) - return { - isEmailVerified: !!data.emailConfirmed, - email2FAEnabled: !!data.emailAuthFactor, - } + await partialRefreshSession() + return null }, }) - const state = query.data ?? fallbackData - /* * This will emit `n` times for each instance of this hook. So the listeners * all use `once` to prevent multiple handlers firing. diff --git a/src/components/dialogs/EmailDialog/data/useConfirmEmail.ts b/src/components/dialogs/EmailDialog/data/useConfirmEmail.ts index 73f824fcc..475a8cbfb 100644 --- a/src/components/dialogs/EmailDialog/data/useConfirmEmail.ts +++ b/src/components/dialogs/EmailDialog/data/useConfirmEmail.ts @@ -1,13 +1,10 @@ import {useMutation} from '@tanstack/react-query' import {useAgent, useSession} from '#/state/session' -import {useUpdateAccountEmailStateQueryCache} from '#/components/dialogs/EmailDialog/data/useAccountEmailState' export function useConfirmEmail() { const agent = useAgent() const {currentAccount} = useSession() - const updateAccountEmailStateQueryCache = - useUpdateAccountEmailStateQueryCache() return useMutation({ mutationFn: async ({token}: {token: string}) => { @@ -19,11 +16,8 @@ export function useConfirmEmail() { email: currentAccount.email, token: token.trim(), }) - const {data} = await agent.resumeSession(agent.session!) - updateAccountEmailStateQueryCache({ - isEmailVerified: !!data.emailConfirmed, - email2FAEnabled: !!data.emailAuthFactor, - }) + // will update session state at root of app + await agent.resumeSession(agent.session!) }, }) } diff --git a/src/components/dialogs/EmailDialog/data/useManageEmail2FA.ts b/src/components/dialogs/EmailDialog/data/useManageEmail2FA.ts index 39f5fd2d9..358bf8654 100644 --- a/src/components/dialogs/EmailDialog/data/useManageEmail2FA.ts +++ b/src/components/dialogs/EmailDialog/data/useManageEmail2FA.ts @@ -1,13 +1,10 @@ import {useMutation} from '@tanstack/react-query' import {useAgent, useSession} from '#/state/session' -import {useUpdateAccountEmailStateQueryCache} from '#/components/dialogs/EmailDialog/data/useAccountEmailState' export function useManageEmail2FA() { const agent = useAgent() const {currentAccount} = useSession() - const updateAccountEmailStateQueryCache = - useUpdateAccountEmailStateQueryCache() return useMutation({ mutationFn: async ({ @@ -25,11 +22,8 @@ export function useManageEmail2FA() { emailAuthFactor: enabled, token, }) - const {data} = await agent.resumeSession(agent.session!) - updateAccountEmailStateQueryCache({ - isEmailVerified: !!data.emailConfirmed, - email2FAEnabled: !!data.emailAuthFactor, - }) + // will update session state at root of app + await agent.resumeSession(agent.session!) }, }) } |