Skip to main content

useDuplicateDocument

Overview​

useDuplicateDocument is a custom React hook that facilitates the duplication of a document. It utilizes @tanstack/react-query for managing the mutation and updating the cache. The hook ensures that the document is duplicated within the current project session, and the related cache entries are invalidated to reflect the changes in the UI.

Usage​

To use useDuplicateDocument, ensure your component has access to the necessary hooks (useAuth, useProjectSession).

import React from 'react';
import useDuplicateDocument from '@lunchbox/apps/hooks/useDuplicateDocument';
import { NavbarDoc } from '@lunchbox/apps/types/docs';

const DocumentDuplicator: React.FC<{ doc: NavbarDoc; projectId: string }> = ({ doc, projectId }) => {
  const duplicateDocument = useDuplicateDocument();

  const handleDuplicate = () => {
    duplicateDocument.mutate({ doc, data: { projectId } });
  };

  return (
    <button onClick={handleDuplicate}>Duplicate Document</button>
  );
};

export default DocumentDuplicator;

Parameters​

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

  • payload: An object containing:
    • doc: A NavbarDoc object representing the document to be duplicated.
    • data: An object containing:
      • projectId: The ID of the project where the document will be duplicated.

Returns​

The hook returns a mutation object with the following properties, managed by useMutation from @tanstack/react-query:

  • mutate: A function to trigger the mutation.
  • isLoading: A boolean indicating if the mutation is currently being executed.
  • isError: A boolean indicating if there was an error during the mutation.
  • error: The error object if an error occurred during the mutation.
  • isSuccess: A boolean indicating if the mutation was successful.

Notes​

  • The hook relies on the authentication state to retrieve the current user data and the project session to retrieve the current project data.
  • The DOCUMENT_MAPPER should map document types to their respective classes, which implement the duplicate method.
  • Upon successful mutation, the hook invalidates the related cache queries to ensure the UI reflects the updated state.