Merge pull request #1196 from navikt/bugfix/calculate-value-number

Fix problem with calculateValue and number
navikt · Jun 5, 2024 · af7bace · af7bace
2 parents 73774aa + a39408c
commit af7bace
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 6 deletions.
diff --git a/packages/fyllut/cypress/e2e/components/checkbox.cy.ts b/packages/fyllut/cypress/e2e/components/checkbox.cy.ts
@@ -122,10 +122,10 @@ describe('Checkbox', () => {
 
       cy.findByRole('checkbox', { name: 'Normal checkbox (valgfritt)' }).should('be.checked');
       cy.findByRole('checkbox', { name: 'Required checkbox' }).should('be.checked');
-      cy.findByRole('checkbox', { name: 'ReadOnly checkbox checked (valgfritt)' }).should('be.checked');
+      cy.findByRole('checkbox', { name: 'ReadOnly checkbox checked' }).should('be.checked');
       cy.findByRole('checkbox', { name: 'Checkbox description (valgfritt)' }).should('be.checked');
 
-      cy.findByRole('checkbox', { name: 'ReadOnly checkbox (valgfritt)' }).should('not.be.checked');
+      cy.findByRole('checkbox', { name: 'ReadOnly checkbox' }).should('not.be.checked');
     });
   });
 });
diff --git a/packages/shared-components/src/formio/components/base/BaseComponent.tsx b/packages/shared-components/src/formio/components/base/BaseComponent.tsx
@@ -50,7 +50,7 @@ class BaseComponent extends FormioReactComponent {
     return (
       <>
         {this.t(this.component?.label ?? '')}
-        {this.isRequired() && !this.component?.readOnly ? '' : showOptional && ` (${this.t('valgfritt')})`}
+        {this.isRequired() || !!this.component?.readOnly ? '' : showOptional && ` (${this.t('valgfritt')})`}
         {showDiffTag && this.getDiffTag()}
       </>
     );

diff --git a/packages/shared-components/src/formio/components/extensions/currency/Currency.form.ts b/packages/shared-components/src/formio/components/extensions/currency/Currency.form.ts
@@ -1,11 +1,12 @@
 import editFormApi from '../../base/editForm/api';
 import editFormConditional from '../../base/editForm/conditional';
+import editFormData from '../../base/editForm/data';
 import editFormDisplay from '../../base/editForm/display';
 import editFormTabs from '../../base/editForm/editFormTabs';
 import editFormValidation from '../../base/editForm/validation';
 
 const currencyForm = () => {
-  const { api, conditional, createTabs, display, validation } = editFormTabs;
+  const { api, conditional, createTabs, display, validation, data } = editFormTabs;
 
   // prettier-ignore
   return createTabs(
@@ -16,6 +17,9 @@ const currencyForm = () => {
       editFormDisplay.description(),
       editFormDisplay.additionalDescription(),
     ]),
+    data([
+      editFormData.calculateValue(),
+    ]),
     validation([
       editFormValidation.required(),
       editFormValidation.customValidation(),

diff --git a/packages/shared-components/src/formio/components/extensions/number/Number.form.ts b/packages/shared-components/src/formio/components/extensions/number/Number.form.ts
@@ -1,11 +1,12 @@
 import editFormApi from '../../base/editForm/api';
 import editFormConditional from '../../base/editForm/conditional';
+import editFormData from '../../base/editForm/data';
 import editFormDisplay from '../../base/editForm/display';
 import editFormTabs from '../../base/editForm/editFormTabs';
 import editFormValidation from '../../base/editForm/validation';
 
 const numberForm = () => {
-  const { api, conditional, createTabs, display, validation } = editFormTabs;
+  const { api, conditional, createTabs, display, validation, data } = editFormTabs;
 
   // prettier-ignore
   return createTabs(
@@ -16,6 +17,9 @@ const numberForm = () => {
       editFormDisplay.description(),
       editFormDisplay.additionalDescription(),
     ]),
+    data([
+      editFormData.calculateValue(),
+    ]),
     validation([
       editFormValidation.required(),
       editFormValidation.minNumber(),

diff --git a/packages/shared-components/src/formio/components/extensions/number/Number.ts b/packages/shared-components/src/formio/components/extensions/number/Number.ts
@@ -52,7 +52,7 @@ class Number extends TextField {
     // Get data value from parent instead of formatted number from this.getValue()
     const value = super.getValue();
 
-    if (value === '' || value === undefined) {
+    if (value === '' || value === undefined || !!this.component?.calculateValue) {
       return;
     }
 
@@ -94,6 +94,11 @@ class Number extends TextField {
     return numberUtils.toLocaleString(super.getValue());
   }
 
+  setValueOnReactInstance(value) {
+    // This is needed to handle formatting after calculate value
+    super.setValueOnReactInstance(numberUtils.toLocaleString(value));
+  }
+
   replaceCommasAndSpaces(value: string) {
     return value?.replace(/,/g, '.').replace(/\s/g, '');
   }