Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3530 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import { useEffect, useState } from 'react';

import { useFetch } from './useFetch';

export function usePagination({ initialPage = 1, initialLimit = 10, apiUrl, initialParams = {} }) {
  const [page, setPage] = useState(initialPage);
  const [limit, setLimit] = useState(initialLimit);

  // Creamos un nuevo objeto de parámetros que incluye la página y el límite
  const currentParams = { ...initialParams, page, limit };

  // Usamos nuestro useFetch hook
  const { data, loading, error, refetch } = useFetch(apiUrl, { params: currentParams });

  // Opcional: Estado para el total de elementos (si la API lo devuelve en la respuesta)
  const [total, setTotal] = useState(0);

  // Efecto para actualizar el total si los datos cambian (asumiendo que la API devuelve el total en la data o en headers)
  // Esto dependerá de cómo tu API implemente la paginación y devuelva el total.
  // Ejemplo asumiendo que 'totalCount' viene en los datos:
  useEffect(() => {
    if (data) {
      setPage(data.current.page);
      setTotal(data.total.count);
    }
  }, [data]);

  const nextPage = () => {
    setPage((prevPage) => prevPage + 1);
  };

  const prevPage = () => {
    setPage((prevPage) => Math.max(1, prevPage - 1));
  };

  const goToPage = (newPage) => {
    setPage(newPage);
  };

  const setPageLimit = (newLimit) => {
    setLimit(newLimit);
    setPage(1); // Resetear a la primera página al cambiar el límite
  };

  // No necesitamos una función de "fetch" explícita aquí,
  // useFetch se encarga de hacer la petición cuando apiUrl o currentParams cambian.

  return {
    page,
    limit,
    data,
    loading,
    error,
    total, // Opcional
    nextPage,
    prevPage,
    goToPage,
    setPageLimit,
    refetch // Exponemos la función refetch de useFetch por si el componente la necesita
  };
}