@aehrc/smart-forms-renderer 0.3.0 → 0.5.0

package/src/interfaces/variables.interface.ts

@@ -0,0 +1,28 @@
+/*
+ * Copyright 2023 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 type { Expression, FhirResource } from 'fhir/r4';
+
+export interface Variables {
+  fhirPathVariables: Record<string, Expression[]>;
+  xFhirQueryVariables: Record<string, VariableXFhirQuery>;
+}
+
+export interface VariableXFhirQuery {
+  valueExpression: Expression;
+  result?: FhirResource;
+}

package/src/stores/useConfigStore.ts

@@ -0,0 +1,36 @@
+import { create } from 'zustand';
+import type { Encounter, Patient, Practitioner, Questionnaire } from 'fhir/r4';
+import type Client from 'fhirclient/lib/Client';
+
+export interface ConfigState {
+  smartClient: Client | null;
+  patient: Patient | null;
+  user: Practitioner | null;
+  encounter: Encounter | null;
+  launchQuestionnaire: Questionnaire | null;
+  debugMode: boolean;
+  setSmartClient: (client: Client) => void;
+  setPatient: (patient: Patient) => void;
+  setUser: (user: Practitioner) => void;
+  setEncounter: (encounter: Encounter) => void;
+  setLaunchQuestionnaire: (launchQuestionnaire: Questionnaire | null) => void;
+  activateDebugMode: () => void;
+}
+
+const useConfigStore = create<ConfigState>()((set) => ({
+  smartClient: null,
+  patient: null,
+  user: null,
+  encounter: null,
+  launchQuestionnaire: null,
+  debugMode: false,
+  setSmartClient: (client: Client) => set(() => ({ smartClient: client })),
+  setPatient: (patient: Patient) => set(() => ({ patient: patient })),
+  setUser: (user: Practitioner) => set(() => ({ user: user })),
+  setEncounter: (encounter: Encounter) => set(() => ({ encounter: encounter })),
+  setLaunchQuestionnaire: (launchQuestionnaire: Questionnaire | null) =>
+    set(() => ({ launchQuestionnaire: launchQuestionnaire })),
+  activateDebugMode: () => set(() => ({ debugMode: true }))
+}));
+
+export default useConfigStore;

package/src/stores/useQuestionnaireResponseStore.ts

@@ -0,0 +1,58 @@
+import { create } from 'zustand';
+import type { QuestionnaireResponse } from 'fhir/r4';
+import { emptyResponse } from '../utils/emptyResource';
+import cloneDeep from 'lodash.clonedeep';
+
+export interface UseQuestionnaireResponseStoreType {
+  sourceResponse: QuestionnaireResponse;
+  updatableResponse: QuestionnaireResponse;
+  hasChanges: boolean;
+  buildSourceResponse: (response: QuestionnaireResponse) => void;
+  populateResponse: (response: QuestionnaireResponse) => void;
+  updateResponse: (updatedResponse: QuestionnaireResponse) => void;
+  saveResponse: (savedResponse: QuestionnaireResponse) => void;
+  clearResponse: (clearedResponse: QuestionnaireResponse) => void;
+  destroySourceResponse: () => void;
+}
+
+const useQuestionnaireResponseStore = create<UseQuestionnaireResponseStoreType>()((set) => ({
+  sourceResponse: cloneDeep(emptyResponse),
+  updatableResponse: cloneDeep(emptyResponse),
+  hasChanges: false,
+
+  buildSourceResponse: (questionnaireResponse: QuestionnaireResponse) => {
+    set(() => ({
+      sourceResponse: questionnaireResponse,
+      updatableResponse: questionnaireResponse
+    }));
+  },
+  populateResponse: (populatedResponse: QuestionnaireResponse) => {
+    set(() => ({
+      updatableResponse: populatedResponse
+    }));
+  },
+  updateResponse: (updatedResponse: QuestionnaireResponse) =>
+    set(() => ({
+      updatableResponse: updatedResponse,
+      hasChanges: true
+    })),
+  saveResponse: (savedResponse: QuestionnaireResponse) =>
+    set(() => ({
+      sourceResponse: savedResponse,
+      updatableResponse: savedResponse,
+      hasChanges: false
+    })),
+  clearResponse: (clearedResponse: QuestionnaireResponse) =>
+    set(() => ({
+      updatableResponse: clearedResponse,
+      hasChanges: false
+    })),
+  destroySourceResponse: () =>
+    set(() => ({
+      sourceResponse: cloneDeep(emptyResponse),
+      updatableResponse: cloneDeep(emptyResponse),
+      hasChanges: false
+    }))
+}));
+
+export default useQuestionnaireResponseStore;

package/src/stores/useQuestionnaireStore.ts

@@ -0,0 +1,232 @@
+/*
+ * Copyright 2023 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 { create } from 'zustand';
+import type {
+  Coding,
+  Questionnaire,
+  QuestionnaireResponse,
+  QuestionnaireResponseItemAnswer
+} from 'fhir/r4';
+import type { Variables } from '../interfaces/variables.interface';
+import type { LaunchContext } from '../interfaces/populate.interface';
+import type { CalculatedExpression } from '../interfaces/calculatedExpression.interface';
+import type { EnableWhenExpression, EnableWhenItems } from '../interfaces/enableWhen.interface';
+import type { AnswerExpression } from '../interfaces/answerExpression.interface';
+import type { Tabs } from '../interfaces/tab.interface';
+import { updateItemAnswer } from '../utils/enableWhen';
+import { evaluateUpdatedExpressions } from '../utils/fhirpath';
+import {
+  evaluateInitialCalculatedExpressions,
+  initialiseCalculatedExpressionValues
+} from '../utils/calculatedExpression';
+import { createQuestionnaireModel } from '../utils/questionnaireStoreUtils/createQuestionaireModel';
+import { initialiseFormFromResponse } from '../utils/initialiseForm';
+import { emptyQuestionnaire, emptyResponse } from '../utils/emptyResource';
+import cloneDeep from 'lodash.clonedeep';
+
+export interface UseQuestionnaireStoreType {
+  sourceQuestionnaire: Questionnaire;
+  tabs: Tabs;
+  currentTabIndex: number;
+  variables: Variables;
+  launchContexts: Record<string, LaunchContext>;
+  enableWhenItems: EnableWhenItems;
+  enableWhenLinkedQuestions: Record<string, string[]>;
+  enableWhenIsActivated: boolean;
+  enableWhenExpressions: Record<string, EnableWhenExpression>;
+  calculatedExpressions: Record<string, CalculatedExpression>;
+  answerExpressions: Record<string, AnswerExpression>;
+  processedValueSetCodings: Record<string, Coding[]>;
+  processedValueSetUrls: Record<string, string>;
+  cachedValueSetCodings: Record<string, Coding[]>;
+  buildSourceQuestionnaire: (
+    questionnaire: Questionnaire,
+    questionnaireResponse?: QuestionnaireResponse,
+    additionalVariables?: Record<string, object>
+  ) => Promise<void>;
+  destroySourceQuestionnaire: () => void;
+  switchTab: (newTabIndex: number) => void;
+  markTabAsComplete: (tabLinkId: string) => void;
+  updateEnableWhenItem: (linkId: string, newAnswer: QuestionnaireResponseItemAnswer[]) => void;
+  toggleEnableWhenActivation: (isActivated: boolean) => void;
+  updateExpressions: (updatedResponse: QuestionnaireResponse) => void;
+  addCodingToCache: (valueSetUrl: string, codings: Coding[]) => void;
+  updatePopulatedProperties: (populatedResponse: QuestionnaireResponse) => QuestionnaireResponse;
+}
+
+const useQuestionnaireStore = create<UseQuestionnaireStoreType>()((set, get) => ({
+  sourceQuestionnaire: cloneDeep(emptyQuestionnaire),
+  tabs: {},
+  currentTabIndex: 0,
+  variables: { fhirPathVariables: {}, xFhirQueryVariables: {} },
+  launchContexts: {},
+  calculatedExpressions: {},
+  enableWhenExpressions: {},
+  answerExpressions: {},
+  enableWhenItems: {},
+  enableWhenLinkedQuestions: {},
+  enableWhenIsActivated: true,
+  processedValueSetCodings: {},
+  processedValueSetUrls: {},
+  cachedValueSetCodings: {},
+  buildSourceQuestionnaire: async (
+    questionnaire,
+    questionnaireResponse = cloneDeep(emptyResponse),
+    additionalVariables = {}
+  ) => {
+    const questionnaireModel = await createQuestionnaireModel(questionnaire, additionalVariables);
+
+    const {
+      initialEnableWhenItems,
+      initialEnableWhenLinkedQuestions,
+      initialEnableWhenExpressions,
+      initialCalculatedExpressions,
+      firstVisibleTab
+    } = initialiseFormFromResponse({
+      questionnaireResponse,
+      enableWhenItems: questionnaireModel.enableWhenItems,
+      enableWhenExpressions: questionnaireModel.enableWhenExpressions,
+      calculatedExpressions: questionnaireModel.calculatedExpressions,
+      variablesFhirPath: questionnaireModel.variables.fhirPathVariables,
+      tabs: questionnaireModel.tabs
+    });
+
+    set({
+      sourceQuestionnaire: questionnaire,
+      tabs: questionnaireModel.tabs,
+      currentTabIndex: firstVisibleTab,
+      variables: questionnaireModel.variables,
+      launchContexts: questionnaireModel.launchContexts,
+      enableWhenItems: initialEnableWhenItems,
+      enableWhenLinkedQuestions: initialEnableWhenLinkedQuestions,
+      enableWhenExpressions: initialEnableWhenExpressions,
+      calculatedExpressions: initialCalculatedExpressions,
+      answerExpressions: questionnaireModel.answerExpressions,
+      processedValueSetCodings: questionnaireModel.processedValueSetCodings,
+      processedValueSetUrls: questionnaireModel.processedValueSetUrls
+    });
+  },
+  destroySourceQuestionnaire: () =>
+    set({
+      sourceQuestionnaire: cloneDeep(emptyQuestionnaire),
+      tabs: {},
+      currentTabIndex: 0,
+      variables: { fhirPathVariables: {}, xFhirQueryVariables: {} },
+      launchContexts: {},
+      enableWhenItems: {},
+      enableWhenLinkedQuestions: {},
+      enableWhenExpressions: {},
+      calculatedExpressions: {},
+      answerExpressions: {},
+      processedValueSetCodings: {},
+      processedValueSetUrls: {}
+    }),
+  switchTab: (newTabIndex: number) => set(() => ({ currentTabIndex: newTabIndex })),
+  markTabAsComplete: (tabLinkId: string) => {
+    const tabs = get().tabs;
+    set(() => ({
+      tabs: {
+        ...tabs,
+        [tabLinkId]: { ...tabs[tabLinkId], isComplete: !tabs[tabLinkId].isComplete }
+      }
+    }));
+  },
+  updateEnableWhenItem: (linkId: string, newAnswer: QuestionnaireResponseItemAnswer[]) => {
+    const enableWhenLinkedQuestions = get().enableWhenLinkedQuestions;
+    const enableWhenItems = get().enableWhenItems;
+    if (!enableWhenLinkedQuestions[linkId]) {
+      return;
+    }
+
+    const itemLinkedQuestions = enableWhenLinkedQuestions[linkId];
+    const updatedEnableWhenItems = updateItemAnswer(
+      { ...enableWhenItems },
+      itemLinkedQuestions,
+      linkId,
+      newAnswer
+    );
+
+    set(() => ({
+      enableWhenItems: updatedEnableWhenItems
+    }));
+  },
+  toggleEnableWhenActivation: (isActivated: boolean) =>
+    set(() => ({ enableWhenIsActivated: isActivated })),
+  updateExpressions: (updatedResponse: QuestionnaireResponse) => {
+    const { isUpdated, updatedCalculatedExpressions, updatedEnableWhenExpressions } =
+      evaluateUpdatedExpressions({
+        updatedResponse: updatedResponse,
+        enableWhenExpressions: get().enableWhenExpressions,
+        calculatedExpressions: get().calculatedExpressions,
+        variablesFhirPath: get().variables.fhirPathVariables
+      });
+
+    if (isUpdated) {
+      set(() => ({
+        enableWhenExpressions: updatedEnableWhenExpressions,
+        calculatedExpressions: updatedCalculatedExpressions
+      }));
+    }
+  },
+  addCodingToCache: (valueSetUrl: string, codings: Coding[]) =>
+    set(() => ({
+      cachedValueSetCodings: {
+        ...get().cachedValueSetCodings,
+        [valueSetUrl]: codings
+      }
+    })),
+  updatePopulatedProperties: (populatedResponse: QuestionnaireResponse) => {
+    const initialCalculatedExpressions = evaluateInitialCalculatedExpressions({
+      initialResponse: populatedResponse,
+      calculatedExpressions: get().calculatedExpressions,
+      variablesFhirPath: get().variables.fhirPathVariables
+    });
+
+    const updatedResponse = initialiseCalculatedExpressionValues(
+      get().sourceQuestionnaire,
+      populatedResponse,
+      initialCalculatedExpressions
+    );
+
+    const {
+      initialEnableWhenItems,
+      initialEnableWhenLinkedQuestions,
+      initialEnableWhenExpressions,
+      firstVisibleTab
+    } = initialiseFormFromResponse({
+      questionnaireResponse: updatedResponse,
+      enableWhenItems: get().enableWhenItems,
+      enableWhenExpressions: get().enableWhenExpressions,
+      calculatedExpressions: initialCalculatedExpressions,
+      variablesFhirPath: get().variables.fhirPathVariables,
+      tabs: get().tabs
+    });
+
+    set(() => ({
+      enableWhenItems: initialEnableWhenItems,
+      enableWhenLinkedQuestions: initialEnableWhenLinkedQuestions,
+      enableWhenExpressions: initialEnableWhenExpressions,
+      calculatedExpressions: initialCalculatedExpressions,
+      currentTabIndex: firstVisibleTab
+    }));
+
+    return updatedResponse;
+  }
+}));
+
+export default useQuestionnaireStore;

package/src/stories/SmartFormsRenderer.stories.ts

@@ -0,0 +1,104 @@
+/*
+ * Copyright 2023 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 type { Meta, StoryObj } from '@storybook/react';
+import { SmartFormsRenderer } from '../components';
+import type { Questionnaire, QuestionnaireResponse } from 'fhir/r4';
+import Q715Json from './assets/Q715.json';
+import R715Json from './assets/R715.json';
+import QTestGridJson from './assets/QTestGrid.json';
+import RTestGridJson from './assets/RTestGrid.json';
+
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+const meta = {
+  title: 'Component/SmartFormsRenderer',
+  component: SmartFormsRenderer,
+  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+  tags: ['autodocs']
+} satisfies Meta<typeof SmartFormsRenderer>;
+
+const Q715 = Q715Json as Questionnaire;
+const R715 = R715Json as QuestionnaireResponse;
+const QTestGrid = QTestGridJson as Questionnaire;
+const RTestGrid = RTestGridJson as QuestionnaireResponse;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args
+
+export const Form715: Story = {
+  args: {
+    questionnaire: Q715
+  }
+};
+
+export const Form715WithResponse: Story = {
+  args: {
+    questionnaire: Q715,
+    questionnaireResponse: R715
+  }
+};
+
+export const FormTestGrid: Story = {
+  args: {
+    questionnaire: QTestGrid
+  }
+};
+
+export const FormTestGridWithResponse: Story = {
+  args: {
+    questionnaire: QTestGrid,
+    questionnaireResponse: RTestGrid,
+    additionalVariables: {}
+  }
+};
+
+export const QTestGridWithResponseAddFhirPath: Story = {
+  args: {
+    questionnaire: QTestGrid,
+    questionnaireResponse: RTestGrid,
+    additionalVariables: {
+      addVar1: {
+        url: 'http://hl7.org/fhir/StructureDefinition/variable',
+        valueExpression: {
+          name: 'addVar1',
+          language: 'text/fhirpath',
+          expression:
+            "%resource.item.where(linkId='grid').item.where(linkId='1').item.where(linkId='1.1').item.where(linkId='1.1.1').answer.value"
+        }
+      }
+    }
+  }
+};
+
+// export const QTestGridWithResponseAddXFhirQuery: Story = {
+//   args: {
+//     questionnaire: QTestGrid,
+//     questionnaireResponse: RTestGrid,
+//     additionalVariables: {
+//       addVar2: {
+//         url: 'http://hl7.org/fhir/StructureDefinition/variable',
+//         valueExpression: {
+//           name: 'addVar2',
+//           language: 'application/x-fhir-query',
+//           expression: 'Condition?patient={{%patient.id}}'
+//         }
+//       }
+//     }
+//   }
+// };