mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-01 11:18:24 +02:00
fix(theme-classic): minor code copy button improvements (#6986)
This commit is contained in:
parent
c3e7ecca17
commit
21ff25eebb
1 changed files with 8 additions and 6 deletions
|
@ -5,7 +5,7 @@
|
|||
* 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 copy from 'copy-text-to-clipboard';
|
||||
import {translate} from '@docusaurus/Translate';
|
||||
|
@ -15,14 +15,16 @@ import styles from './styles.module.css';
|
|||
|
||||
export default function CopyButton({code}: Props): JSX.Element {
|
||||
const [isCopied, setIsCopied] = useState(false);
|
||||
const handleCopyCode = () => {
|
||||
const copyTimeout = useRef<number | undefined>(undefined);
|
||||
const handleCopyCode = useCallback(() => {
|
||||
copy(code);
|
||||
setIsCopied(true);
|
||||
|
||||
setTimeout(() => {
|
||||
copyTimeout.current = window.setTimeout(() => {
|
||||
setIsCopied(false);
|
||||
}, 2000);
|
||||
};
|
||||
}, 1000);
|
||||
}, [code]);
|
||||
|
||||
useEffect(() => () => window.clearTimeout(copyTimeout.current), []);
|
||||
|
||||
return (
|
||||
<button
|
||||
|
|
Loading…
Add table
Reference in a new issue