tooot/src/components/Timeline/Shared/Avatar.tsx

63 lines
1.9 KiB
TypeScript
Raw Normal View History

2021-01-16 00:00:31 +01:00
import GracefullyImage from '@components/GracefullyImage'
2021-02-14 00:27:21 +01:00
import { useNavigation } from '@react-navigation/native'
2021-01-24 02:25:43 +01:00
import { StackNavigationProp } from '@react-navigation/stack'
2022-04-29 23:57:18 +02:00
import { TabLocalStackParamList } from '@utils/navigation/navigators'
2021-02-14 00:27:21 +01:00
import { StyleConstants } from '@utils/styles/constants'
2022-12-03 20:47:11 +01:00
import React, { useContext } from 'react'
2021-04-09 21:43:12 +02:00
import { useTranslation } from 'react-i18next'
2022-12-03 20:47:11 +01:00
import StatusContext from './Context'
2020-11-23 00:07:32 +01:00
2020-10-31 21:04:46 +01:00
export interface Props {
2022-12-03 20:47:11 +01:00
account?: Mastodon.Account
2020-10-31 21:04:46 +01:00
}
2022-12-03 20:47:11 +01:00
const TimelineAvatar: React.FC<Props> = ({ account }) => {
const { status, highlighted, disableDetails, disableOnPress, isConversation, inThread } =
2022-12-16 00:21:53 +01:00
useContext(StatusContext)
2022-12-03 20:47:11 +01:00
const actualAccount = account || status?.account
if (!actualAccount) return null
2022-11-29 23:44:11 +01:00
const { t } = useTranslation('componentTimeline')
const navigation = useNavigation<StackNavigationProp<TabLocalStackParamList>>()
2020-11-28 17:07:30 +01:00
2022-11-29 23:44:11 +01:00
return (
<GracefullyImage
{...(highlighted && {
accessibilityLabel: t('shared.avatar.accessibilityLabel', {
2022-12-03 20:47:11 +01:00
name: actualAccount.display_name
2022-11-29 23:44:11 +01:00
}),
accessibilityHint: t('shared.avatar.accessibilityHint', {
2022-12-03 20:47:11 +01:00
name: actualAccount.display_name
2022-11-29 23:44:11 +01:00
})
})}
2022-12-03 20:47:11 +01:00
onPress={() =>
2023-01-29 17:28:49 +01:00
!disableOnPress && navigation.push('Tab-Shared-Account', { account: actualAccount })
2022-12-03 20:47:11 +01:00
}
2023-02-08 01:10:59 +01:00
sources={{
default: { uri: actualAccount.avatar },
static: { uri: actualAccount.avatar_static }
}}
2022-12-11 14:08:27 +01:00
dimension={
2022-12-16 00:21:53 +01:00
disableDetails || isConversation
2022-12-11 14:08:27 +01:00
? {
width: StyleConstants.Avatar.XS,
height: StyleConstants.Avatar.XS
}
: {
width: StyleConstants.Avatar.M,
height: StyleConstants.Avatar.M
}
}
2022-11-29 23:44:11 +01:00
style={{
2023-02-12 18:38:06 +01:00
borderRadius: 99,
2022-11-29 23:44:11 +01:00
overflow: 'hidden',
2022-12-18 23:15:58 +01:00
marginRight: StyleConstants.Spacing.S
2022-11-29 23:44:11 +01:00
}}
2023-01-29 17:28:49 +01:00
dim
withoutTransition={inThread}
2022-11-29 23:44:11 +01:00
/>
)
2022-12-03 20:47:11 +01:00
}
2020-10-25 01:35:41 +02:00
2021-02-27 16:33:54 +01:00
export default TimelineAvatar