type OrderedItem = {
  id: string;
};

export function reorderCanvasSkillTags<T extends OrderedItem>(
  tags: T[],
  draggedId: string,
  targetId: string
) {
  if (!draggedId || !targetId || draggedId === targetId) return tags;
  const currentIndex = tags.findIndex((tag) => tag.id === draggedId);
  const targetIndex = tags.findIndex((tag) => tag.id === targetId);
  if (currentIndex < 0 || targetIndex < 0) return tags;

  const nextTags = [...tags];
  const [draggedTag] = nextTags.splice(currentIndex, 1);
  if (!draggedTag) return tags;
  const nextTargetIndex = nextTags.findIndex((tag) => tag.id === targetId);
  nextTags.splice(nextTargetIndex < 0 ? targetIndex : nextTargetIndex, 0, draggedTag);
  return nextTags;
}

export function applyCanvasSkillTagOrder<T extends OrderedItem>(
  tags: T[],
  order: string[]
) {
  if (tags.length < 2 || order.length === 0) return tags;

  const tagById = new Map(tags.map((tag) => [tag.id, tag]));
  const orderedTags = order
    .map((id) => tagById.get(id))
    .filter((tag): tag is T => Boolean(tag));
  const orderedIds = new Set(orderedTags.map((tag) => tag.id));
  return [...orderedTags, ...tags.filter((tag) => !orderedIds.has(tag.id))];
}