ListItem

import { IconCopy } from 'twenty-ui/icon';
import { ListItem } from 'twenty-ui/navigation';

type DuplicateActionProps = { onDuplicate: () => void };

export const DuplicateAction = ({ onDuplicate }: DuplicateActionProps) => (
  <ListItem
    render={<button type="button" />}
    startIcon={<IconCopy aria-hidden />}
    description="Create a copy"
    onClick={onDuplicate}
  >
    Duplicate
  </ListItem>
);

import { useState } from 'react';
import { ListItem } from 'twenty-ui/navigation';

export const ShowArchivedToggle = () => {
  const [selected, setSelected] = useState(false);

  return (
    <ListItem
      render={<button type="button" aria-pressed={selected} />}
      selected={selected}
      indicator="check"
      onClick={() => setSelected(!selected)}
    >
      Show archived records
    </ListItem>
  );
};