mirror of
https://github.com/tooot-app/app
synced 2025-06-05 22:19:13 +02:00
Update image viewer index seraching
This commit is contained in:
4
src/@types/react-navigation.d.ts
vendored
4
src/@types/react-navigation.d.ts
vendored
@ -50,14 +50,14 @@ declare namespace Nav {
|
|||||||
| undefined
|
| undefined
|
||||||
'Screen-ImagesViewer': {
|
'Screen-ImagesViewer': {
|
||||||
imageUrls: {
|
imageUrls: {
|
||||||
|
id: Mastodon.Attachment['id']
|
||||||
url: Mastodon.AttachmentImage['url']
|
url: Mastodon.AttachmentImage['url']
|
||||||
width?: number
|
width?: number
|
||||||
height?: number
|
height?: number
|
||||||
preview_url: Mastodon.AttachmentImage['preview_url']
|
preview_url: Mastodon.AttachmentImage['preview_url']
|
||||||
remote_url?: Mastodon.AttachmentImage['remote_url']
|
remote_url?: Mastodon.AttachmentImage['remote_url']
|
||||||
imageIndex: number
|
|
||||||
}[]
|
}[]
|
||||||
imageIndex: number
|
id: Mastodon.Attachment['id']
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -35,10 +35,10 @@ const TimelineAttachment = React.memo(
|
|||||||
|
|
||||||
let imageUrls: Nav.RootStackParamList['Screen-ImagesViewer']['imageUrls'] = []
|
let imageUrls: Nav.RootStackParamList['Screen-ImagesViewer']['imageUrls'] = []
|
||||||
const navigation = useNavigation()
|
const navigation = useNavigation()
|
||||||
const navigateToImagesViewer = (imageIndex: number) =>
|
const navigateToImagesViewer = (id: string) =>
|
||||||
navigation.navigate('Screen-ImagesViewer', {
|
navigation.navigate('Screen-ImagesViewer', {
|
||||||
imageUrls,
|
imageUrls,
|
||||||
imageIndex
|
id
|
||||||
})
|
})
|
||||||
const attachments = useMemo(
|
const attachments = useMemo(
|
||||||
() =>
|
() =>
|
||||||
@ -46,12 +46,12 @@ const TimelineAttachment = React.memo(
|
|||||||
switch (attachment.type) {
|
switch (attachment.type) {
|
||||||
case 'image':
|
case 'image':
|
||||||
imageUrls.push({
|
imageUrls.push({
|
||||||
|
id: attachment.id,
|
||||||
url: attachment.url,
|
url: attachment.url,
|
||||||
preview_url: attachment.preview_url,
|
preview_url: attachment.preview_url,
|
||||||
remote_url: attachment.remote_url,
|
remote_url: attachment.remote_url,
|
||||||
width: attachment.meta?.original?.width,
|
width: attachment.meta?.original?.width,
|
||||||
height: attachment.meta?.original?.height,
|
height: attachment.meta?.original?.height
|
||||||
imageIndex: index
|
|
||||||
})
|
})
|
||||||
return (
|
return (
|
||||||
<AttachmentImage
|
<AttachmentImage
|
||||||
|
@ -10,14 +10,14 @@ export interface Props {
|
|||||||
index: number
|
index: number
|
||||||
sensitiveShown: boolean
|
sensitiveShown: boolean
|
||||||
image: Mastodon.AttachmentImage
|
image: Mastodon.AttachmentImage
|
||||||
navigateToImagesViewer: (imageIndex: number) => void
|
navigateToImagesViewer: (imageIndex: string) => void
|
||||||
}
|
}
|
||||||
|
|
||||||
const AttachmentImage = React.memo(
|
const AttachmentImage = React.memo(
|
||||||
({ total, index, sensitiveShown, image, navigateToImagesViewer }: Props) => {
|
({ total, index, sensitiveShown, image, navigateToImagesViewer }: Props) => {
|
||||||
const onPress = useCallback(() => {
|
const onPress = useCallback(() => {
|
||||||
analytics('timeline_shared_attachment_image_press', { id: image.id })
|
analytics('timeline_shared_attachment_image_press', { id: image.id })
|
||||||
navigateToImagesViewer(index)
|
navigateToImagesViewer(image.id)
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
Submodule src/modules/react-native-image-viewing updated: 60ea23a675...2ef5346281
@ -34,7 +34,6 @@ const HeaderComponent = React.memo(
|
|||||||
height?: number | undefined
|
height?: number | undefined
|
||||||
preview_url: string
|
preview_url: string
|
||||||
remote_url?: string | undefined
|
remote_url?: string | undefined
|
||||||
imageIndex: number
|
|
||||||
}[]
|
}[]
|
||||||
}) => {
|
}) => {
|
||||||
const insets = useSafeAreaInsets()
|
const insets = useSafeAreaInsets()
|
||||||
@ -134,7 +133,7 @@ export type ScreenImagesViewerProp = StackScreenProps<
|
|||||||
|
|
||||||
const ScreenImagesViewer = ({
|
const ScreenImagesViewer = ({
|
||||||
route: {
|
route: {
|
||||||
params: { imageUrls, imageIndex }
|
params: { imageUrls, id }
|
||||||
},
|
},
|
||||||
navigation
|
navigation
|
||||||
}: ScreenImagesViewerProp) => {
|
}: ScreenImagesViewerProp) => {
|
||||||
@ -142,16 +141,15 @@ const ScreenImagesViewer = ({
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
const [currentIndex, setCurrentIndex] = useState(
|
const initialIndex = findIndex(imageUrls, ['id', id])
|
||||||
findIndex(imageUrls, ['imageIndex', imageIndex])
|
const [currentIndex, setCurrentIndex] = useState(initialIndex)
|
||||||
)
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SafeAreaProvider>
|
<SafeAreaProvider>
|
||||||
<StatusBar backgroundColor='rgb(0,0,0)' />
|
<StatusBar backgroundColor='rgb(0,0,0)' />
|
||||||
<ImageView
|
<ImageView
|
||||||
images={imageUrls}
|
images={imageUrls}
|
||||||
imageIndex={imageIndex}
|
imageIndex={initialIndex}
|
||||||
onImageIndexChange={index => setCurrentIndex(index)}
|
onImageIndexChange={index => setCurrentIndex(index)}
|
||||||
onRequestClose={() => navigation.goBack()}
|
onRequestClose={() => navigation.goBack()}
|
||||||
HeaderComponent={() => (
|
HeaderComponent={() => (
|
||||||
|
Reference in New Issue
Block a user