fix: memoize note inner to prevent video reloading

This commit is contained in:
2023-10-15 23:19:10 +01:00
parent 3a95689792
commit a29d82bd56

View File

@ -1,5 +1,5 @@
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import React, { ReactNode, useState } from "react"; import React, { ReactNode, useMemo, useState } from "react";
import { useInView } from "react-intersection-observer"; import { useInView } from "react-intersection-observer";
import { FormattedMessage, useIntl } from "react-intl"; import { FormattedMessage, useIntl } from "react-intl";
import { EventExt, EventKind, HexKey, Lists, NostrLink, NostrPrefix, TaggedNostrEvent } from "@snort/system"; import { EventExt, EventKind, HexKey, Lists, NostrLink, NostrPrefix, TaggedNostrEvent } from "@snort/system";
@ -74,7 +74,7 @@ export function NoteInner(props: NoteProps) {
} }
} }
const innerContent = () => { const innerContent = useMemo(() => {
const body = ev?.content ?? ""; const body = ev?.content ?? "";
return ( return (
<Text <Text
@ -88,7 +88,7 @@ export function NoteInner(props: NoteProps) {
disableMediaSpotlight={!(props.options?.showMediaSpotlight ?? true)} disableMediaSpotlight={!(props.options?.showMediaSpotlight ?? true)}
/> />
); );
}; }, [ev, props.searchedValue, props.depth, options.showMedia, props.options?.showMediaSpotlight]);
const transformBody = () => { const transformBody = () => {
if (deletions?.length > 0) { if (deletions?.length > 0) {
@ -126,11 +126,11 @@ export function NoteInner(props: NoteProps) {
<FormattedMessage defaultMessage="Click here to load anyway" /> <FormattedMessage defaultMessage="Click here to load anyway" />
</> </>
}> }>
{innerContent()} {innerContent}
</Reveal> </Reveal>
); );
} }
return innerContent(); return innerContent;
}; };
function goToEvent( function goToEvent(