Proyectos de Subversion LeadersLinked - SPA

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

  };

}