Function SideBarItemComponent

frontend/src/components/sidebar-item.tsx:35–164

({
  id,
  currentChatId,
  title,
  onSelect,
  refetchChats,
}: SideBarItemProps)

  currentChatId: string;
  title: string;
  createdAt?: string | number | Date;
  onSelect: (id: string) => void;
  refetchChats: () => void;
}

const relativeTime = (value?: string | number | Date) => {
  if (!value) return '';
  const then = new Date(value).getTime();
  if (Number.isNaN(then)) return '';
  const minutes = Math.round((Date.now() - then) / 60000);
  if (minutes < 1) return 'now';
  if (minutes < 60) return `${minutes}m`;
  const hours = Math.round(minutes / 60);
  if (hours < 24) return `${hours}h`;
  return `${Math.round(hours / 24)}d`;
};

/**
 * One row in the chat rail.
 *
 * The row is a container, not a button — the previous version nested the menu
 * button and a dialog inside the row's own <button>, which is invalid markup
 * and needed stopPropagation on every child to stay usable.
 */
function SideBarItemComponent({
  id,
  currentChatId,
  title,
  createdAt,
  onSelect,
  refetchChats,
}: SideBarItemProps) {
  const [isDialogOpen, setIsDialogOpen] = useState(false);
  const [renaming, setRenaming] = useState(false);
  const [draft, setDraft] = useState(title);
  const inputRef = useRef<HTMLInputElement>(null);
  const router = useRouter();
  const isSelected = currentChatId === id;

  useEffect(() => setDraft(title), [title]);
  useEffect(() => {
    if (renaming) inputRef.current?.select();
  }, [renaming]);

  const [updateTitle] = useMutation(UPDATE_CHAT_TITLE, {
    onCompleted: () => refetchChats(),
    onError: (error) => {
      logger.error('Error renaming chat:', error);
      toast.error('Could not rename this chat');
      setDraft(title);
    },
  });

  const [clearHistory] = useMutation(CLEAR_CHAT_HISTORY, {
    onCompleted: () => {
      toast.success('History cleared');
      // The open conversation is now stale — reload it from the server.
      if (isSelected) window.dispatchEvent(new Event(EventEnum.CHAT));