Merge pull request #8595 from opencrvs/memo-dynamic-options

chore: Refactor to only memoize for dynamic selects

packages/client/src/forms/register/mappings/query/field-mappings.ts

@@ -1197,7 +1197,12 @@ export function questionnaireToTemplateFieldTransformer(
       if (!offlineCountryConfig) {
         return
       }
-      const options = getFieldOptions(field, queryData, offlineCountryConfig)
+      const options = getFieldOptions(
+        sectionId,
+        field,
+        queryData,
+        offlineCountryConfig
+      )
       transformedData[sectionId][field.name] =
         options
           .find((option) => option.value === selectedQuestion.value)

packages/client/src/forms/utils.ts

@@ -55,7 +55,8 @@ import {
   BUTTON,
   Ii18nButtonFormField,
   IRedirectFormField,
-  REDIRECT
+  REDIRECT,
+  SELECT_WITH_DYNAMIC_OPTIONS
 } from '@client/forms'
 import { IntlShape, MessageDescriptor } from 'react-intl'
 import {
@@ -445,19 +446,43 @@ export const getFieldOptionsSlow = (
   }
 }
 
+export const getFieldOptions = (
+  _sectionName: string,
+  field:
+    | ISelectFormFieldWithOptions
+    | ISelectFormFieldWithDynamicOptions
+    | IDocumentUploaderWithOptionsFormField,
+  values: IFormSectionData,
+  offlineCountryConfig: IOfflineData,
+  declaration?: IFormData
+) => {
+  if (field.type === SELECT_WITH_DYNAMIC_OPTIONS) {
+    return getMemoisedFieldOptions(
+      _sectionName,
+      field,
+      values,
+      offlineCountryConfig
+    )
+  }
+
+  return getFieldOptionsSlow(
+    _sectionName,
+    field,
+    values,
+    offlineCountryConfig,
+    declaration
+  )
+}
+
 /** Due to the large location trees with dependencies, generating options for them can be slow. We fix this by memoizing the options */
-export const getFieldOptions = memoize(
+const getMemoisedFieldOptions = memoize(
   getFieldOptionsSlow,
   (sectionName, field, values) => {
-    if (
-      field.type === SELECT_WITH_OPTIONS ||
-      field.type === DOCUMENT_UPLOADER_WITH_OPTION
-    ) {
-      return `field:${sectionName}.${field.name}`
-    }
-
-    const dependencyVal = values[field.dynamicOptions.dependency!] as string
-    return `field:${sectionName}.${field.name},dependency:${field.dynamicOptions.dependency},dependencyValue:${dependencyVal}`
+    const dynamicField = field as ISelectFormFieldWithDynamicOptions
+    const dependencyVal = values[
+      dynamicField.dynamicOptions.dependency!
+    ] as string
+    return `field:${sectionName}.${field.name},dependency:${dynamicField.dynamicOptions.dependency},dependencyValue:${dependencyVal}`
   }
 )