diff --git a/src/common/api/queries.ts b/src/common/api/queries.ts index da0159f682b..60d103a96a4 100644 --- a/src/common/api/queries.ts +++ b/src/common/api/queries.ts @@ -39,7 +39,13 @@ export function usePointsQuery(username: string, filter = 0) { ); } -export function useImageDownloader(entry: Entry, noImage: string, width: number, height: number) { +export function useImageDownloader( + entry: Entry, + noImage: string, + width: number, + height: number, + enabled: boolean +) { const { global } = useMappedStore(); const blobToBase64 = (blob: Blob) => { @@ -77,6 +83,7 @@ export function useImageDownloader(entry: Entry, noImage: string, width: number, } }, { + enabled, retryDelay: 3000 } ); diff --git a/src/common/components/entry-list-item/entry-list-item-thumbnail.tsx b/src/common/components/entry-list-item/entry-list-item-thumbnail.tsx index 70084e221fc..0914d676fd5 100644 --- a/src/common/components/entry-list-item/entry-list-item-thumbnail.tsx +++ b/src/common/components/entry-list-item/entry-list-item-thumbnail.tsx @@ -16,8 +16,20 @@ interface Props { export function EntryListItemThumbnail({ entry, noImage, isCrossPost, entryProp, history }: Props) { const { global } = useMappedStore(); - const { data: imgGrid } = useImageDownloader(entry, noImage, 600, 500); - const { data: imgRow } = useImageDownloader(entry, noImage, 260, 200); + const { data: imgGrid } = useImageDownloader( + entry, + noImage, + 600, + 500, + global.listStyle === "grid" + ); + const { data: imgRow } = useImageDownloader( + entry, + noImage, + 260, + 200, + global.listStyle !== "grid" + ); return (