Function CodeEditor

website/src/components/CodeEditor.js:35–52

({ sourceCode, language, onChange, ...rest })

`

const CodeEditor = ({ sourceCode, language, onChange, ...rest }) => {
  const [code, setCode] = useState(sourceCode)
  const debouncedChange = useMemo(() => debounce(onChange, 300), [onChange])
  const handleChange = useCallback(code => {
    setCode(code)
    debouncedChange(code)
  }, [debouncedChange])
  useEffect(() => setCode(sourceCode), [sourceCode])

  return (
    <Container {...rest}>
      <EditorContainer>
        <StyledEditor code={code} language={language} onChange={handleChange} />
      </EditorContainer>
      <CopyButton content={code} />
    </Container>
  )
}

export default CodeEditor