Question: I know how to use events to detect when the mouse button is pressed, however, how do detect if a mouse button is currently held down? Note I am not asking how to get it from an event.

I have not tried anything apart from `SDL_GetMouseState(&x, &y);` however it seems to only return the X and Y position of the mouse.

Answer: 
The top-level `<Zoom>` component needs a `key` attribute as well.
You need to add a `key` props to the element you rendering with `map()`.

> 
> Keys help React identify which items have changed, are added, or are removed. Keys should be given to the elements inside the array to give the elements a stable identity
> 
> 
> 

In your case, you forgot to add a `key={imgUrl}` to `<Zoom></Zoom>` element whereas it's the first element rendered with `map()`

To turn off this warning, here the solution:

```
{calculatorScreenshots.map((imgUrl: String, index) => {
    return (
        <Zoom key={imageUrl}>
            {props.projectName == 'Calculator' && (
                <CardMedia
                  component="img"
                  height="200"
                  alt="project picture"
                  image={imgUrl}
                />
             )}
       </Zoom>
   )})}

```

You were almost there, you simply put the `key` props for the second mapped element, not for the first one `<Zoom></Zoom>`.

Happy coding 

---

Some good pieces of information :

> 
> The best way to pick a key is to use a string that uniquely identifies a list item among its siblings. Most often you would use IDs from your data as keys
> 
> 
> 

> 
> When you don’t have stable IDs for rendered items, you may use the item index as a key as a last resort
> 
> 
> 

> 
> We don’t recommend using indexes for keys if the order of items may change. This can negatively impact performance and may cause issues with component state. Check out Robin Pokorny’s article for an in-depth explanation on the negative impacts of using an index as a key. If you choose not to assign an explicit key to list items then React will default to using indexes as keys.
> 
> 
> 

You can find more information here :

[List and Keys with React](https://reactjs.org/docs/lists-and-keys.html)

[Index as a key is an anti-pattern by Robin Pokorny](https://robinpokorny.medium.com/index-as-a-key-is-an-anti-pattern-e0349aece318)

[Why keys are necessary for React?](https://reactjs.org/docs/reconciliation.html#recursing-on-children)