37 lines
923 B
JavaScript
37 lines
923 B
JavaScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Link } from 'react-router-dom';
|
|
import { Label, Arrow } from 'payload/components';
|
|
|
|
import './index.css';
|
|
|
|
const mapStateToProps = state => ({
|
|
nav: state.common.stepNav
|
|
});
|
|
|
|
class StepNav extends Component {
|
|
render() {
|
|
const dashboardLabel = <Label>Dashboard</Label>;
|
|
|
|
return (
|
|
<nav className="current-view-nav">
|
|
{this.props.nav.length > 0
|
|
? <Link to="/">{dashboardLabel}<Arrow /></Link>
|
|
: dashboardLabel
|
|
}
|
|
{this.props.nav.map((item, i) => {
|
|
const StepLabel = <Label key={i}>{item.label}</Label>;
|
|
|
|
const Step = this.props.nav.length === i + 1
|
|
? StepLabel
|
|
: <Link to={item.url} key={i}>{StepLabel}<Arrow /></Link>;
|
|
|
|
return Step;
|
|
})}
|
|
</nav>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default connect(mapStateToProps)(StepNav);
|