blob: 5d961bc7cccdaa176263487805ec2df25d70e0e8 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
|
import React from "react";
import Octicon, {Person} from "@githubprimer/octicons-react";
import PropTypes from "prop-types";
export class Navigation extends React.Component {
render() {
const hasNavigation = this.props.navigation && this.props.navigation.length;
if (hasNavigation) {
return (
<div className={'title row'}>
<div className={'col align-self-center'}>
<strong>{this.props.title}</strong>
{this.props.afterTitle ? this.props.afterTitle : ''}
</div>
<div className={'col-sm-1'}>
{(!hasNavigation && (
<div className={'float-right'}>
<strong>
<u className={'mr-2'}>{this.props.username}</u>
<Octicon icon={Person}/>
</strong>
</div>
)) || (
<div className="dropdown float-right">
<button className="btn btn-secondary dropdown-toggle" type="button"
id="dropdownMenuButton" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
{(this.props.username && (
<span>
<u className={'mr-2'}>{this.props.username}</u>
<Octicon icon={Person}/>
</span>
)) || 'Menu'}
</button>
<div className="dropdown-menu dropdown-menu-right"
aria-labelledby="dropdownMenuButton">
{this.props.navigation.map((nav, index) => {
const navTitle = nav[0];
const navAction = nav[1];
return <span key={index} className="dropdown-item"
onClick={navAction}>{navTitle}</span>;
})}
</div>
</div>
)}
</div>
</div>
);
}
return (
<div className={'title'}><strong>{this.props.title}</strong></div>
);
}
}
Navigation.propTypes = {
title: PropTypes.string.isRequired,
afterTitle: PropTypes.object,
navigation: PropTypes.array,
username: PropTypes.string,
};
|
