mirror of
https://github.com/movie-web/movie-web.git
synced 2024-12-25 19:21:49 +01:00
Add "has copied" text
This commit is contained in:
parent
73c3b13309
commit
5ae17a6c9a
@ -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()}
|
||||
>
|
||||
{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"
|
||||
|
Loading…
Reference in New Issue
Block a user