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

View File

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