40 lines
1.6 KiB
JavaScript
40 lines
1.6 KiB
JavaScript
import React, { Component } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import { Link } from 'react-router'
|
|
|
|
class UpperLeftUI extends Component {
|
|
static propTypes = {
|
|
currentUser: PropTypes.object,
|
|
map: PropTypes.object,
|
|
userRequested: PropTypes.bool,
|
|
requestAnswered: PropTypes.bool,
|
|
requestApproved: PropTypes.bool,
|
|
onRequestClick: PropTypes.func
|
|
}
|
|
|
|
render () {
|
|
const { map, currentUser, userRequested, requestAnswered, requestApproved, onRequestClick } = this.props
|
|
return <div className="upperLeftUI">
|
|
<div className="homeButton">
|
|
{currentUser && <Link to="/">METAMAPS</Link>}
|
|
{!currentUser && <a href="/">METAMAPS</a>}
|
|
</div>
|
|
<div className="sidebarSearch">
|
|
<input type="text" className="sidebarSearchField" placeholder="Search for topics, maps, and mappers..." />
|
|
<div id="searchLoading"></div>
|
|
<div className="sidebarSearchIcon"></div>
|
|
<div className="clearfloat"></div>
|
|
</div>
|
|
{map && !map.authorizeToEdit(currentUser) && <div className="viewOnly">
|
|
<div className="eyeball">View Only</div>
|
|
{currentUser && !userRequested && <div className="requestAccess requestNotice" onClick={onRequestClick}>Request Access</div>}
|
|
{userRequested && !requestAnswered && <div className="requestPending requestNotice">Request Pending</div>}
|
|
{userRequested && requestAnswered && !requestApproved && <div className="requestNotAccepted requestNotice">Request Not Accepted</div>}
|
|
</div>}
|
|
<div className="clearfloat"></div>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
export default UpperLeftUI
|