Mirrors/movie-web
2
0
Fork 0
mirror of https://github.com/movie-web/movie-web.git synced 2024-09-21 13:39:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix buttons in playback error

Browse Source
This commit is contained in:
Jip Fr 2023-11-22 13:54:43 +01:00
parent fa29da1757
commit 73c3b13309
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/pages/parts/player/PlaybackErrorPart.tsx
View File

@ -1,3 +1,5 @@
import { useState } from "react";
import { Button } from "@/components/Button";
import { Icon, Icons } from "@/components/Icon";
import { IconPill } from "@/components/layout/IconPill";
@ -8,6 +10,12 @@ import { usePlayerStore } from "@/stores/player/store";
export function PlaybackErrorPart() {
const playbackError = usePlayerStore((s) => s.interface.error);
const [showErrorCard, setShowErrorCard] = useState(true);
function copyError() {
if (!playbackError || !navigator.clipboard) return;
navigator.clipboard.writeText(playbackError.message);
}
return (
<ErrorLayout>
@ -31,16 +39,25 @@ export function PlaybackErrorPart() {
</ErrorContainer>
<ErrorContainer maxWidth="max-w-[45rem]">
{/* Error */}
{playbackError ? (
{playbackError && showErrorCard ? (
// I didn't put a <Transition> here because it'd fade out, then jump height weirdly
<div className="w-full bg-errors-card p-6 rounded-lg">
<div className="flex justify-between items-center pb-2 border-b border-errors-border">
<span className="text-white font-medium">Error details</span>
<div className="flex justify-center items-center gap-3">
<Button theme="secondary" padding="p-2 md:px-4">
<Button
theme="secondary"
padding="p-2 md:px-4"
onClick={() => copyError()}
>
<Icon icon={Icons.COPY} className="text-2xl mr-3" />
Copy
</Button>
<Button theme="secondary" padding="p-2 md:px-2">
<Button
theme="secondary"
padding="p-2 md:px-2"
onClick={() => setShowErrorCard(false)}
>
<Icon icon={Icons.X} className="text-2xl" />
</Button>
</div>