diff --git a/src/hooks/useClipboard.ts b/src/hooks/useClipboard.ts index 9edb709..3f4c1f1 100644 --- a/src/hooks/useClipboard.ts +++ b/src/hooks/useClipboard.ts @@ -10,11 +10,41 @@ export default function useClipboard( const [hasCopied, setHasCopied] = useState(false) const onCopy = useCallback(() => { - navigator.clipboard.writeText(text).then(() => { - setHasCopied(true) - }) + if (navigator.clipboard && navigator.clipboard.writeText) { + navigator.clipboard + .writeText(text) + .then(() => { + setHasCopied(true) + }) + .catch((error) => { + console.error('Clipboard API error:', error) + fallbackCopyText(text) + }) + } else { + fallbackCopyText(text) + } }, [text]) + const fallbackCopyText = (textToCopy: string) => { + const textArea = document.createElement('textarea') + textArea.value = textToCopy + + textArea.style.position = 'absolute' + textArea.style.left = '-999999px' + + document.body.appendChild(textArea) + textArea.select() + + try { + document.execCommand('copy') + setHasCopied(true) + } catch (error) { + console.error('execCommand:', error) + } finally { + textArea.remove() + } + } + useEffect(() => { let timeoutId: NodeJS.Timeout if (hasCopied) {