Hooks & Tanstack Query Integration

[mahid797]

Goal

Centralize API calls into domain‐specific hooks, leveraging Tanstack Query for caching and reactivity. This includes fetching dynamic visitor fields and handling them in a typed manner. Keep a “one endpoint → one hook” principle for clarity and testability.

Detailed Guidelines

• Location: All hooks go into src/hooks/documentAccess/.
• One Endpoint → One Hook: e.g. useDocumentAccess for GET link details, useVisitorSubmission for POST visitor data/password.
• Tanstack Query:
  • Use useQuery for fetching link info (like GET /api/public_links/[linkId]).
  • Use useMutation for POST calls (like POST /api/public_links/[linkId]/access).
• JSON Fields: The server will return visitorFields in JSON along with flags like passwordProtected, but also store name/email columns (depending on how it's setup). The hooks should parse and store them in state appropriately.

  If the server is storing name/email in columns, the user submission is either duplicated in visitorData or merges with those columns.

Tasks

1. Create useDocumentAccess.ts:
   • useQuery(['documentAccess', linkId], ...) to fetch link data.
   • Return loading/error/linkData. The linkData should contain:
     • visitorFields (an array or object of keys: e.g., ["name","email"]),
     • passwordProtected: boolean,
     • possibly name/email columns if the server uses them.
2. Create useVisitorSubmission.ts:
   • Use useMutation for sending { visitorData, password? } to POST /api/public_links/[linkId]/access.
   • The server references minimal keys from visitorFields and merges them if it has columns for name/email.
3. Refactor existing components (AccessPage.tsx, VisitorInfoModal.tsx) to call these hooks instead of direct axios.
4. Ensure naming:
   • Hooks: useDocumentAccess, useVisitorSubmission, useDocumentAnalytics (if needed), etc.
   • Reuse src/hooks/ for domain‐based folders: documentAccess, documents, auth, etc.
5. Handle direct link usage (if public) inside AccessPage.tsx by calling a “direct access” method from useDocumentAccess.