Function PreviewString

app/components/Preview/Types/PreviewString.tsx:16–79

({ info }: { info: JSONStringType })

import { PreviewVideoUri } from "./PreviewVideoUri";

export function PreviewString({ info }: { info: JSONStringType }) {
  if (info.format == null) {
    return <></>;
  }

  switch (info.format.name) {
    case "uri":
      if (
        info.format.contentType === "image/png" ||
        info.format.contentType === "image/jpeg" ||
        info.format.contentType === "image/gif" ||
        info.format.contentType === "image/svg+xml" ||
        info.format.contentType === "image/webp"
      ) {
        const url = new URL(info.value);

        if (url.protocol === "ipfs:") {
          return <PreviewIPFSImage src={url} />;
        } else {
          return (
            <PreviewImageUri
              src={info.value}
              contentType={info.format.contentType}
            />
          );
        }
      } else if (
        info.format.contentType === "video/mp4" ||
        info.format.contentType === "video/webm" ||
        info.format.contentType === "video/ogg"
      ) {
        return (
          <PreviewVideoUri
            src={info.value}
            contentType={info.format.contentType}
          />
        );
      } else if (
        info.format.contentType === "audio/mpeg" ||
        info.format.contentType === "audio/ogg" ||
        info.format.contentType === "audio/wav"
      ) {
        return (
          <PreviewAudioUri
            src={info.value}
            contentType={info.format.contentType}
          />
        );
      } else {
        return <PreviewUri value={info.value} type={info} />;
      }
    case "datetime":
      if (info.format.parts === "date" || info.format.parts === "datetime") {
        return <PreviewDate value={info.value} format={info.format} />;
      }
      return <></>;
    case "color":
      return <PreviewColor value={info.value} format={info.format} />;