32 lines
700 B
TypeScript

import React from 'react'
import { RiCheckLine } from '@remixicon/react'
type PermissionItemProps = {
leftIcon: React.ReactNode
text: string
onClick: () => void
isSelected: boolean
}
const PermissionItem = ({
leftIcon,
text,
onClick,
isSelected,
}: PermissionItemProps) => {
return (
<div
className='flex cursor-pointer items-center gap-x-1 rounded-lg px-2 py-1 hover:bg-state-base-hover'
onClick={onClick}
>
{leftIcon}
<div className='system-md-regular grow px-1 text-text-secondary'>
{text}
</div>
{isSelected && <RiCheckLine className='size-4 text-text-accent' />}
</div>
)
}
export default React.memo(PermissionItem)