tooot/src/screens/Tabs/Shared/Hashtag.tsx

88 lines
2.8 KiB
TypeScript

import haptics from '@components/haptics'
import { HeaderLeft, HeaderRight } from '@components/Header'
import { displayMessage } from '@components/Message'
import Timeline from '@components/Timeline'
import { useQueryClient } from '@tanstack/react-query'
import { featureCheck } from '@utils/helpers/featureCheck'
import { TabSharedStackScreenProps } from '@utils/navigation/navigators'
import { QueryKeyFollowedTags, useTagsMutation, useTagsQuery } from '@utils/queryHooks/tags'
import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
import React, { useEffect } from 'react'
import { useTranslation } from 'react-i18next'
const TabSharedHashtag: React.FC<TabSharedStackScreenProps<'Tab-Shared-Hashtag'>> = ({
navigation,
route: {
params: { hashtag }
}
}) => {
const queryKey: QueryKeyTimeline = ['Timeline', { page: 'Hashtag', hashtag }]
useEffect(() => {
navigation.setOptions({
headerLeft: () => <HeaderLeft onPress={() => navigation.goBack()} />,
title: `#${decodeURIComponent(hashtag)}`
})
navigation.setParams({ queryKey: queryKey })
}, [])
const { t } = useTranslation(['common', 'screenTabs'])
const canFollowTags = featureCheck('follow_tags')
const { data, isFetching, refetch } = useTagsQuery({
tag: hashtag,
options: { enabled: canFollowTags }
})
const queryClient = useQueryClient()
const mutation = useTagsMutation({
onSuccess: () => {
haptics('Success')
refetch()
const queryKeyFollowedTags: QueryKeyFollowedTags = ['FollowedTags']
queryClient.invalidateQueries({ queryKey: queryKeyFollowedTags })
},
onError: (err: any, { to }) => {
displayMessage({
type: 'error',
message: t('common:message.error.message', {
function: to
? t('screenTabs:shared.hashtag.follow')
: t('screenTabs:shared.hashtag.unfollow')
}),
...(err.status &&
typeof err.status === 'number' &&
err.data &&
err.data.error &&
typeof err.data.error === 'string' && {
description: err.data.error
})
})
}
})
useEffect(() => {
if (!canFollowTags) return
navigation.setOptions({
headerRight: () => (
<HeaderRight
loading={isFetching || mutation.isLoading}
type='text'
content={
data?.following
? t('screenTabs:shared.hashtag.unfollow')
: t('screenTabs:shared.hashtag.follow')
}
onPress={() =>
typeof data?.following === 'boolean' &&
mutation.mutate({ tag: hashtag, to: !data.following })
}
/>
)
})
}, [canFollowTags, data?.following, isFetching])
return <Timeline queryKey={queryKey} />
}
export default TabSharedHashtag