front/src/components/post/External.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

import type { ExternalContent } from "@/types/trill";
import youtube from "@/assets/icons/youtube.svg";
import Card from "./Card";

interface JSONProps {
  content: ExternalContent[];
}

function JSONContent({ content }: JSONProps) {
  return (
    <>
      {content.map((c, i) => {
        if (!JSON.parse(c.json.content)) return <p key={i}>Error</p>;
        else
          return (
            <p
              key={JSON.stringify(c.json)}
              className="external-content-warning"
            >
              External content from "{c.json.origin}", use
              <a href="https://urbit.org/applications/~sortug/ufa">UFA</a>
              to display.
            </p>
          );
      })}
    </>
  );
}
export default JSONContent;

export function YoutubeSnippet({ href, id }: { href: string; id: string }) {
  const thumbnail = `https://i.ytimg.com/vi/${id}/hqdefault.jpg`;
  // todo styiling
  return (
    <Card logo={youtube} cn="youtube-thumbnail">
      <a href={href}>
        <img src={thumbnail} alt="" />
      </a>
    </Card>
  );
}