Connected component simplified with custom react-redux hooks

navigation.ts

import React, { FunctionComponent } from 'react';
import { useUserState, useUserDispatch } from '../../hooks/user';

export const Navigation: FunctionComponent = () => {
  const { user } = useUserState();
  const { setUser } = useUserDispatch();
  
  return (
    <div className={styles.Navigation} onClick={ setUser('me') }>
      User name: { user }
    </div>
  );
}