mirrors/movie-web
1
0
Fork 0
mirror of https://github.com/movie-web/movie-web.git synced 2024-12-29 15:36:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add "has copied" text

Browse source
This commit is contained in:
Jip Fr 2023-11-22 14:03:57 +01:00
parent 73c3b13309
commit 5ae17a6c9a
1 changed files with 24 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/pages/parts/player/PlaybackErrorPart.tsx
View file

@ -1,4 +1,4 @@
import { useState } from "react";
import { useRef, useState } from "react";
import { Button } from "@/components/Button";
import { Icon, Icons } from "@/components/Icon";
@ -11,10 +11,22 @@ import { usePlayerStore } from "@/stores/player/store";
export function PlaybackErrorPart() {
const playbackError = usePlayerStore((s) => s.interface.error);
const [showErrorCard, setShowErrorCard] = useState(true);
const [hasCopied, setHasCopied] = useState(false);
const hasCopiedUnsetDebounce = useRef<ReturnType<typeof setTimeout> | null>(
null
);
function copyError() {
if (!playbackError || !navigator.clipboard) return;
navigator.clipboard.writeText(playbackError.message);
setHasCopied(true);
// Debounce unsetting the "has copied" label
if (hasCopiedUnsetDebounce.current)
clearTimeout(hasCopiedUnsetDebounce.current);
hasCopiedUnsetDebounce.current = setTimeout(() => setHasCopied(false), 2e3);
console.log(hasCopiedUnsetDebounce);
}
return (
@ -50,8 +62,17 @@ export function PlaybackErrorPart() {
padding="p-2 md:px-4"
onClick={() => copyError()}
>
<Icon icon={Icons.COPY} className="text-2xl mr-3" />
Copy
{hasCopied ? (
<>
<Icon icon={Icons.CHECKMARK} className="text-xs mr-3" />
Copied
</>
) : (
<>
<Icon icon={Icons.COPY} className="text-2xl mr-3" />
Copy
</>
)}
</Button>
<Button
theme="secondary"