43 lines
1.1 KiB
TypeScript
43 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import useSWR from "swr";
|
|
import { DownloadButton } from "./DownloadButton";
|
|
import { getFileDownloadUrl } from "@/server/getFileDownloadUrl";
|
|
|
|
export function OutputRender(props: {
|
|
run_id: string;
|
|
filename: string;
|
|
}) {
|
|
const { data: url } = useSWR(
|
|
"run-outputs+" + props.run_id + props.filename,
|
|
async () => {
|
|
return await getFileDownloadUrl(
|
|
`outputs/runs/${props.run_id}/${props.filename}`,
|
|
);
|
|
},
|
|
);
|
|
|
|
if (!url) return <></>;
|
|
|
|
if (props.filename.endsWith(".mp4") || props.filename.endsWith(".webm")) {
|
|
return (
|
|
<video controls autoPlay className="w-[400px]">
|
|
<source src={url} type="video/mp4" />
|
|
<source src={url} type="video/webm" />
|
|
Your browser does not support the video tag.
|
|
</video>
|
|
);
|
|
}
|
|
|
|
if (
|
|
props.filename.endsWith(".png") ||
|
|
props.filename.endsWith(".gif") ||
|
|
props.filename.endsWith(".jpg") ||
|
|
props.filename.endsWith(".jpeg")
|
|
) {
|
|
return <img className="max-w-[200px]" alt={props.filename} src={url} />;
|
|
} else {
|
|
return <DownloadButton filename={props.filename} href={url} />;
|
|
}
|
|
}
|