mirror of https://github.com/tooot-app/app
Fixed #575
This commit is contained in:
parent
96a448d602
commit
909fed0644
|
@ -1,2 +1,3 @@
|
||||||
Enjoy toooting! This version includes following improvements and fixes:
|
Enjoy toooting! This version includes following improvements and fixes:
|
||||||
- Align filter experience with v4.0 and above
|
- Align filter experience with v4.0 and above
|
||||||
|
- Supports enlarging user's avatar and banner
|
||||||
|
|
|
@ -1,2 +1,3 @@
|
||||||
toooting愉快!此版本包括以下改进和修复:
|
toooting愉快!此版本包括以下改进和修复:
|
||||||
- 改进过滤体验,与v4.0以上版本一致
|
- 改进过滤体验,与v4.0以上版本一致
|
||||||
|
- 支持查看用户的头像和横幅图片
|
||||||
|
|
|
@ -70,7 +70,6 @@ const TimelineAttachment = () => {
|
||||||
preview_url: attachment.preview_url,
|
preview_url: attachment.preview_url,
|
||||||
url: attachment.url,
|
url: attachment.url,
|
||||||
remote_url: attachment.remote_url,
|
remote_url: attachment.remote_url,
|
||||||
blurhash: attachment.blurhash,
|
|
||||||
width: attachment.meta?.original?.width,
|
width: attachment.meta?.original?.width,
|
||||||
height: attachment.meta?.original?.height
|
height: attachment.meta?.original?.height
|
||||||
}
|
}
|
||||||
|
@ -90,7 +89,6 @@ const TimelineAttachment = () => {
|
||||||
preview_url: attachment.preview_url,
|
preview_url: attachment.preview_url,
|
||||||
url: attachment.url,
|
url: attachment.url,
|
||||||
remote_url: attachment.remote_url,
|
remote_url: attachment.remote_url,
|
||||||
blurhash: attachment.blurhash,
|
|
||||||
width: attachment.meta?.original?.width,
|
width: attachment.meta?.original?.width,
|
||||||
height: attachment.meta?.original?.height
|
height: attachment.meta?.original?.height
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,7 +25,7 @@ const ZoomFlatList = createZoomListComponent(FlatList)
|
||||||
|
|
||||||
const ScreenImagesViewer = ({
|
const ScreenImagesViewer = ({
|
||||||
route: {
|
route: {
|
||||||
params: { imageUrls, id }
|
params: { imageUrls, id, hideCounter }
|
||||||
},
|
},
|
||||||
navigation
|
navigation
|
||||||
}: RootStackScreenProps<'Screen-ImagesViewer'>) => {
|
}: RootStackScreenProps<'Screen-ImagesViewer'>) => {
|
||||||
|
@ -159,7 +159,9 @@ const ScreenImagesViewer = ({
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<HeaderLeft content='X' native={false} background onPress={() => navigation.goBack()} />
|
<HeaderLeft content='X' native={false} background onPress={() => navigation.goBack()} />
|
||||||
|
{!hideCounter ? (
|
||||||
<HeaderCenter inverted content={`${currentIndex + 1} / ${imageUrls.length}`} />
|
<HeaderCenter inverted content={`${currentIndex + 1} / ${imageUrls.length}`} />
|
||||||
|
) : null}
|
||||||
<HeaderRight
|
<HeaderRight
|
||||||
accessibilityLabel={t('content.actions.accessibilityLabel')}
|
accessibilityLabel={t('content.actions.accessibilityLabel')}
|
||||||
accessibilityHint={t('content.actions.accessibilityHint')}
|
accessibilityHint={t('content.actions.accessibilityHint')}
|
||||||
|
|
|
@ -1,22 +1,36 @@
|
||||||
import Button from '@components/Button'
|
|
||||||
import GracefullyImage from '@components/GracefullyImage'
|
import GracefullyImage from '@components/GracefullyImage'
|
||||||
|
import navigationRef from '@helpers/navigationRef'
|
||||||
|
import { getInstanceActive } from '@utils/slices/instancesSlice'
|
||||||
import { useTheme } from '@utils/styles/ThemeManager'
|
import { useTheme } from '@utils/styles/ThemeManager'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { Dimensions, View } from 'react-native'
|
import { Dimensions, Image, Pressable } from 'react-native'
|
||||||
import { useSafeAreaInsets } from 'react-native-safe-area-context'
|
import { useSafeAreaInsets } from 'react-native-safe-area-context'
|
||||||
|
import { useSelector } from 'react-redux'
|
||||||
|
|
||||||
export interface Props {
|
export interface Props {
|
||||||
account?: Mastodon.Account
|
account?: Mastodon.Account
|
||||||
edit?: boolean
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const AccountHeader = React.memo(
|
const AccountHeader: React.FC<Props> = ({ account }) => {
|
||||||
({ account, edit }: Props) => {
|
|
||||||
const { colors } = useTheme()
|
const { colors } = useTheme()
|
||||||
const topInset = useSafeAreaInsets().top
|
const topInset = useSafeAreaInsets().top
|
||||||
|
|
||||||
|
useSelector(getInstanceActive)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View>
|
<Pressable
|
||||||
|
onPress={() => {
|
||||||
|
if (account) {
|
||||||
|
Image.getSize(account.header, (width, height) =>
|
||||||
|
navigationRef.navigate('Screen-ImagesViewer', {
|
||||||
|
imageUrls: [{ id: 'avatar', url: account.header, width, height }],
|
||||||
|
id: 'avatar',
|
||||||
|
hideCounter: true
|
||||||
|
})
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
<GracefullyImage
|
<GracefullyImage
|
||||||
uri={{ original: account?.header, static: account?.header_static }}
|
uri={{ original: account?.header, static: account?.header_static }}
|
||||||
style={{
|
style={{
|
||||||
|
@ -24,24 +38,8 @@ const AccountHeader = React.memo(
|
||||||
backgroundColor: colors.disabled
|
backgroundColor: colors.disabled
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
{edit ? (
|
</Pressable>
|
||||||
<View
|
|
||||||
style={{
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
alignContent: 'center',
|
|
||||||
justifyContent: 'center',
|
|
||||||
alignItems: 'center'
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Button type='icon' content='Edit' round onPress={() => {}} />
|
|
||||||
</View>
|
|
||||||
) : null}
|
|
||||||
</View>
|
|
||||||
)
|
)
|
||||||
},
|
}
|
||||||
(_, next) => next.account === undefined
|
|
||||||
)
|
|
||||||
|
|
||||||
export default AccountHeader
|
export default AccountHeader
|
||||||
|
|
|
@ -1,28 +1,37 @@
|
||||||
import Button from '@components/Button'
|
|
||||||
import GracefullyImage from '@components/GracefullyImage'
|
import GracefullyImage from '@components/GracefullyImage'
|
||||||
|
import navigationRef from '@helpers/navigationRef'
|
||||||
import { useNavigation } from '@react-navigation/native'
|
import { useNavigation } from '@react-navigation/native'
|
||||||
import { StackNavigationProp } from '@react-navigation/stack'
|
import { StackNavigationProp } from '@react-navigation/stack'
|
||||||
import { TabLocalStackParamList } from '@utils/navigation/navigators'
|
import { TabLocalStackParamList } from '@utils/navigation/navigators'
|
||||||
import { getInstanceActive } from '@utils/slices/instancesSlice'
|
import { getInstanceActive } from '@utils/slices/instancesSlice'
|
||||||
import { StyleConstants } from '@utils/styles/constants'
|
import { StyleConstants } from '@utils/styles/constants'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { Pressable, View } from 'react-native'
|
import { Pressable } from 'react-native'
|
||||||
import { useSelector } from 'react-redux'
|
import { useSelector } from 'react-redux'
|
||||||
|
|
||||||
export interface Props {
|
export interface Props {
|
||||||
account: Mastodon.Account | undefined
|
account: Mastodon.Account | undefined
|
||||||
myInfo: boolean
|
myInfo: boolean
|
||||||
edit?: boolean
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const AccountInformationAvatar: React.FC<Props> = ({ account, myInfo, edit }) => {
|
const AccountInformationAvatar: React.FC<Props> = ({ account, myInfo }) => {
|
||||||
const navigation = useNavigation<StackNavigationProp<TabLocalStackParamList>>()
|
const navigation = useNavigation<StackNavigationProp<TabLocalStackParamList>>()
|
||||||
useSelector(getInstanceActive)
|
useSelector(getInstanceActive)
|
||||||
return (
|
return (
|
||||||
<Pressable
|
<Pressable
|
||||||
disabled={!myInfo}
|
|
||||||
onPress={() => {
|
onPress={() => {
|
||||||
myInfo && account && navigation.push('Tab-Shared-Account', { account })
|
if (account) {
|
||||||
|
if (myInfo) {
|
||||||
|
navigation.push('Tab-Shared-Account', { account })
|
||||||
|
return
|
||||||
|
} else {
|
||||||
|
navigationRef.navigate('Screen-ImagesViewer', {
|
||||||
|
imageUrls: [{ id: 'avatar', url: account.avatar }],
|
||||||
|
id: 'avatar',
|
||||||
|
hideCounter: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
}}
|
}}
|
||||||
style={{
|
style={{
|
||||||
borderRadius: 8,
|
borderRadius: 8,
|
||||||
|
@ -36,20 +45,6 @@ const AccountInformationAvatar: React.FC<Props> = ({ account, myInfo, edit }) =>
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
uri={{ original: account?.avatar, static: account?.avatar_static }}
|
uri={{ original: account?.avatar, static: account?.avatar_static }}
|
||||||
/>
|
/>
|
||||||
{edit ? (
|
|
||||||
<View
|
|
||||||
style={{
|
|
||||||
position: 'absolute',
|
|
||||||
width: '100%',
|
|
||||||
height: '100%',
|
|
||||||
alignContent: 'center',
|
|
||||||
justifyContent: 'center',
|
|
||||||
alignItems: 'center'
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Button type='icon' content='Edit' round onPress={() => {}} />
|
|
||||||
</View>
|
|
||||||
) : null}
|
|
||||||
</Pressable>
|
</Pressable>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -51,14 +51,14 @@ export type RootStackParamList = {
|
||||||
'Screen-ImagesViewer': {
|
'Screen-ImagesViewer': {
|
||||||
imageUrls: {
|
imageUrls: {
|
||||||
id: Mastodon.Attachment['id']
|
id: Mastodon.Attachment['id']
|
||||||
preview_url: Mastodon.AttachmentImage['preview_url']
|
preview_url?: Mastodon.AttachmentImage['preview_url']
|
||||||
url: Mastodon.AttachmentImage['url']
|
url: Mastodon.AttachmentImage['url']
|
||||||
remote_url?: Mastodon.AttachmentImage['remote_url']
|
remote_url?: Mastodon.AttachmentImage['remote_url']
|
||||||
blurhash: Mastodon.AttachmentImage['blurhash']
|
|
||||||
width?: number
|
width?: number
|
||||||
height?: number
|
height?: number
|
||||||
}[]
|
}[]
|
||||||
id: Mastodon.Attachment['id']
|
id: Mastodon.Attachment['id']
|
||||||
|
hideCounter?: boolean
|
||||||
}
|
}
|
||||||
'Screen-AccountSelection': {
|
'Screen-AccountSelection': {
|
||||||
component?: () => JSX.Element | undefined
|
component?: () => JSX.Element | undefined
|
||||||
|
|
Loading…
Reference in New Issue