Event.target.id returns empty string

Question

Hello I have a problem with returning an id value (defined in the key attribute) of the image when using event.target.

function imageClicked(event) {
    console.log(event.target.key);
    setClicked(event.target.key);
    shuffle(GameData);
    if (clicked.includes(event.target.key) === false) {
      setScore(score + 1);
      setClicked([...clicked, event.target.key]);
    } else {
      setScore(0);
      setClicked([]);
    }
  }

...

 <Display onClick={imageClicked} items={GameData} />

And component fragment:

<div className="display">
      <img
        src={props.image}
        alt={props.name}
        key={props.id}
        onClick={props.onClick}
      />
      <p>{props.name}</p>
    </div>

However when I am using an alt attribute of the image the app works as intended. But I want to change it anyway as I creacted ids for all images and they are currently unused.

Thanks in advance.

Here is the link to the full app (using alt attribute) in CodeSandbox.