Files
medusa-store/www/apps/resources/components/EventHeader/index.tsx
Shahed Nasser e09b2a4db5 docs: support version in events reference (#12422)
* docs: support version in events reference

* remove changes in events output

* remove events emitted in comments

* remove customer updated event

* check for emitEventStep usage

* fixes
2025-05-09 14:34:15 +03:00

79 lines
1.7 KiB
TypeScript

"use client"
import { Brackets, CheckCircle, SquareTwoStack, Tag } from "@medusajs/icons"
import {
DropdownMenu,
H2,
H2Props,
H3,
H3Props,
useCopy,
useGenerateSnippet,
} from "docs-ui"
type EventHeaderProps = (
| {
headerLvl: "2"
headerProps: H2Props
}
| {
headerLvl: "3"
headerProps: H3Props
}
) & {
eventName: string
payload: string
}
export const EventHeader = ({
headerLvl,
headerProps,
eventName,
payload: payloadStr,
}: EventHeaderProps) => {
const Header = headerLvl === "2" ? H2 : H3
const { snippet } = useGenerateSnippet({
type: "subscriber",
options: {
event: eventName,
payload: payloadStr,
},
})
const { handleCopy: handleEventNameCopy, isCopied: eventNameCopied } =
useCopy(eventName)
const { handleCopy: handleSnippetCopy, isCopied: snippetCopied } =
useCopy(snippet)
return (
<div className="flex items-center justify-between flex-wrap">
<Header {...headerProps}>{headerProps.children ?? eventName}</Header>
<DropdownMenu
dropdownButtonContent={
<>
{eventNameCopied || snippetCopied ? (
<CheckCircle />
) : (
<SquareTwoStack />
)}
</>
}
menuItems={[
{
type: "action",
title: "Copy event name",
action: () => handleEventNameCopy(),
icon: <Tag />,
},
{
type: "action",
title: "Copy subscriber for event",
action: () => handleSnippetCopy(),
icon: <Brackets />,
},
]}
menuClassName="z-10"
/>
</div>
)
}