Clean up embed rewrite code

This commit is contained in:
Austin Chen 2022-08-11 11:00:58 -07:00
parent b81fb80f7b
commit 2affed814f

View File

@ -7,65 +7,49 @@ import { Modal } from '../layout/modal'
import { Row } from '../layout/row'
import { Spacer } from '../layout/spacer'
function isValidIframe(text: string) {
return /^<iframe.*<\/iframe>$/.test(text)
type EmbedPattern = {
// Regex should have a single capture group.
regex: RegExp
rewrite: (text: string) => string
}
// A valid tweet URL looks like 'https://twitter.com/username/status/123456789'
// Return the tweetId if the URL is valid, otherwise return null.
function getTweetId(text: string) {
const match = text.match(/^https?:\/\/twitter\.com\/.*\/status\/(\d+)/)
return match ? match[1] : null
}
// Manifold URL: https://manifold.markets/Austin/will-manifold-ever-be-worth-1b
function getManifoldSlug(text: string) {
const match = text.match(/^https?:\/\/manifold\.markets\/([^\/]+\/[^\/]+)/)
return match ? match[1] : null
}
// Youtube URL: 'https://www.youtube.com/watch?v=ziq7FUKpCS8'
function getYoutubeId(text: string) {
const match = text.match(/^https?:\/\/www\.youtube\.com\/watch\?v=([^&]+)/)
return match ? match[1] : null
}
// Metaculus URL: 'https://www.metaculus.com/questions/5320/chinese-annexation-of-half-of-taiwan-by-2050/'
function getMetaculusId(text: string) {
const match = text.match(/^https?:\/\/www\.metaculus\.com\/questions\/(\d+)/)
return match ? match[1] : null
}
function isValidUrl(text: string) {
// Conjured by Codex
return /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/.test(
text
)
}
const embedPatterns: EmbedPattern[] = [
{
regex: /^(<iframe.*<\/iframe>)$/,
rewrite: (text: string) => text,
},
{
regex: /^https?:\/\/manifold\.markets\/([^\/]+\/[^\/]+)/,
rewrite: (slug) =>
`<iframe src="https://manifold.markets/embed/${slug}"></iframe>`,
},
{
regex: /^https?:\/\/twitter\.com\/.*\/status\/(\d+)/,
rewrite: (id) => `<tiptap-tweet tweetid="t${id}"></tiptap-tweet>`,
},
{
regex: /^https?:\/\/www\.youtube\.com\/watch\?v=([^&]+)/,
rewrite: (id) =>
`<iframe src="https://www.youtube.com/embed/${id}"></iframe>`,
},
{
regex: /^https?:\/\/www\.metaculus\.com\/questions\/(\d+)/,
rewrite: (id) =>
`<iframe src="https://www.metaculus.com/questions/embed/${id}"></iframe>`,
},
{
regex: /^(https?:\/\/.*)/,
rewrite: (url) => `<iframe src="${url}"></iframe>`,
},
]
function embedCode(text: string) {
if (isValidIframe(text)) {
return text
} else if (getTweetId(text)) {
// Append a leading 't', to prevent tweetId from being interpreted as a number.
// If it's a number, there may be numeric precision issues.
return `<tiptap-tweet tweetid="t${getTweetId(text)}"></tiptap-tweet>`
} else if (getManifoldSlug(text)) {
return `<iframe src="https://manifold.markets/embed/${getManifoldSlug(
text
)}"></iframe>`
} else if (getYoutubeId(text)) {
return `<iframe src="https://www.youtube.com/embed/${getYoutubeId(
text
)}"></iframe>`
} else if (getMetaculusId(text)) {
return `<iframe src="https://www.metaculus.com/questions/embed/${getMetaculusId(
text
)}"></iframe>`
} else if (isValidUrl(text)) {
return `<iframe src="${text}"></iframe>`
for (const pattern of embedPatterns) {
const match = text.match(pattern.regex)
if (match) {
return pattern.rewrite(match[1])
}
}
// Return null if the text is not embeddable.
return null
}