fix: submit only dirty form fields when evaluating visibility rules (#…

…139)

* fix: submit only dirty form fields when evaluating visibility rules
We should not submit hidden fields or not yet touched fields when evaluating visiblity conditions,
because default values for those fields will lead wrongly evaluated conditions, espicially for is_none_of operator

* version bump

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@awell-health/ui-library",
-  "version": "0.1.52",
+  "version": "0.1.53",
   "private": false,
   "description": "UI components to integrate with Awell Health",
   "repository": {
@@ -193,4 +193,4 @@
     ]
   },
   "homepage": "https://github.com/awell-health/ui-library#readme"
-}
+}

src/hooks/useForm/helpers.ts

@@ -276,3 +276,18 @@ export const getErrorsForQuestion = (
 
   return []
 }
+
+export const getDirtyFieldValues = (formMethods: UseFormReturn) => {
+  const {
+    formState: { dirtyFields },
+    getValues,
+  } = formMethods
+  const allValues = getValues()
+  const dirtyValues = Object.keys(dirtyFields).reduce((acc, key) => {
+    if (dirtyFields[key]) {
+      acc[key] = allValues[key]
+    }
+    return acc
+  }, {} as Record<string, AnswerValue>)
+  return dirtyValues
+}

src/hooks/useForm/useConversationalForm.tsx

@@ -5,6 +5,7 @@ import {
   calculatePercentageCompleted,
   convertToAwellInput,
   convertToFormFormat,
+  getDirtyFieldValues,
   getErrorsForQuestion,
   getInitialValues,
   isEmpty,
@@ -53,7 +54,9 @@ const useConversationalForm = ({
 
   const updateQuestionVisibility = useCallback(async () => {
     setIsEvaluatingQuestionVisibility(true)
-    const formValuesInput = convertToAwellInput(formMethods.getValues())
+    const formValuesInput = convertToAwellInput(
+      getDirtyFieldValues(formMethods)
+    )
     const evaluationResults = await evaluateDisplayConditions(formValuesInput)
     const updatedQuestions = updateVisibility(
       questions,

src/hooks/useForm/useTraditionalForm.tsx

@@ -4,6 +4,7 @@ import { useValidate } from '../useValidate'
 import {
   convertToAwellInput,
   convertToFormFormat,
+  getDirtyFieldValues,
   getErrorsForQuestion,
   getInitialValues,
   isEmpty,
@@ -49,7 +50,9 @@ const useTraditionalForm = ({
     useValidate()
 
   const updateQuestionVisibility = useCallback(async () => {
-    const formValuesInput = convertToAwellInput(formMethods.getValues())
+    const formValuesInput = convertToAwellInput(
+      getDirtyFieldValues(formMethods)
+    )
     const evaluationResults = await evaluateDisplayConditions(formValuesInput)
     const updatedQuestions = updateVisibility(
       questions,