3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-01 19:27:48 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix(theme-classic): minor code copy button improvements (#6986)

Browse source
This commit is contained in:
Joshua Chen 2022-03-24 23:52:45 +08:00 • committed by GitHub
parent c3e7ecca17
commit 21ff25eebb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
packages/docusaurus-theme-classic/src/theme/CodeBlock/CopyButton/index.tsx
View file

@ -5,7 +5,7 @@
* LICENSE file in the root directory of this source tree. * LICENSE file in the root directory of this source tree.
*/ */
import React, {useState} from 'react'; import React, {useCallback, useState, useRef, useEffect} from 'react';
import clsx from 'clsx'; import clsx from 'clsx';
import copy from 'copy-text-to-clipboard'; import copy from 'copy-text-to-clipboard';
import {translate} from '@docusaurus/Translate'; import {translate} from '@docusaurus/Translate';
@ -15,14 +15,16 @@ import styles from './styles.module.css';
export default function CopyButton({code}: Props): JSX.Element { export default function CopyButton({code}: Props): JSX.Element {
const [isCopied, setIsCopied] = useState(false); const [isCopied, setIsCopied] = useState(false);
const handleCopyCode = () => { const copyTimeout = useRef<number | undefined>(undefined);
const handleCopyCode = useCallback(() => {
copy(code); copy(code);
setIsCopied(true); setIsCopied(true);
copyTimeout.current = window.setTimeout(() => {
setTimeout(() => {
setIsCopied(false); setIsCopied(false);
}, 2000); }, 1000);
}; }, [code]);
useEffect(() => () => window.clearTimeout(copyTimeout.current), []);
return ( return (
<button <button