Fix(v0): Handle computed presentational attributes correctly (#195)

* fix(v0): handle computed presentational attributes correctly

* chore: add test for computed presentational attributes

Author: antoniocapelo

src/jsonLogic.js

@@ -233,12 +233,22 @@ function replaceHandlebarsTemplates({
 export function calculateComputedAttributes(fieldParams, { parentID = 'root' } = {}) {
   return ({ logic, isRequired, config, formValues }) => {
     const { name, computedAttributes } = fieldParams;
-    const attributes = Object.fromEntries(
+    let attributes = Object.fromEntries(
       Object.entries(computedAttributes)
         .map(handleComputedAttribute(logic, formValues, parentID, name))
         .filter(([, value]) => value !== null)
     );
 
+    const { 'x-jsf-presentation': presentation, ...rest } = attributes;
+
+    // Computed presentation attributes should be spread over the original attributes
+    if (presentation) {
+      attributes = {
+        ...rest,
+        ...presentation,
+      };
+    }
+
     return {
       ...attributes,
       schema: buildYupSchema(
@@ -274,16 +284,25 @@ function handleComputedAttribute(logic, formValues, parentID, name) {
           handleNestedObjectForComputedValues(value, formValues, parentID, logic, name),
         ];
       case 'x-jsf-presentation': {
-        if (value.statement) {
-          return [
-            'statement',
-            handleNestedObjectForComputedValues(value.statement, formValues, parentID, logic, name),
-          ];
-        }
-        return [
-          key,
-          handleNestedObjectForComputedValues(value.statement, formValues, parentID, logic, name),
-        ];
+        const values = {};
+
+        Object.entries(value).forEach(([presentationKey, presentationValue]) => {
+          if (typeof presentationValue === 'object') {
+            values[presentationKey] = handleNestedObjectForComputedValues(
+              presentationValue,
+              formValues,
+              parentID,
+              logic,
+              name
+            );
+          } else {
+            values[presentationKey] = logic
+              .getScope(parentID)
+              .applyComputedValueInField(presentationValue, formValues, name);
+          }
+        });
+
+        return [key, values];
       }
       case 'const':
       default: {

src/tests/jsonLogic.fixtures.js

@@ -364,6 +364,55 @@ export const schemaWithComputedAttributesAndErrorMessages = {
   },
 };
 
+export const schemaWithComputedPresentationAttributes = {
+  properties: {
+    amount: {
+      description: 'Total amount to be reimbursed, including taxes.',
+      minimum: 0,
+      title: 'Total amount',
+      type: 'number',
+      'x-jsf-logic-computedAttrs': {
+        'x-jsf-presentation': {
+          currency: 'currency_selected',
+        },
+      },
+      'x-jsf-presentation': {
+        currency: '---',
+        inputType: 'money',
+      },
+    },
+    currency: {
+      default: 'USD',
+      description: 'Currency in which the expense was paid.',
+      oneOf: [
+        {
+          const: 'UGX',
+          title: 'UGX - Ugandan Shilling',
+        },
+        {
+          const: 'USD',
+          title: 'USD - United States Dollar',
+        },
+      ],
+      title: 'Currency',
+      type: 'string',
+      'x-jsf-presentation': {
+        inputType: 'select',
+      },
+    },
+  },
+  type: 'object',
+  'x-jsf-logic': {
+    computedValues: {
+      currency_selected: {
+        rule: {
+          var: 'currency',
+        },
+      },
+    },
+  },
+};
+
 export const schemaWithDeepVarThatDoesNotExist = {
   properties: {
     field_a: {

src/tests/jsonLogic.test.js

@@ -35,6 +35,7 @@ import {
   schemaWithValidationThatDoesNotExistOnProperty,
   badSchemaThatWillNotSetAForcedValue,
   schemaWithReduceAccumulator,
+  schemaWithComputedPresentationAttributes,
 } from './jsonLogic.fixtures';
 import { mockConsole, restoreConsoleAndEnsureItWasNotCalled } from './testUtils';
 import { createHeadlessForm } from '@/createHeadlessForm';
@@ -385,6 +386,17 @@ describe('jsonLogic: cross-values validations', () => {
       expect(fieldB.statement).toEqual({ description: 'Must be bigger than 4 and smaller than 8' });
     });
 
+    it('presentation attributes work', () => {
+      const { fields, handleValidation } = createHeadlessForm(
+        schemaWithComputedPresentationAttributes,
+        { strictInputType: false }
+      );
+      const fieldB = fields.find((i) => i.name === 'amount');
+      expect(handleValidation({ currency: 'UGX' }).formErrors).toEqual(undefined);
+      expect(fieldB.inputType).toEqual('money');
+      expect(fieldB.currency).toEqual('UGX');
+    });
+
     it('Use a inline-rule in a schema for a title attribute', () => {
       const { fields, handleValidation } = createHeadlessForm(
         schemaWithInlineRuleForComputedAttributeWithCopy,