Kieran/snort
5
14
Fork 14
Code Issues 37 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

fix: dont fail to render with invalid URLs

Browse Source
This commit is contained in:
Alejandro Gomez 2023-01-14 12:57:36 +01:00
parent 33e233d4a3
commit fa3793362c
No known key found for this signature in database
GPG Key ID: 4DF39E566658C817
1 changed files with 49 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
src/element/Text.js
View File

@ -12,53 +12,57 @@ import './Text.css'
import { useMemo } from "react"; import { useMemo } from "react";
function transformHttpLink(a) { function transformHttpLink(a) {
const url = new URL(a); try {
const youtubeId = YoutubeUrlRegex.test(a) && RegExp.$1; const url = new URL(a);
const tweetId = TweetUrlRegex.test(a) && RegExp.$2; const youtubeId = YoutubeUrlRegex.test(a) && RegExp.$1;
const extension = FileExtensionRegex.test(url.pathname.toLowerCase()) && RegExp.$1; const tweetId = TweetUrlRegex.test(a) && RegExp.$2;
if (extension) { const extension = FileExtensionRegex.test(url.pathname.toLowerCase()) && RegExp.$1;
switch (extension) { if (extension) {
case "gif": switch (extension) {
case "jpg": case "gif":
case "jpeg": case "jpg":
case "png": case "jpeg":
case "bmp": case "png":
case "webp": { case "bmp":
return <LazyImage key={url} src={url} />; case "webp": {
return <LazyImage key={url} src={url} />;
}
case "mp4":
case "mov":
case "mkv":
case "avi":
case "m4v": {
return <video key={url} src={url} controls />
}
default:
return <a key={url} href={url} onClick={(e) => e.stopPropagation()}>{url.toString()}</a>
} }
case "mp4": } else if (tweetId) {
case "mov": return (
case "mkv": <div className="tweet" key={tweetId}>
case "avi": <TwitterTweetEmbed tweetId={tweetId} />
case "m4v": { </div>
return <video key={url} src={url} controls /> )
} } else if (youtubeId) {
default: return (
return <a key={url} href={url} onClick={(e) => e.stopPropagation()}>{url.toString()}</a> <>
<br />
<iframe
className="w-max"
src={`https://www.youtube.com/embed/${youtubeId}`}
title="YouTube video player"
key={youtubeId}
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowFullScreen=""
/>
<br />
</>
)
} else {
return <a href={a} onClick={(e) => e.stopPropagation()}>{a}</a>
} }
} else if (tweetId) { } catch (error) {
return (
<div className="tweet">
<TwitterTweetEmbed tweetId={tweetId} />
</div>
)
} else if (youtubeId) {
return (
<>
<br />
<iframe
className="w-max"
src={`https://www.youtube.com/embed/${youtubeId}`}
title="YouTube video player"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowFullScreen=""
/>
<br />
</>
)
} else {
return <a href={a} onClick={(e) => e.stopPropagation()}>{a}</a>
} }
return <a href={a} onClick={(e) => e.stopPropagation()}>{a}</a> return <a href={a} onClick={(e) => e.stopPropagation()}>{a}</a>
} }