reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2025-07-27 08:30:02 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat: add timer to restore copyToClipboard button state

Browse Source
This commit is contained in:
lucataglia 2023-08-23 11:38:39 +02:00
parent 25d7b5e8d4
commit 6e71a04e8c
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/react-json-tree/src/expandCollapseButtons.tsx
View File

@ -6,7 +6,7 @@ import {
faCheck, faCheck,
} from '@fortawesome/free-solid-svg-icons'; } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import React, { ReactNode, useState } from 'react'; import React, { ReactNode, useEffect, useState } from 'react';
import { ExpandCollapseAll } from '.'; import { ExpandCollapseAll } from '.';
import { useExpandCollapseAllContext } from './expandCollapseContext'; import { useExpandCollapseAllContext } from './expandCollapseContext';
import { StylingFunction } from 'react-base16-styling'; import { StylingFunction } from 'react-base16-styling';
@ -131,6 +131,12 @@ function CopyToClipboardButton({copyToClipboardIcon, copiedToClipboardIcon, valu
setIsCopied(true) setIsCopied(true)
} }
useEffect(() => {
if(isCopied){
setTimeout(() => setIsCopied(false), 6000)
}
}, [isCopied])
if(isCopied){ if(isCopied){
return (<div role="presentation" onClick={handleOnCopyToClipboard}> return (<div role="presentation" onClick={handleOnCopyToClipboard}>
{copiedToClipboardIcon || <FontAwesomeIcon icon={faCheck} />} {copiedToClipboardIcon || <FontAwesomeIcon icon={faCheck} />}