const props = {
  username: 'Rebecca Black',
  userAvatar: 'https://api.time.com/wp-content/uploads/2017/04/rebecca-black.jpg',
  onClickLogin: (defaultBehaviour) => {
    console.log('Log in clicked');
    defaultBehaviour();
  },
  onClickLogout: (defaultBehaviour) => {
    console.log('Log out clicked');
    defaultBehaviour();
  },
  onClickSignup: (defaultBehaviour) => {
    console.log('Sign up clicked');
    defaultBehaviour();
  },
};

<div>
  <p>Without logged-in user:</p>
  <HeaderWidget {...props} isLoggedIn={false} />

  <p>With logged-in user:</p>
  <HeaderWidget {...props} isLoggedIn />

  <p>With logged-in user and hideName set:</p>
  <HeaderWidget {...props} isLoggedIn hideName={true} />
</div>;