import { useState, useCallback, useMemo } from 'react';

const STORAGE_PREFIX = 'umbra-';

export function useCategoryOrder(key: string, categories: string[]) {
  const storageKey = `${STORAGE_PREFIX}${key}-category-order`;

  const [savedOrder, setSavedOrder] = useState<string[]>(() => {
    try {
      const raw = localStorage.getItem(storageKey);
      if (!raw) return [];
      const parsed = JSON.parse(raw);
      return Array.isArray(parsed) ? parsed.filter((x): x is string => typeof x === 'string') : [];
    } catch {
      return [];
    }
  });

  const orderedCategories = useMemo(() => {
    const catSet = new Set(categories);
    // Keep saved items that still exist, in saved order
    const ordered = savedOrder.filter((c) => catSet.has(c));
    // Append any new categories not in saved order
    const remaining = categories.filter((c) => !savedOrder.includes(c));
    return [...ordered, ...remaining];
  }, [categories, savedOrder]);

  const reorder = useCallback(
    (newOrder: string[]) => {
      setSavedOrder(newOrder);
      try {
        localStorage.setItem(storageKey, JSON.stringify(newOrder));
      } catch {
        // localStorage full — silently ignore
      }
    },
    [storageKey],
  );

  return { orderedCategories, reorder };
}