Reports

I am facing the exact same issue:

console.log(variationGroupForm.formState.isDirty, " :: is dirty"); // is true
console.log(variationGroupForm.formState.dirtyFields, " :: dirty fields"); // but has no dirty fields

I have an isEmpty function that checks the length of Object.keys of the dirtyFields object.

<Button
  loading={isUpdating}
  disabled={isEmpty(variationGroupForm.formState.dirtyFields) || !variationGroupForm.formState.isValid}
  onClick={variationGroupForm.handleSubmit(onUpdateVariationGroup)}
>
  Update
</Button>

This works.

export function isEmpty(obj: Record<string, any> | null | undefined): boolean {
  if (obj == null) return true;

  if (typeof obj !== "object") return false;

  if (Array.isArray(obj)) return obj.length === 0;

  if (obj instanceof Map || obj instanceof Set) return obj.size === 0;

  return Object.keys(obj).length === 0;
}

79567668