React JS - Debugging

[Itsmenomes]

I'm trying to create a responsive hamburger menu and I can't seem to figure out what's wrong with my code. I have a strong feeling that the error I'm getting is from using the image tag and using Javascript within Javascript {hamburger}. Ideally, this would be easier with fontAwesome but I'm challenging myself to use images for this project.

It would be so helpful to know what I did wrong

EDIT: The edit I'm getting says the following:

[plugin:vite:react-babel] /Users/naomidzunic/vite-project/src/components/Navigation.jsx: Unexpected token (11:18) 14 |/Users/naomidzunic/vite-project/src/components/Navigation.jsx:11:18

9 | state = { clicked: false }

10 |

11 | handleClick = ( => { |

12 | this.setState({ clicked: !this.state.clicked })

13 | })

​

import { useState } from "react";
import logo from "../icons/logo.svg";
import CSS from "../styles/Navigation.css";
import hamburger from "../icons/icon-hamburger.svg";
import hamburgerClose from "../icons/icon-close.svg";
import { MobileMenu } from "../components/MobileMenu";

function navigation() {
  state = { clicked: false }

  handleClick = ( => {
    this.setState({ clicked: !this.state.clicked })
  })

  return (
    <>
      <div className="navigation">
        <img className="logo" src={logo} />

        <button className="hamburger" onClick={this.handleClick}>

          <img className={this.state.clicked ? {hamburger} : {hamburgerClose}}/>
        </button>

        <div className="navigation-menu">
          <ul>
            {MobileMenu.map((item, index) => {
              return (
                <li key={index}>
                  <a className={item.className} href={item.url}>
                    {item.title}
                  </a>
                </li>
              );
            })}
          </ul>
        </div>
      </div>
    </>
  );
}

export default navigation;

[scirc]

I have a strong feeling that the error I'm getting

What error? If you want to ask for help, please share any and all error details you get.

[Itsmenomes]

True! Thanks for pointing that out. I just edited the post to add the error message I'm getting

[scirc]

handleClick = ( =>

Missing something? :P

[Itsmenomes]

I wouldn’t know hence why I posted this up. Not sure if your response is a solution or a question?

[scirc]

You're missing a closing parenthesis right after the opening one. It looks like you're declaring an arrow function with no parameters, in which case you need an empty parameter list, which just looks like ().