Skip to main content

useDocuments

Overview​

useDocuments is a custom React hook that fetches and manages the state of various document types (notebooks, PDFs, boards, and coaching documents) related to a specific project and user. It uses @tanstack/react-query for data fetching and caching, and it relies on the authentication state and project session.

Usage​

To use useDocuments, ensure your component has access to authentication data via useAuth and project session data via useProjectSession.

import React from 'react';
import useDocuments from '@lunchbox/apps/hooks/useDocuments';


const DocumentsList: React.FC = () => {
  const { data: documents, isLoading, isError, error } = useDocuments();

  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (isError) {
    return <div>Error: {error.message}</div>;
  }

  return (
    <div>
      <h1>Documents</h1>
      <ul>
        {documents.map(doc => (
          <li key={doc._id}>
            {doc.title} ({doc.type})
          </li>
        ))}
      </ul>
    </div>
  );
};

export default DocumentsList;

Parameters​

This hook does not take any parameters directly. It uses the following:

  • auth.user._id: Retrieved from the authentication context using useAuth.
  • project._id: Retrieved from the project session using useProjectSession.

Returns​

The hook returns an object with the following properties, managed by useQuery from @tanstack/react-query:

  • data: An array of documents (notebooks, PDFs, boards, and coaching documents).
  • isLoading: A boolean indicating if the data is currently being loaded.
  • isError: A boolean indicating if there was an error fetching the data.
  • error: The error object if an error occurred during data fetching.

Notes​

  • The hook fetches data from multiple endpoints (listNotebooks, listPDFDocuments, listBoards, listCoachingDocs) and combines the results into a single array.
  • Ensure that the QUERY_KEYS constant is correctly defined to generate the appropriate query key for the documents.
  • The hook relies on useAuth to retrieve the authenticated user data and useProjectSession to retrieve the current project data.