import { type ComponentProps } from 'react'

import { TbBaselineDensityMedium } from 'react-icons/tb'

import { SidebarCloseIcon } from '@/components/atoms/icons'

import { Button } from '@/components/atoms'

import { useSidebar } from '@/hooks/useSidebar'

type TriggerProps = ComponentProps<typeof Button>

function Trigger({ className, onClick, ...props }: TriggerProps) {
	const { isOpen, toggleSidebar } = useSidebar()

	return (
		<button data-type='sidebar-trigger' onClick={toggleSidebar} {...props}>
			{isOpen ? <SidebarCloseIcon /> : <TbBaselineDensityMedium />}
		</button>
	)
}

export { Trigger }
