mirrors/smov
mirrors/smov
1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-30 16:17:41 +01:00
Code Issues 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 { Button } from "@/components/Button";
import { Icon, Icons } from "@/components/Icon"; import { Icon, Icons } from "@/components/Icon";
import { IconPill } from "@/components/layout/IconPill"; import { IconPill } from "@/components/layout/IconPill";
@ -8,6 +10,12 @@ import { usePlayerStore } from "@/stores/player/store";
export function PlaybackErrorPart() { export function PlaybackErrorPart() {
const playbackError = usePlayerStore((s) => s.interface.error); 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 ( return (
<ErrorLayout> <ErrorLayout>
@ -31,16 +39,25 @@ export function PlaybackErrorPart() {
</ErrorContainer> </ErrorContainer>
<ErrorContainer maxWidth="max-w-[45rem]"> <ErrorContainer maxWidth="max-w-[45rem]">
{/* Error */} {/* 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="w-full bg-errors-card p-6 rounded-lg">
<div className="flex justify-between items-center pb-2 border-b border-errors-border"> <div className="flex justify-between items-center pb-2 border-b border-errors-border">
<span className="text-white font-medium">Error details</span> <span className="text-white font-medium">Error details</span>
<div className="flex justify-center items-center gap-3"> <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" /> <Icon icon={Icons.COPY} className="text-2xl mr-3" />
Copy Copy
</Button> </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" /> <Icon icon={Icons.X} className="text-2xl" />
</Button> </Button>
</div> </div>