import { useState } from 'react';
// import './index.css';
import Intro from './components/Intro';

const App = () => {
  const [svgPath, setSvgPath] = useState('/src/assets/girly/girly-happy.svg');
  const [displayText, setDisplayText] = useState(
    'Hey there, super awesome friendsfriendsfriendsfriendsfriendsfriends!'
  );

  const handleClick = () => {
    // Update the state with different data upon clicking
    setSvgPath('/src/assets/girly/girly-sad.svg');
    setDisplayText('Oh no, something went wrong!');
  };

  return (
    <>
      <div onClick={handleClick} className="bg">
        <Intro pathToSvg={svgPath} text={displayText} />
      </div>
    </>
  );
};

export default App;