@aehrc/smart-forms-renderer 0.37.2 → 0.38.2

package/src/hooks/useQuantityCalculatedExpression.ts

@@ -0,0 +1,177 @@
+/*
+ * Copyright 2024 Commonwealth Scientific and Industrial Research
+ * Organisation (CSIRO) ABN 41 687 119 230.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { useEffect, useState } from 'react';
+import type { QuestionnaireItem } from 'fhir/r4';
+import { useQuestionnaireStore } from '../stores';
+import { validateCodePromise } from '../utils/valueSet';
+import { TERMINOLOGY_SERVER_URL } from '../globals';
+import type {
+  CodeParameter,
+  DisplayParameter,
+  SystemParameter
+} from '../interfaces/valueSet.interface';
+
+interface UseQuantityCalculatedExpression {
+  calcExpUpdated: boolean;
+}
+
+interface UseQuantityCalculatedExpressionProps {
+  qItem: QuestionnaireItem;
+  inputValue: string;
+  precision: number | null;
+  onChangeByCalcExpressionDecimal: (newValue: number) => void;
+  onChangeByCalcExpressionQuantity: (
+    newValue: number,
+    newUnitSystem: string,
+    newUnitCode: string,
+    newUnitDisplay: string
+  ) => void;
+  onChangeByCalcExpressionNull: () => void;
+}
+
+function useQuantityCalculatedExpression(
+  props: UseQuantityCalculatedExpressionProps
+): UseQuantityCalculatedExpression {
+  const {
+    qItem,
+    inputValue,
+    precision,
+    onChangeByCalcExpressionDecimal,
+    onChangeByCalcExpressionQuantity,
+    onChangeByCalcExpressionNull
+  } = props;
+
+  const calculatedExpressions = useQuestionnaireStore.use.calculatedExpressions();
+
+  const [calcExpUpdated, setCalcExpUpdated] = useState(false);
+
+  useEffect(
+    () => {
+      const calcExpression = calculatedExpressions[qItem.linkId]?.find(
+        (exp) => exp.from === 'item'
+      );
+
+      if (!calcExpression) {
+        return;
+      }
+
+      // only update if calculated value is different from current value
+      if (
+        calcExpression.value !== inputValue &&
+        (typeof calcExpression.value === 'number' ||
+          typeof calcExpression.value === 'string' ||
+          calcExpression.value === null)
+      ) {
+        // Null path
+        if (calcExpression.value === null) {
+          onChangeByCalcExpressionNull();
+          return;
+        }
+
+        // Number path
+        if (typeof calcExpression.value === 'number') {
+          const calcExpressionValue =
+            typeof precision === 'number'
+              ? parseFloat(calcExpression.value.toFixed(precision))
+              : calcExpression.value;
+
+          // only update if calculated value is different from current value
+          if (calcExpressionValue !== parseFloat(inputValue)) {
+            // update ui to show calculated value changes
+            setCalcExpUpdated(true);
+            setTimeout(() => {
+              setCalcExpUpdated(false);
+            }, 500);
+
+            // calculatedExpression value is null
+            if (calcExpressionValue === null) {
+              onChangeByCalcExpressionNull();
+              return;
+            }
+
+            // calculatedExpression value is a number
+            onChangeByCalcExpressionDecimal(calcExpressionValue);
+          }
+        }
+
+        // String path (quantity)
+        if (typeof calcExpression.value === 'string') {
+          try {
+            const [value, unitCode] = calcExpression.value.split(' ');
+            const unitCodeFormatted = unitCode.replace(/'/g, '');
+
+            const ucumValueSet = 'http://hl7.org/fhir/ValueSet/ucum-units';
+            const ucumSystem = 'http://unitsofmeasure.org';
+
+            validateCodePromise(
+              ucumValueSet,
+              ucumSystem,
+              unitCodeFormatted,
+              TERMINOLOGY_SERVER_URL
+            ).then((validateCodeResponse) => {
+              // Return early if validate-code request fails
+              if (!validateCodeResponse) {
+                onChangeByCalcExpressionNull();
+                return;
+              }
+
+              if (validateCodeResponse.parameter) {
+                const systemParameter = validateCodeResponse.parameter.find(
+                  (p) => p.name === 'system'
+                ) as SystemParameter;
+                const codeParameter = validateCodeResponse.parameter.find(
+                  (p) => p.name === 'code'
+                ) as CodeParameter;
+                const displayParameter = validateCodeResponse.parameter.find(
+                  (p) => p.name === 'display'
+                ) as DisplayParameter;
+                if (
+                  systemParameter.valueUri &&
+                  codeParameter.valueCode &&
+                  displayParameter.valueString
+                ) {
+                  // update ui to show calculated value changes
+                  setCalcExpUpdated(true);
+                  setTimeout(() => {
+                    setCalcExpUpdated(false);
+                  }, 500);
+                  onChangeByCalcExpressionQuantity(
+                    parseFloat(value),
+                    systemParameter.valueUri,
+                    codeParameter.valueCode,
+                    displayParameter.valueString
+                  );
+                }
+              }
+            });
+          } catch (e) {
+            console.error(e);
+            onChangeByCalcExpressionNull();
+          }
+        }
+      }
+    },
+    // Only trigger this effect if calculatedExpression of item changes
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [calculatedExpressions]
+  );
+
+  return { calcExpUpdated: calcExpUpdated };
+}
+
+export default useQuantityCalculatedExpression;

package/src/hooks/useRenderingExtensions.ts

@@ -16,12 +16,13 @@
  */
 
 import {
+  getQuantityUnit,
   getTextDisplayFlyover,
   getTextDisplayInstructions,
   getTextDisplayPrompt,
   getTextDisplayUnit
 } from '../utils/itemControl';
-import type { QuestionnaireItem } from 'fhir/r4';
+import type { QuestionnaireItem, QuestionnaireItemAnswerOption } from 'fhir/r4';
 import { structuredDataCapture } from 'fhir-sdc-helpers';
 import { useMemo } from 'react';
 
@@ -33,6 +34,7 @@ interface RenderingExtensions {
   readOnly: boolean;
   entryFormat: string;
   required: boolean;
+  quantityUnit: QuestionnaireItemAnswerOption | null;
 }
 
 function useRenderingExtensions(qItem: QuestionnaireItem): RenderingExtensions {
@@ -44,7 +46,8 @@ function useRenderingExtensions(qItem: QuestionnaireItem): RenderingExtensions {
       displayFlyover: getTextDisplayFlyover(qItem),
       readOnly: !!qItem.readOnly,
       entryFormat: structuredDataCapture.getEntryFormat(qItem) ?? '',
-      required: qItem.required ?? false
+      required: qItem.required ?? false,
+      quantityUnit: getQuantityUnit(qItem)
     }),
     [qItem]
   );

package/src/hooks/useStringInput.ts

@@ -18,6 +18,7 @@
 import type { Dispatch, SetStateAction } from 'react';
 import { useEffect, useState } from 'react';
 
+// The purpose of this hook to sync the string state from external changes i.e. re-population changes etc.
 function useStringInput(valueFromProps: string): [string, Dispatch<SetStateAction<string>>] {
   const [input, setInput] = useState(valueFromProps);
 

package/src/interfaces/valueSet.interface.ts

@@ -21,3 +21,22 @@ export interface ValueSetPromise {
   promise: Promise<ValueSet>;
   valueSet?: ValueSet;
 }
+
+export interface ValidateCodeResponse extends Parameters<any> {
+  parameter: [SystemParameter, CodeParameter, DisplayParameter];
+}
+
+export interface SystemParameter {
+  name: 'system';
+  valueUri: string;
+}
+
+export interface CodeParameter {
+  name: 'code';
+  valueCode: string;
+}
+
+export interface DisplayParameter {
+  name: 'display';
+  valueString: string;
+}

package/src/stories/assets/questionnaires/QPrePopTester.ts

@@ -184,6 +184,14 @@ export const qSelectivePrePopTester: Questionnaire = {
         }
       ]
     },
+    {
+      url: 'http://hl7.org/fhir/StructureDefinition/variable',
+      valueExpression: {
+        name: 'ObsBloodPressure',
+        language: 'application/x-fhir-query',
+        expression: 'Observation?code=75367002&_count=1&_sort=-date&patient={{%patient.id}}'
+      }
+    },
     {
       url: 'http://hl7.org/fhir/StructureDefinition/variable',
       valueExpression: {
@@ -424,6 +432,28 @@ export const qSelectivePrePopTester: Questionnaire = {
             }
           ]
         },
+        {
+          linkId: 'blood-pressure-unit-fixed',
+          text: 'Blood Pressure',
+          type: 'quantity',
+          extension: [
+            {
+              url: 'http://hl7.org/fhir/uv/sdc/StructureDefinition/sdc-questionnaire-initialExpression',
+              valueExpression: {
+                language: 'text/fhirpath',
+                expression: '%ObsBloodPressure.entry[0].resource.component[0].value'
+              }
+            },
+            {
+              url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit',
+              valueCoding: {
+                system: 'http://unitsofmeasure.org',
+                code: 'mm[Hg]',
+                display: 'mmHg'
+              }
+            }
+          ]
+        },
         {
           extension: [
             {

package/src/stories/assets/questionnaires/QQuantity.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import type { Questionnaire } from 'fhir/r4';
+import type { Questionnaire, QuestionnaireResponse } from 'fhir/r4';
 
 export const qQuantityBasic: Questionnaire = {
   resourceType: 'Questionnaire',
@@ -39,6 +39,288 @@ export const qQuantityBasic: Questionnaire = {
       type: 'quantity',
       repeats: false,
       text: 'Body Weight'
+    },
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit',
+          valueCoding: { system: 'http://unitsofmeasure.org', code: 'kg', display: 'kg' }
+        }
+      ],
+      linkId: 'body-weight-comparator',
+      type: 'quantity',
+      repeats: false,
+      text: 'Body Weight (with comparator symbol)'
+    }
+  ]
+};
+
+export const qrQuantityBasicResponse: QuestionnaireResponse = {
+  resourceType: 'QuestionnaireResponse',
+  status: 'in-progress',
+  item: [
+    {
+      linkId: 'body-weight',
+      answer: [
+        {
+          valueQuantity: {
+            value: 80,
+            unit: 'kg',
+            system: 'http://unitsofmeasure.org',
+            code: 'kg'
+          }
+        }
+      ],
+      text: 'Body Weight'
+    },
+    {
+      linkId: 'body-weight-comparator',
+      answer: [
+        {
+          valueQuantity: {
+            value: 90,
+            comparator: '<',
+            unit: 'kg',
+            system: 'http://unitsofmeasure.org',
+            code: 'kg'
+          }
+        }
+      ],
+      text: 'Body Weight (with comparator symbol)'
+    }
+  ],
+  questionnaire: 'https://smartforms.csiro.au/docs/components/quantity/basic'
+};
+
+export const qQuantityUnitOption: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'QuantityUnitOption',
+  name: 'QuantityUnitOption',
+  title: 'Quantity UnitOption',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-07-27',
+  url: 'https://smartforms.csiro.au/docs/components/quantity/unit-option',
+  item: [
+    {
+      linkId: 'duration',
+      text: 'Duration',
+      type: 'quantity',
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'd',
+            display: 'Day(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'wk',
+            display: 'Week(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'mo',
+            display: 'Month(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'a',
+            display: 'Year(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 's',
+            display: 'Second(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'min',
+            display: 'Minute(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'hour',
+            display: 'Hour(s)'
+          }
+        }
+      ]
+    },
+    {
+      linkId: 'duration-comparator',
+      text: 'Duration (with comparator symbol)',
+      type: 'quantity',
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'd',
+            display: 'Day(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'wk',
+            display: 'Week(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'mo',
+            display: 'Month(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'a',
+            display: 'Year(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 's',
+            display: 'Second(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'min',
+            display: 'Minute(s)'
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unitOption',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'hour',
+            display: 'Hour(s)'
+          }
+        }
+      ]
+    }
+  ]
+};
+
+export const qrQuantityUnitOptionResponse: QuestionnaireResponse = {
+  resourceType: 'QuestionnaireResponse',
+  status: 'in-progress',
+  item: [
+    {
+      linkId: 'duration',
+      answer: [
+        {
+          valueQuantity: {
+            value: 48,
+            unit: 'Hour(s)',
+            system: 'http://unitsofmeasure.org',
+            code: 'hour'
+          }
+        }
+      ],
+      text: 'Duration'
+    },
+    {
+      linkId: 'duration-comparator',
+      answer: [
+        {
+          valueQuantity: {
+            value: 48,
+            comparator: '>=',
+            unit: 'Hour(s)',
+            system: 'http://unitsofmeasure.org',
+            code: 'hour'
+          }
+        }
+      ],
+      text: 'Duration'
+    }
+  ],
+  questionnaire: 'https://smartforms.csiro.au/docs/components/quantity/unit-option'
+};
+
+export const qQuantityCalculation: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'QuantityCalculation',
+  name: 'QuantityCalculation',
+  title: 'Quantity Calculation',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-01',
+  url: 'https://smartforms.csiro.au/docs/components/quantity/calculation',
+  extension: [
+    {
+      url: 'http://hl7.org/fhir/StructureDefinition/variable',
+      valueExpression: {
+        name: 'durationInDays',
+        language: 'text/fhirpath',
+        expression: "item.where(linkId='duration-in-days').answer.value"
+      }
+    }
+  ],
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit',
+          valueCoding: { system: 'http://unitsofmeasure.org', code: 'd', display: 'days' }
+        }
+      ],
+      linkId: 'duration-in-days',
+      type: 'quantity',
+      repeats: false,
+      text: 'Duration in Days'
+    },
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit',
+          valueCoding: { system: 'http://unitsofmeasure.org', code: 'h', display: 'hours' }
+        },
+        {
+          url: 'http://hl7.org/fhir/uv/sdc/StructureDefinition/sdc-questionnaire-calculatedExpression',
+          valueExpression: {
+            description: 'Duration In Hours',
+            language: 'text/fhirpath',
+            expression: '%durationInDays.value * 24'
+          }
+        }
+      ],
+      linkId: 'duration-in-hours',
+      type: 'quantity',
+      repeats: false,
+      text: 'Duration in Hours'
     }
   ]
 };

package/src/stories/itemTypes/Quantity.stories.tsx

@@ -17,7 +17,13 @@
 
 import type { Meta, StoryObj } from '@storybook/react';
 import BuildFormWrapperForStorybook from '../storybookWrappers/BuildFormWrapperForStorybook';
-import { qQuantityBasic } from '../assets/questionnaires';
+import {
+  qQuantityBasic,
+  qQuantityCalculation,
+  qQuantityUnitOption,
+  qrQuantityBasicResponse,
+  qrQuantityUnitOptionResponse
+} from '../assets/questionnaires';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {
@@ -37,3 +43,29 @@ export const QuantityBasic: Story = {
     questionnaire: qQuantityBasic
   }
 };
+
+export const QuantityBasicResponse: Story = {
+  args: {
+    questionnaire: qQuantityBasic,
+    questionnaireResponse: qrQuantityBasicResponse
+  }
+};
+
+export const QuantityUnitOption: Story = {
+  args: {
+    questionnaire: qQuantityUnitOption
+  }
+};
+
+export const QuantityUnitOptionResponse: Story = {
+  args: {
+    questionnaire: qQuantityUnitOption,
+    questionnaireResponse: qrQuantityUnitOptionResponse
+  }
+};
+
+export const QuantityCalculation: Story = {
+  args: {
+    questionnaire: qQuantityCalculation
+  }
+};

package/src/utils/calculatedExpression.ts

@@ -323,7 +323,11 @@ function parseValueToAnswer(qItem: QuestionnaireItem, value: any): Questionnaire
     }
   }
 
-  if (typeof value === 'object') {
+  if (typeof value === 'object' && value.unit) {
+    return { valueQuantity: value };
+  }
+
+  if (typeof value === 'object' && value.system && value.code) {
     return { valueCoding: value };
   }
 

package/src/utils/itemControl.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import type { Coding, Extension, QuestionnaireItem } from 'fhir/r4';
+import type { Coding, Extension, QuestionnaireItem, QuestionnaireItemAnswerOption } from 'fhir/r4';
 import type { RegexValidation } from '../interfaces/regex.interface';
 import { structuredDataCapture } from 'fhir-sdc-helpers';
 
@@ -234,6 +234,24 @@ export function getTextDisplayPrompt(qItem: QuestionnaireItem): string {
   return '';
 }
 
+/**
+ * Get Quantity unit for items with itemControlCode unit and has a unit childItem
+ *
+ * @author Sean Fong
+ */
+export function getQuantityUnit(qItem: QuestionnaireItem): QuestionnaireItemAnswerOption | null {
+  // Otherwise, check if the item has a unit extension
+  const itemControl = qItem.extension?.find(
+    (extension: Extension) =>
+      extension.url === 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit'
+  );
+  if (itemControl && itemControl.valueCoding) {
+    return itemControl;
+  }
+
+  return null;
+}
+
 /**
  * Get decimal text display unit for items with itemControlCode unit and has a unit childItem
  *