portfolio/src/components/Navigation.js

43 lines
1.1 KiB
JavaScript

import React from 'react';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import {toggleContactModal} from '../actions'
import './css/Navigation.css';
import { HouseDoor, FileEarmarkPerson, Github, Envelope, Share } from 'react-bootstrap-icons';
import ContactModal from './subcomponents/ContactModal';
const Navigation = (props) => {
return (
<div className="Navigation">
<Link to="/">
Home
<HouseDoor />
</Link>
<Link to="/github">
Github Repos
<Github />
</Link>
<Link to="/about">
About
<FileEarmarkPerson />
</Link>
<Link to="/social">
Social Media
<Share />
</Link>
<button className="end" onClick={()=>props.toggleContactModal()}>
Contact Me
<Envelope />
</button>
<ContactModal show={props.modal}/>
</div>
);
}
const mapStateToProps = (state) => {
return {modal: state.contactModal.contactModal}
}
export default connect(mapStateToProps, {toggleContactModal})(Navigation);