47 lines
1.5 KiB
JavaScript
47 lines
1.5 KiB
JavaScript
import { HomeFilled } from "@ant-design/icons";
|
|
import { Breadcrumb, Row, Col } from "antd";
|
|
import React from "react";
|
|
import { connect } from "react-redux";
|
|
import { Link } from "react-router-dom";
|
|
import { createStructuredSelector } from "reselect";
|
|
import { selectBreadcrumbs } from "../../redux/application/application.selectors";
|
|
import { selectBodyshop } from "../../redux/user/user.selectors";
|
|
import GlobalSearch from "../global-search/global-search.component";
|
|
import "./breadcrumbs.styles.scss";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
breadcrumbs: selectBreadcrumbs,
|
|
bodyshop: selectBodyshop,
|
|
});
|
|
|
|
export function BreadCrumbs({ breadcrumbs, bodyshop }) {
|
|
return (
|
|
<Row className="breadcrumb-container">
|
|
<Col xs={24} sm={24} md={16}>
|
|
<Breadcrumb separator=">">
|
|
<Breadcrumb.Item>
|
|
<Link to={`/manage`}>
|
|
<HomeFilled />{" "}
|
|
{(bodyshop && bodyshop.shopname && `(${bodyshop.shopname})`) ||
|
|
""}
|
|
</Link>
|
|
</Breadcrumb.Item>
|
|
{breadcrumbs.map((item) =>
|
|
item.link ? (
|
|
<Breadcrumb.Item key={item.label}>
|
|
<Link to={item.link}>{item.label} </Link>
|
|
</Breadcrumb.Item>
|
|
) : (
|
|
<Breadcrumb.Item key={item.label}>{item.label}</Breadcrumb.Item>
|
|
)
|
|
)}
|
|
</Breadcrumb>
|
|
</Col>
|
|
<Col xs={24} sm={24} md={8}>
|
|
<GlobalSearch />
|
|
</Col>
|
|
</Row>
|
|
);
|
|
}
|
|
export default connect(mapStateToProps, null)(BreadCrumbs);
|