Prevent tweetId from getting interpreted as a number

This commit is contained in:
Austin Chen 2022-08-10 18:06:33 -07:00
parent bf279804e5
commit 6423833ea4
2 changed files with 15 additions and 8 deletions

View File

@ -1,13 +1,19 @@
import { NodeViewWrapper } from '@tiptap/react' import { NodeViewWrapper } from '@tiptap/react'
import { TwitterTweetEmbed } from 'react-twitter-embed' import { TwitterTweetEmbed } from 'react-twitter-embed'
export default function WrappedTwitterTweetEmbed(props: any): JSX.Element { export default function WrappedTwitterTweetEmbed(props: {
console.log('wtwe props', props.node.attrs) node: {
attrs: {
tweetId: string
}
}
}): JSX.Element {
// Remove the leading 't' from the tweet id
const tweetId = props.node.attrs.tweetId.slice(1)
return ( return (
<NodeViewWrapper className="tiptap-tweet"> <NodeViewWrapper className="tiptap-tweet">
<TwitterTweetEmbed <TwitterTweetEmbed tweetId={tweetId} />
tweetId={props.node.attrs.tweetId || '1557429814990196736'}
/>
</NodeViewWrapper> </NodeViewWrapper>
) )
} }

View File

@ -22,8 +22,9 @@ export function TweetModal(props: {
const { editor, open, setOpen } = props const { editor, open, setOpen } = props
const [input, setInput] = useState('') const [input, setInput] = useState('')
const tweetId = getTweetId(input) const tweetId = getTweetId(input)
const tweetCode = `<tiptap-tweet tweetid="${tweetId}"></tiptap-tweet>` // Append a leading 't', to prevent tweetId from being interpreted as a number.
console.log('tweetCode', tweetCode) // If it's a number, there may be numeric precision issues.
const tweetCode = `<tiptap-tweet tweetid="t${tweetId}"></tiptap-tweet>`
return ( return (
<Modal open={open} setOpen={setOpen}> <Modal open={open} setOpen={setOpen}>
@ -32,7 +33,7 @@ export function TweetModal(props: {
htmlFor="embed" htmlFor="embed"
className="block text-sm font-medium text-gray-700" className="block text-sm font-medium text-gray-700"
> >
Tweet link Paste a tweet link
</label> </label>
<input <input
type="text" type="text"