Files
medusa-store/www/apps/docs/src/theme/DocSidebarItem/Link/index.tsx
Shahed Nasser fa7c94b4cc docs: create docs workspace (#5174)
* docs: migrate ui docs to docs universe

* created yarn workspace

* added eslint and tsconfig configurations

* fix eslint configurations

* fixed eslint configurations

* shared tailwind configurations

* added shared ui package

* added more shared components

* migrating more components

* made details components shared

* move InlineCode component

* moved InputText

* moved Loading component

* Moved Modal component

* moved Select components

* Moved Tooltip component

* moved Search components

* moved ColorMode provider

* Moved Notification components and providers

* used icons package

* use UI colors in api-reference

* moved Navbar component

* used Navbar and Search in UI docs

* added Feedback to UI docs

* general enhancements

* fix color mode

* added copy colors file from ui-preset

* added features and enhancements to UI docs

* move Sidebar component and provider

* general fixes and preparations for deployment

* update docusaurus version

* adjusted versions

* fix output directory

* remove rootDirectory property

* fix yarn.lock

* moved code component

* added vale for all docs MD and MDX

* fix tests

* fix vale error

* fix deployment errors

* change ignore commands

* add output directory

* fix docs test

* general fixes

* content fixes

* fix announcement script

* added changeset

* fix vale checks

* added nofilter option

* fix vale error
2023-09-21 20:57:15 +03:00

79 lines
2.7 KiB
TypeScript

import React from "react"
import clsx from "clsx"
import { ThemeClassNames } from "@docusaurus/theme-common"
import { isActiveSidebarItem } from "@docusaurus/theme-common/internal"
import Link from "@docusaurus/Link"
import isInternalUrl from "@docusaurus/isInternalUrl"
import IconExternalLink from "@theme/Icon/ExternalLink"
import type { Props } from "@theme/DocSidebarItem/Link"
import { ModifiedPropSidebarItemLink } from "@medusajs/docs"
import DocSidebarItemIcon from "../../../components/DocSidebarItemIcon"
import { Badge } from "docs-ui"
type ModifiedProps = Props & {
item: ModifiedPropSidebarItemLink
}
export default function DocSidebarItemLink({
item,
onItemClick,
activePath,
level,
...props
}: ModifiedProps): JSX.Element {
const { href, label, className, autoAddBaseUrl, customProps } = item
const isActive = isActiveSidebarItem(item, activePath)
const isInternalLink = isInternalUrl(href)
return (
<li
className={clsx(
ThemeClassNames.docs.docSidebarItemLink,
ThemeClassNames.docs.docSidebarItemLinkLevel(level),
"menu__list-item",
className,
customProps?.sidebar_is_title && "sidebar-title",
customProps?.sidebar_is_group_headline && "sidebar-group-headline",
customProps?.sidebar_is_group_divider && "sidebar-group-divider",
customProps?.sidebar_is_divider_line && "sidebar-divider-line",
customProps?.sidebar_is_back_link && "sidebar-back-link",
customProps?.sidebar_is_soon &&
"sidebar-soon-link sidebar-badge-wrapper",
!customProps?.sidebar_is_title &&
"[&_.sidebar-item-icon]:w-[20px] [&_.sidebar-item-icon]:h-[20px]",
!customProps?.sidebar_is_title &&
!customProps?.sidebar_is_back_link &&
"[&_.sidebar-item-icon]:mr-0.75"
)}
key={label}
>
<Link
className={clsx("menu__link", !isInternalLink && "items-center", {
"menu__link--active": isActive,
})}
autoAddBaseUrl={autoAddBaseUrl}
aria-current={isActive ? "page" : undefined}
to={href}
{...(isInternalLink && {
onClick: onItemClick ? () => onItemClick(item) : undefined,
})}
{...props}
>
{customProps?.sidebar_icon && (
<DocSidebarItemIcon
icon={customProps.sidebar_icon}
is_title={customProps.sidebar_is_title}
is_disabled={customProps?.sidebar_is_soon}
/>
)}
{label}
{!isInternalLink && <IconExternalLink />}
</Link>
{customProps?.sidebar_is_soon && (
<Badge variant="purple" className={`sidebar-soon-badge`}>
Soon
</Badge>
)}
</li>
)
}