cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-25 23:22:06 -05:00
Code Issues Projects Releases Packages Wiki Activity

feat(messaging): add basic support for text embeds

Browse source
This commit is contained in:
Paul Makles 2022-01-15 14:11:08 +00:00
parent 4526a696c6
commit 56f2411652
2 changed files with 55 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/common/messaging/attachments/Attachment.tsx
View file

@ -15,7 +15,7 @@ import TextFile from "./TextFile";
interface Props {
attachment: AttachmentI;
hasContent: boolean;
hasContent?: boolean;
}
const MAX_ATTACHMENT_WIDTH = 480;

86
src/components/common/messaging/embed/Embed.tsx
View file

@ -8,6 +8,8 @@ import { useIntermediate } from "../../../../context/intermediate/Intermediate";
import { useClient } from "../../../../context/revoltjs/RevoltClient";
import { MessageAreaWidthContext } from "../../../../pages/channels/messaging/MessageArea";
import Markdown from "../../../markdown/Markdown";
import Attachment from "../attachments/Attachment";
import EmbedMedia from "./EmbedMedia";
interface Props {
@ -45,34 +47,43 @@ export default function Embed({ embed }: Props) {
}
switch (embed.type) {
case "Text":
case "Website": {
// Determine special embed size.
let mw, mh;
const largeMedia =
(embed.special && embed.special.type !== "None") ||
embed.image?.size === "Large";
switch (embed.special?.type) {
case "YouTube":
case "Bandcamp": {
mw = embed.video?.width ?? 1280;
mh = embed.video?.height ?? 720;
break;
}
case "Twitch": {
mw = 1280;
mh = 720;
break;
}
default: {
if (embed.image?.size === "Preview") {
mw = MAX_EMBED_WIDTH;
mh = Math.min(
embed.image.height ?? 0,
MAX_PREVIEW_SIZE,
);
} else {
mw = embed.image?.width ?? MAX_EMBED_WIDTH;
mh = embed.image?.height ?? 0;
embed.type === "Text"
? typeof embed.media !== "undefined"
: (embed.special && embed.special.type !== "None") ||
embed.image?.size === "Large";
if (embed.type === "Text") {
mw = MAX_EMBED_WIDTH;
mh = 0;
} else {
switch (embed.special?.type) {
case "YouTube":
case "Bandcamp": {
mw = embed.video?.width ?? 1280;
mh = embed.video?.height ?? 720;
break;
}
case "Twitch": {
mw = 1280;
mh = 720;
break;
}
default: {
if (embed.image?.size === "Preview") {
mw = MAX_EMBED_WIDTH;
mh = Math.min(
embed.image.height ?? 0,
MAX_PREVIEW_SIZE,
);
} else {
mw = embed.image?.width ?? MAX_EMBED_WIDTH;
mh = embed.image?.height ?? 0;
}
}
}
}
@ -87,7 +98,9 @@ export default function Embed({ embed }: Props) {
width: width + CONTAINER_PADDING,
}}>
<div>
{embed.site_name && (
{(embed.type === "Text"
? embed.title
: embed.site_name) && (
<div className={styles.siteinfo}>
{embed.icon_url && (
<img
@ -102,13 +115,15 @@ export default function Embed({ embed }: Props) {
/>
)}
<div className={styles.site}>
{embed.site_name}{" "}
{embed.type === "Text"
? embed.title
: embed.site_name}{" "}
</div>
</div>
)}
{/*<span><a href={embed.url} target={"_blank"} className={styles.author}>Author</a></span>*/}
{embed.title && (
{embed.type === "Website" && embed.title && (
<span>
<a
onMouseDown={(ev) =>
@ -122,15 +137,22 @@ export default function Embed({ embed }: Props) {
)}
{embed.description && (
<div className={styles.description}>
{embed.description}
{embed.type === "Text" ? (
<Markdown content={embed.description} />
) : (
embed.description
)}
</div>
)}
{largeMedia && (
<EmbedMedia embed={embed} height={height} />
)}
{largeMedia &&
(embed.type === "Text" ? (
<Attachment attachment={embed.media!} />
) : (
<EmbedMedia embed={embed} height={height} />
))}
</div>
{!largeMedia && (
{!largeMedia && embed.type === "Website" && (
<div>
<EmbedMedia
embed={embed}