import React from 'react';
import type { GroupedSilkeListItems, SilkeListItemData, SilkeListItemType } from './types';

export function isSilkeListItem(item: SilkeListItemType): item is SilkeListItemData {
  return !React.isValidElement(item) && item !== 'divider';
}

export function groupSilkeListItems(items: SilkeListItemType[]): GroupedSilkeListItems[] {
  const grouped: GroupedSilkeListItems[] = [];
  let currentGroup: GroupedSilkeListItems | null = null;

  items.forEach((item) => {
    const groupLabel = isSilkeListItem(item) ? item.groupLabel : undefined;

    if (!currentGroup || currentGroup.groupLabel !== groupLabel) {
      currentGroup = { groupLabel, items: [] };
      grouped.push(currentGroup);
    }

    currentGroup.items.push(item);
  });

  return grouped;
}