const COLORS = {
  from: {
    purple: "from-purple-500",
    pink: "from-pink-500",
    gray: "from-gray-700",
    blue: "from-blue-500",
    green: "from-green-500",
    yellow: "from-yellow-500",
    indigo: "from-indigo-500",
  },
  to: {
    purple: "to-purple-500",
    pink: "to-pink-500",
    gray: "to-gray-700",
    blue: "to-blue-500",
    green: "to-green-500",
    yellow: "to-yellow-500",
    indigo: "to-indigo-500",
  },
};

export const fetchFilteredSpaces = async (hardwareType: 'gpu' | 'cpu', searchQuery: string = '') => {
  const url = `https://huggingface.co/spaces-json?runtime.stage=RUNNING&sort=trending`;
  const response = await fetch(url);
  const json = await response.json();
  const spaces = json?.spaces;

  if (!spaces) {
    return [];
  }

  const filteredSpaces = spaces.filter((space: any) => {
    const hasHardware = hardwareType === 'gpu' ? space.runtime.hardware.current.includes('gpu') : space.runtime.hardware.current.includes('cpu');
    const matchesSearch = space.name.toLowerCase().includes(searchQuery.toLowerCase()) || space.description.toLowerCase().includes(searchQuery.toLowerCase());
    return hasHardware && matchesSearch && space.runtime.hardware.current !== '0';
  });

  return filteredSpaces.map((space: any) => ({
    ...space,
    colorFrom: COLORS.from[space.colorFrom as keyof typeof COLORS.from] || COLORS.from.purple,
    colorTo: COLORS.to[space.colorTo as keyof typeof COLORS.from] || COLORS.to.pink,
  }));
};