import React, { useState } from 'react';
import 'react-code-container/dist/styles/base.css';
import 'highlight.js/styles/atom-one-dark.css'; // Find any highlight style you need
import ReactCodeContainer from 'react-code-container';

export default () => {
  const [language, setLanguage] = useState('jsx');
  const [showLineNumber, setShowLineNumber] = useState(true);

  const code = `export function hello() => {
    console.log("Hello world")
  }`;
  return (
    <ReactCodeContainer
      code={code}
      showLineNumber={showLineNumber} // optional
      language={language} // optional
      onLineNumberClick={handleLineNumberClicked} // optional
    />
  );
};