import { ReactNode } from 'react';

import { Icon } from '@iconify/react';
import Collapse from '@/components/Collapse';
import Button from '@/components/Button';

interface RowCollapseOptionsProps {
  children?: ReactNode;
}

const RowCollapseOptions = ({ children }: RowCollapseOptionsProps) => {
  return (
    <Collapse
      title={
        <Button variant='ghost' color='none'>
          <Icon icon='material-symbols:more-vert' width={16} height={16} />
        </Button>
      }
      className='w-fit min-w-36'
      titleClassName='p-0! justify-self-end'
    >
      {children}
    </Collapse>
  );
};

export default RowCollapseOptions;