Files
supabase/apps/studio/components/layouts/ProjectLayout/LayoutHeader/BreadcrumbsView.tsx
T
Joshen Lim 34a2ccdae3 feat/notifications v2 (#19162)
* Midway implementation notifications v2

* Some updates to Tab component

* Midway implementation notifications v2 again

* implement infinite scrolling and loading for notification sv2

* Add button actions

* Implement archive notifications

* Add filter dropdown for notifications

* Update date format

* Small style fix

* Update

* Update API codegen

* Add empt state

* Add empty state for archived notifications

* Fix type

* Final changes to notifications v2

* Small style fix

* Small fix

* Only mark notifications that come into view as read

* Update package lock
2024-01-08 12:52:48 +08:00

48 lines
1.5 KiB
TypeScript

import { observer } from 'mobx-react-lite'
import { Fragment } from 'react'
interface BreadcrumbsViewProps {
defaultValue: any
}
const BreadcrumbsView = ({ defaultValue: breadcrumbs }: BreadcrumbsViewProps) => {
return (
<>
{breadcrumbs?.length
? breadcrumbs.map((breadcrumb: any, i: number) => (
<Fragment key={breadcrumb.key}>
{i > 0 && (
<span className="text-border-stronger dark:text-border-strong">
<svg
viewBox="0 0 24 24"
width="16"
height="16"
stroke="currentColor"
strokeWidth="1"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
shapeRendering="geometricPrecision"
>
<path d="M16 3.549L7.12 20.600"></path>
</svg>
</span>
)}
<a
onClick={breadcrumb.onClick || (() => {})}
className={`text-gray-1100 block px-2 py-1 text-xs leading-5 focus:bg-gray-100 focus:text-gray-900 focus:outline-none ${
breadcrumb.onClick ? 'cursor-pointer hover:text-white' : ''
}`}
>
{breadcrumb.label}
</a>
</Fragment>
))
: null}
</>
)
}
export default observer(BreadcrumbsView)