"use client"
import {
  TabMenu as DSTabMenu,
  TabMenuItem as DSTabMenuItem,
  ItemRenderLinkComponent,
  TabMenuItemProps,
} from "@opensea/ui-kit"
import React, { ElementRef, forwardRef } from "react"
import { Link } from "../Link"

const NextTabMenuItem = Object.assign(
  forwardRef<ElementRef<typeof DSTabMenuItem>, TabMenuItemProps>(
    function NextTabMenuItem(props, ref) {
      return (
        <DSTabMenuItem
          renderLink={Link as ItemRenderLinkComponent}
          {...props}
          ref={ref}
        />
      )
    },
  ),
  {
    Title: DSTabMenuItem.Title,
  },
)

export const TabMenu = Object.assign({}, DSTabMenu, {
  Item: NextTabMenuItem,
})