{"size": 1341, "ext": "js", "max_stars_repo_path": "expat-journal/src/components/Auth/Navbar.js", "max_stars_repo_name": "Build-Week-Expat-Journal-3/front-end", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "expat-journal/src/components/Auth/Navbar.js", "max_issues_repo_name": "Build-Week-Expat-Journal-3/front-end", "max_issues_repo_issues_event_min_datetime": "2021-03-10T16:19:33.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-27T03:47:25.000Z", "max_forks_repo_path": "expat-journal/src/components/Auth/Navbar.js", "max_forks_repo_name": "Build-Week-Expat-Journal-3/front-end", "max_forks_repo_forks_event_min_datetime": "2020-04-25T00:24:43.000Z", "max_forks_repo_forks_event_max_datetime": "2020-04-27T18:36:25.000Z"}
{"max_stars_count": null, "max_issues_count": 3, "max_forks_count": 2, "avg_line_length": 41.90625, "max_line_length": 208, "alphanum_fraction": 0.624906786}
import React, {useContext} from 'react';
import { StateContext } from "../../context"
import { NavbarDiv, NavbarLink, NavigationLink, NavLogoContainerDiv }  from "../styles"
import Logo from "../../media/logos/large_no_tagline.png"



const Navbar = () => {
    const { loggedInUser } = useContext(StateContext);
    const url = "https://goofy-joliot-c0daa3.netlify.app/"
    
	return (
		<NavbarDiv>
            <NavLogoContainerDiv>
            <img src={Logo} alt="logo" style={{  width:"15%" }} />
            <p>"Live Your Dream, Tell Your Story"</p>
            </NavLogoContainerDiv>
            <NavbarLink href={`${url}/index.html`}>Home</NavbarLink>
            <NavbarLink href={`${url}/about.html`}>About</NavbarLink>
            <NavigationLink to="/">Posts</NavigationLink>
            {loggedInUser ?  <NavigationLink to="/posts/create">Create New Post</NavigationLink> : null}
            {loggedInUser ?  <NavigationLink to="/myposts">My Posts</NavigationLink> : null}
            {loggedInUser ? <NavigationLink  to="/logout">Logout</NavigationLink> : null}
            {loggedInUser ? <p style={{ marginRight:"3%", fontSize:"1.2rem", textAlign:"center",color:"brown" }}>{`Welcome ${loggedInUser}!`}</p> : <NavigationLink to="/login">Login/Register</NavigationLink>}
        

		</NavbarDiv>
	);
};

export default Navbar;
