diff --git a/web/src/containers/Studio/internal/components/log/logChunk.tsx b/web/src/containers/Studio/internal/components/log/logChunk.tsx index e6d1a53..2d15afe 100644 --- a/web/src/containers/Studio/internal/components/log/logChunk.tsx +++ b/web/src/containers/Studio/internal/components/log/logChunk.tsx @@ -4,6 +4,7 @@ import Highlight from 'react-highlight' import { ErrorOutline, Warning } from '@mui/icons-material' import ContentCopyIcon from '@mui/icons-material/ContentCopy' import ExpandMoreIcon from '@mui/icons-material/ExpandMore' +import CheckIcon from '@mui/icons-material/Check' import { makeStyles } from '@mui/styles' import { defaultChunkSize, @@ -44,9 +45,9 @@ interface LogChunkProps { const LogChunk = (props: LogChunkProps) => { const { id, text, logLineCount, scrollToLogInstance } = props - const classes = useStyles() const [expanded, setExpanded] = useState(props.expanded) + const [copied, setCopied] = useState(false) useEffect(() => { setExpanded(props.expanded) @@ -107,16 +108,26 @@ const LogChunk = (props: LogChunkProps) => { ? (id + 1) * defaultChunkSize : logLineCount }`} - { - evt.stopPropagation() + {copied ? ( + + ) : ( + { + evt.stopPropagation() - navigator.clipboard.writeText( - clearErrorsAndWarningsHtmlWrapping(text) - ) - }} - /> + navigator.clipboard.writeText( + clearErrorsAndWarningsHtmlWrapping(text) + ) + + setCopied(true) + + setTimeout(() => { + setCopied(false) + }, 1000) + }} + /> + )} {errors && errors.length !== 0 && ( )} diff --git a/web/src/containers/Studio/internal/components/log/logComponent.tsx b/web/src/containers/Studio/internal/components/log/logComponent.tsx index 2eb7afc..dd052ed 100644 --- a/web/src/containers/Studio/internal/components/log/logComponent.tsx +++ b/web/src/containers/Studio/internal/components/log/logComponent.tsx @@ -47,7 +47,6 @@ const LogComponent = (props: LogComponentProps) => { const [logChunksState, setLogChunksState] = useState( new Array(logChunks.length).fill(false) ) - const [scrollToLogInstance, setScrollToLogInstance] = useState() const [oldestExpandedChunk, setOldestExpandedChunk] = useState( logChunksState.length - 1 diff --git a/web/src/utils/log.ts b/web/src/utils/log.ts index a3a7af9..1130184 100644 --- a/web/src/utils/log.ts +++ b/web/src/utils/log.ts @@ -81,11 +81,11 @@ export const isTheLastChunk = ( } export const splitIntoChunks = (log: string, chunkSize = defaultChunkSize) => { - if (!log.length) return [] + if (!log) return [] const logLines: string[] = log.split(`\n`) - if (logLines.length <= chunkSize) return log + if (logLines.length <= chunkSize) return [log] const chunks: string[] = []