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 (
diff --git a/src/common/components/entry-list-item/index.tsx b/src/common/components/entry-list-item/index.tsx index 87d7ed1e56f..08638d64a7c 100644 --- a/src/common/components/entry-list-item/index.tsx +++ b/src/common/components/entry-list-item/index.tsx @@ -26,7 +26,6 @@ import { getPost } from "../../api/bridge"; import "./_index.scss"; import useMountedState from "react-use/lib/useMountedState"; import { useMappedStore } from "../../store/use-mapped-store"; -import { useLocation } from "react-router"; import useMount from "react-use/lib/useMount"; import { useUnmount } from "react-use"; import { Community } from "../../store/communities"; @@ -67,7 +66,6 @@ export function EntryListItem({ const [showMuted, setShowMuted] = useState(mutedProp); const [showModMuted, setShowModMuted] = useState(false); - const location = useLocation(); const { global, activeUser, addAccount, updateEntry } = useMappedStore(); const isMounted = useMountedState();