RHF with Table pagination custom submit

[RomanTolkachev]

Hi! I’m working on a complex form logic for a dashboard with a table, and I’m not sure if my approach is optimal. My project is tightly coupled with a Laravel backend, and the form’s behavior depends heavily on dynamic backend data.

Current Setup:
The form is initialized via FormProvider.

defaultValues are set asynchronously (in useEffect) because filters come from the backend, and their structure is unpredictable.

The dashboard always includes page and perPage fields alongside column filters.

Key Logic Requirements:
If a column filter changes, page must reset to 1.

On a full form reset, perPage should persist.

If only page changes, the rest of the form state should remain untouched.

Custom Submit Behavior:
Instead of a traditional form submission, I update a query object tied to a Tanstack Query key.

Query changes trigger data refetching (acting as a "submit").

Previous Approach (Too Complex):
I stored the last submitted values in useRef and manually compared changes on each submit.

This became a maintenance nightmare—only I understood how it worked.

New Approach (Problem with dirtyFields):
I want to simplify this by using dirtyFields to track changes and reset them after successful submits.

Issue: dirtyFields isn’t reset when calling reset().

Challenges:
The project has many interconnected components and relies on Laravel + React.

I’m unsure if a CodeSandbox demo is feasible, but here’s the core provider implementation:
→ AbstractFormProvider.tsx

If a live example is needed, please suggest a platform where I can share the full context (Laravel + React setup).

Questions:
Is there a better way to handle this logic?

How can I reset dirtyFields while preserving certain fields (like perPage)?

Where should I provide a reproducible example given the backend dependency?

Thanks for your help!