Compare commits
No commits in common. "62556d21542c1732b5d01337da9df74e85522b8a" and "15b038cd789e6ea79ad00047f5c4415b416016a3" have entirely different histories.
62556d2154
...
15b038cd78
@ -205,21 +205,28 @@ function TweetSkeleton ({ className }) {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel, id }) {
|
export const useFrameHeight = (
|
||||||
const [show, setShow] = useState(false)
|
iframeRef
|
||||||
const iframeRef = useRef(null)
|
) => {
|
||||||
|
const [height, setHeight] = useState(0)
|
||||||
|
const iframeCurrent = iframeRef.current
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const setHeightFromIframe = (e) => {
|
const setHeightFromIframe = (e) => {
|
||||||
if (e.origin !== 'https://njump.me' || !e?.data?.height || e.source !== iframeRef.current.contentWindow) return
|
if (e.origin !== 'https://njump.me' || !e?.data?.height) return
|
||||||
iframeRef.current.height = `${e.data.height}px`
|
setHeight(e.data.height)
|
||||||
}
|
}
|
||||||
window?.addEventListener('message', setHeightFromIframe)
|
window?.addEventListener('message', setHeightFromIframe)
|
||||||
return () => {
|
return () => {
|
||||||
window?.removeEventListener('message', setHeightFromIframe)
|
window?.removeEventListener('message', setHeightFromIframe)
|
||||||
}
|
}
|
||||||
}, [iframeRef.current])
|
}, [iframeCurrent])
|
||||||
|
return height
|
||||||
|
}
|
||||||
|
|
||||||
|
export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel, id }) {
|
||||||
|
const [show, setShow] = useState(false)
|
||||||
|
const iframeRef = useRef(null)
|
||||||
|
const frameHeight = useFrameHeight(iframeRef)
|
||||||
return (
|
return (
|
||||||
<div className={classNames(styles.nostrContainer, !show && styles.twitterContained, className)}>
|
<div className={classNames(styles.nostrContainer, !show && styles.twitterContained, className)}>
|
||||||
<iframe
|
<iframe
|
||||||
@ -227,9 +234,9 @@ export const NostrEmbed = memo(function NostrEmbed ({ src, className, topLevel,
|
|||||||
src={`https://njump.me/${id}?embed=yes`}
|
src={`https://njump.me/${id}?embed=yes`}
|
||||||
width={topLevel ? '550px' : '350px'}
|
width={topLevel ? '550px' : '350px'}
|
||||||
style={{ maxWidth: '100%' }}
|
style={{ maxWidth: '100%' }}
|
||||||
height={iframeRef.current?.height || (topLevel ? '200px' : '150px')}
|
height={frameHeight ? `${frameHeight}px` : topLevel ? '200px' : '150px'}
|
||||||
frameBorder='0'
|
frameBorder='0'
|
||||||
sandbox='allow-scripts allow-same-origin allow-popups'
|
sandbox='allow-scripts allow-same-origin'
|
||||||
allow=''
|
allow=''
|
||||||
/>
|
/>
|
||||||
{!show &&
|
{!show &&
|
||||||
|
@ -122,10 +122,5 @@
|
|||||||
"eslint": "^8.51.0",
|
"eslint": "^8.51.0",
|
||||||
"jest": "^29.7.0",
|
"jest": "^29.7.0",
|
||||||
"standard": "^17.1.0"
|
"standard": "^17.1.0"
|
||||||
},
|
|
||||||
"jest": {
|
|
||||||
"moduleNameMapper": {
|
|
||||||
"@/(.*)": "<rootDir>/$1"
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user