import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'gatsby';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';

import { userSelector } from '../../../redux';

const mapStateToProps = createSelector(
  userSelector,
  ({ picture }) => ({
    picture
  })
);

function SignedIn({ picture }) {
  return (
    <Link className='settings-link' to='/settings'>
      <img alt='' className='user-avatar' src={picture} />
    </Link>
  );
}

SignedIn.displayName = 'SignedIn';
SignedIn.propTypes = {
  picture: PropTypes.string
};

export default connect(mapStateToProps)(SignedIn);

@@ -90,237 +90,8 @@
 by';
-%0Aimport %7B connect %7D from 'react-redux';%0Aimport %7B createSelector %7D from 'reselect';%0A%0Aimport %7B userSelector %7D from '../../../redux';%0A%0Aconst mapStateToProps = createSelector(%0A  userSelector,%0A  (%7B picture %7D) =%3E (%7B%0A    picture%0A  %7D)%0A);
 %0A%0Afu
@@ -110,19 +110,8 @@
 dIn(
-%7B picture %7D
 ) %7B%0A
@@ -142,24 +142,29 @@
 ssName='
-settings
+top-right-nav
 -link' t
@@ -188,60 +188,16 @@
     
-%3Cimg alt='' className='user-avatar' src=%7Bpicture%7D /%3E
+Settings
 %0A   
@@ -322,40 +322,15 @@
 ult 
-connect(mapStateToProps)(
 SignedIn
 );%0A
@@ -326,11 +326,10 @@
 SignedIn
-)
 ;%0A

remove avatar from nav