2023-01-19 22:29:56 +01:00
|
|
|
import { MWMediaMeta } from "@/backend/metadata/types";
|
2023-01-15 16:51:55 +01:00
|
|
|
import { IconPatch } from "@/components/buttons/IconPatch";
|
|
|
|
import { Icons } from "@/components/Icon";
|
|
|
|
import { Title } from "@/components/text/Title";
|
|
|
|
import { ReactNode } from "react";
|
|
|
|
import { useVideoPlayerState } from "../VideoContext";
|
|
|
|
import { VideoPlayerHeader } from "./VideoPlayerHeader";
|
|
|
|
|
|
|
|
interface VideoPlayerErrorProps {
|
2023-01-19 22:29:56 +01:00
|
|
|
media?: MWMediaMeta;
|
2023-01-15 16:51:55 +01:00
|
|
|
onGoBack?: () => void;
|
|
|
|
children?: ReactNode;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function VideoPlayerError(props: VideoPlayerErrorProps) {
|
|
|
|
const { videoState } = useVideoPlayerState();
|
|
|
|
|
|
|
|
const err = videoState.error;
|
|
|
|
|
|
|
|
if (!err) return props.children as any;
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<div className="absolute inset-0 flex flex-col items-center justify-center bg-denim-100">
|
|
|
|
<IconPatch icon={Icons.WARNING} className="mb-6 text-red-400" />
|
|
|
|
<Title>Failed to load media</Title>
|
|
|
|
<p className="my-6 max-w-lg">
|
|
|
|
{err.name}: {err.description}
|
|
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<div className="pointer-events-auto absolute inset-x-0 top-0 flex flex-col py-6 px-8 pb-2">
|
2023-01-19 22:29:56 +01:00
|
|
|
<VideoPlayerHeader media={props.media} onClick={props.onGoBack} />
|
2023-01-15 16:51:55 +01:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|