[Malleys]

TypeError: Cannot read property 'onHover' of undefined

У вас функция объявлена как — onHover, но вы её почему-то пытаетесь вызвать как this.onHover.

В самой функции вы пытаетесь изменить значение константы usersVisible! (Тогда уж следовало объявить

const [usersVisible, setUsersVisible] = React.useState(false);

и использовать

onMouseOver={() => setUsersVisible(true)}
onMouseOut={() => setUsersVisible(false)}

) Но такой скрипт работает только с мышкой и к тому же показывает при наведении мышкой всех пользователей всех месяцев!

Я рекомендую вам не использовать usersVisible. Вместо этого используйте возможности CSS. Т. е. вам тогда следует удалить onMouseOver, onHover, заменить

{n.users.map(
								user =>
									usersVisible ? (
										<div key={user.id}>
											<div>
												<h4 className={classes.userId}>user #{user.id}</h4>
												данные пользователя...
											</div>
										</div>
									) : null
							)}

на

{n.users.map(user => <div key={user.id}>
    <div>
        <h4 className={classes.userId}>user #{user.id}</h4>
        данные пользователя...
    </div>
</div>)}

и объявить CSS (оберните пользователей в <section>)

#months h2 + section {
	display: none;
}
#months:hover h2 + section {
	display: block;
}

Кстати! Объявите начальное состояние так...

const [users, setUser] = React.useState([]);

и вам не придётся писать так...

users &&
		users.reduce(

Вот исправленный пример со всем тем, о чём я говорил... https://codepen.io/Malleys/pen/YzPaOjy?editors=0010