diff --git a/apps/mobile/src/components/ui/image/Image.tsx b/apps/mobile/src/components/ui/image/Image.tsx index 2548af529..18b77ea44 100644 --- a/apps/mobile/src/components/ui/image/Image.tsx +++ b/apps/mobile/src/components/ui/image/Image.tsx @@ -1,4 +1,8 @@ -import type { ImageErrorEventData, ImageProps as ExpoImageProps } from "expo-image" +import type { + ImageErrorEventData, + ImageLoadEventData, + ImageProps as ExpoImageProps, +} from "expo-image" import { Image as ExpoImage } from "expo-image" import { forwardRef, useCallback, useMemo, useState } from "react" import { useColor } from "react-native-uikit-colors" @@ -38,9 +42,13 @@ export const Image = forwardRef( ) const [isLoading, setIsLoading] = useState(true) - const onLoad = useCallback(() => { - setIsLoading(false) - }, []) + const onLoad = useCallback( + (e: ImageLoadEventData) => { + setIsLoading(false) + rest.onLoad?.(e) + }, + [rest], + ) const backgroundColor = useColor("systemFill") @@ -50,6 +58,8 @@ export const Image = forwardRef( return ( ( ...(typeof rest.style === "object" && { ...rest.style }), ...(isLoading && { backgroundColor }), }} - recyclingKey={source?.uri} - {...rest} ref={ref} /> ) diff --git a/apps/mobile/src/modules/entry-content/EntryReadHistory.tsx b/apps/mobile/src/modules/entry-content/EntryReadHistory.tsx index 246f73ba0..d6f99e542 100644 --- a/apps/mobile/src/modules/entry-content/EntryReadHistory.tsx +++ b/apps/mobile/src/modules/entry-content/EntryReadHistory.tsx @@ -62,7 +62,13 @@ export const EntryReadHistory = ({ entryId }: { entryId: string }) => { ], }} > - + ) })}