import { useState } from 'react';
import { Link } from 'react-router-dom';

const Navbar = () => {
  const [isOpen, setIsOpen] = useState(false);

  const toggleMenu = () => {
    setIsOpen(!isOpen);
  };

  return (
    <nav className="navbar">
      <div className="container navbar-container">
        <Link to="/about" className="logo">Sokuree Consultant</Link>

        <div className={`nav-links ${isOpen ? 'active' : ''}`}>
          <Link to="/about" onClick={toggleMenu}>회사소개</Link>
          <Link to="/services" onClick={toggleMenu}>서비스</Link>
          <Link to="/cases" onClick={toggleMenu}>사례</Link>
          <Link to="/news" onClick={toggleMenu}>소식</Link>
          <Link to="/resources" onClick={toggleMenu}>자료실</Link>

        </div>

        <div className="hamburger" onClick={toggleMenu}>
          <span className="bar"></span>
          <span className="bar"></span>
          <span className="bar"></span>
        </div>
      </div>
    </nav>
  );
};

export default Navbar;
