crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-22 12:24:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

merge: override BreadCrumb Common

Browse Source
This commit is contained in:
unknown 2021-09-10 11:51:40 +07:00
parent 41fc0dbe98
commit f925b35534
1 changed files with 17 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/components/common/BreadcrumbCommon/BreadcrumbCommon.tsx
View File

@ -1,4 +1,5 @@
import React from 'react'
import { ROUTE } from 'src/utils/constanst.utils'
import s from './BreadcrumbCommon.module.scss'
import BreadcrumbItem from './components/BreadcrumbItem/BreadcrumbItem'
import BreadcrumbSeparator from './components/BreadcrumbSeparator/BreadcrumbSeparator'
@ -8,56 +9,29 @@ interface BreadcrumbCommonProps {
showHomePage?: boolean;
}
const BreadcrumbCommon = ({ crumbs, showHomePage=true } : BreadcrumbCommonProps) => {
const BreadcrumbCommon = ({ crumbs, showHomePage = true }: BreadcrumbCommonProps) => {
return (
<section className={s.breadcrumbCommon}>
{
showHomePage && crumbs[0].link==="/" && crumbs.map((crumb, i) => {
if (i === 0) {
return (
<BreadcrumbItem key={crumb.name} text={crumb.name} href={crumb.link} />
)
}
if (i === crumbs.length-1) {
return (
<BreadcrumbSeparator key={crumb.name}>
<span>{crumb.name}</span>
</BreadcrumbSeparator>
)
}
return (
<BreadcrumbSeparator key={crumb.name}>
<BreadcrumbItem text={crumb.name} href={crumb.link} />
</BreadcrumbSeparator>
)
})
showHomePage && <BreadcrumbItem key='Home' text='Home' href={ROUTE.HOME} />
}
{
!showHomePage && crumbs.map((crumb, i) => {
if (i === 0) {
return
}
if (i === 1) {
return (
<BreadcrumbItem key={crumb.name} text={crumb.name} href={crumb.link} />
)
}
if (i === crumbs.length-1) {
return (
<BreadcrumbSeparator key={crumb.name}>
<span>{crumb.name}</span>
crumbs.length > 0 && <>
{
crumbs.slice(0, crumbs.length - 1).map((crumb) => (
< BreadcrumbSeparator key={crumb.name}>
<BreadcrumbItem text={crumb.name} href={crumb.link} />
</BreadcrumbSeparator>
)
}
return (
<BreadcrumbSeparator key={crumb.name}>
<BreadcrumbItem text={crumb.name} href={crumb.link} />
</BreadcrumbSeparator>
)
})
))}
< BreadcrumbSeparator>
<span className={s.currentItem}>{crumbs[crumbs.length - 1].name}</span>
</BreadcrumbSeparator>
</>
}
</section>
</section >
)
}
export default BreadcrumbCommon
export default BreadcrumbCommon