Kieran/snort
5
14
Fork 14
Code Issues 37 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

memoize imagegriditem
Some checks are pending
continuous-integration/drone/push Build is running
Details

Browse Source
This commit is contained in:
Martti Malmi 2024-01-10 18:48:36 +02:00
parent 1278867ad0
commit 53488a9c59
3 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/app/src/Components/Feed/ImageGridItem.tsx
View File

@ -1,5 +1,5 @@
import { NostrLink, TaggedNostrEvent } from "@snort/system"; import { NostrLink, TaggedNostrEvent } from "@snort/system";
import { MouseEvent, ReactNode } from "react"; import {memo, MouseEvent, ReactNode} from "react";
import { useInView } from "react-intersection-observer"; import { useInView } from "react-intersection-observer";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
@ -13,9 +13,9 @@ export interface ImageGridItemProps {
waitUntilInView?: boolean; waitUntilInView?: boolean;
} }
const ImageGridItem = (props: ImageGridItemProps) => { function ImageGridItem(props: ImageGridItemProps) {
const { event, onClick } = props; const { event, onClick } = props;
const { ref, inView } = useInView({ triggerOnce: true, rootMargin: "2000px" }); const { ref, inView } = useInView({ triggerOnce: true, rootMargin: "0px 0px 3000px 0px" });
const media = getEventMedia(event); const media = getEventMedia(event);
@ -56,4 +56,4 @@ const ImageGridItem = (props: ImageGridItemProps) => {
); );
}; };
export default ImageGridItem; export default memo(ImageGridItem);

2
packages/app/src/Pages/Layout/index.tsx
View File

@ -61,7 +61,7 @@ export default function Index() {
<div className="w-full max-w-screen-xl"> <div className="w-full max-w-screen-xl">
<div className="flex flex-row"> <div className="flex flex-row">
<NavSidebar /> <NavSidebar />
<div className="flex flex-1 flex-col pb-[50vh] w-full md:w-1/3"> <div className="flex flex-1 flex-col pb-safe-area w-full md:w-1/3">
{!shouldHideHeader && <Header />} {!shouldHideHeader && <Header />}
<ErrorBoundary> <ErrorBoundary>
<Outlet /> <Outlet />

2
packages/app/src/index.css
View File

@ -923,7 +923,7 @@ svg.repeat {
} }
.pb-safe-area { .pb-safe-area {
padding-bottom: env(safe-area-inset-bottom); padding-bottom: calc(20vh + env(safe-area-inset-bottom));
} }
.active > .icon-outline { .active > .icon-outline {