Compare commits

...

2 Commits

Author SHA1 Message Date
k00b 62556d2154 fix multiple nostr embed race and link clicks 2024-09-07 19:45:37 -05:00
ekzyis 597d1087f6
Fix jest module resolution (#1372) 2024-09-07 12:45:17 -05:00
2 changed files with 15 additions and 17 deletions

View File

@ -205,28 +205,21 @@ function TweetSkeleton ({ className }) {
)
}
export const useFrameHeight = (
iframeRef
) => {
const [height, setHeight] = useState(0)
const iframeCurrent = iframeRef.current
export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel, id }) {
const [show, setShow] = useState(false)
const iframeRef = useRef(null)
useEffect(() => {
const setHeightFromIframe = (e) => {
if (e.origin !== 'https://njump.me' || !e?.data?.height) return
setHeight(e.data.height)
if (e.origin !== 'https://njump.me' || !e?.data?.height || e.source !== iframeRef.current.contentWindow) return
iframeRef.current.height = `${e.data.height}px`
}
window?.addEventListener('message', setHeightFromIframe)
return () => {
window?.removeEventListener('message', setHeightFromIframe)
}
}, [iframeCurrent])
return height
}
}, [iframeRef.current])
export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel, id }) {
const [show, setShow] = useState(false)
const iframeRef = useRef(null)
const frameHeight = useFrameHeight(iframeRef)
return (
<div className={classNames(styles.nostrContainer, !show && styles.twitterContained, className)}>
<iframe
@ -234,9 +227,9 @@ export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel,
src={`https://njump.me/${id}?embed=yes`}
width={topLevel ? '550px' : '350px'}
style={{ maxWidth: '100%' }}
height={frameHeight ? `${frameHeight}px` : topLevel ? '200px' : '150px'}
height={iframeRef.current?.height || (topLevel ? '200px' : '150px')}
frameBorder='0'
sandbox='allow-scripts allow-same-origin'
sandbox='allow-scripts allow-same-origin allow-popups'
allow=''
/>
{!show &&

View File

@ -122,5 +122,10 @@
"eslint": "^8.51.0",
"jest": "^29.7.0",
"standard": "^17.1.0"
},
"jest": {
"moduleNameMapper": {
"@/(.*)": "<rootDir>/$1"
}
}
}