Merging main into health-checks-pilot

.github/workflows/build_test_lint.yml

@@ -4,7 +4,7 @@ on:
   push:
 
 jobs:
-  build:
+  build-smart-forms-app:
     name: Build
     runs-on: ubuntu-latest
     steps:
@@ -19,6 +19,21 @@ jobs:
       - name: Build application
         run: npm run build -w apps/smart-forms-app
 
+  build-demo-app:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Use Node.js 16.x
+        uses: actions/setup-node@v4
+        with:
+          node-version: 16
+          cache: npm
+      - name: Install dependencies
+        run: npm ci
+      - name: Build application
+        run: cd apps/demo-renderer-app && npm run build
+
   jest-test:
     name: Jest Tests
     runs-on: ubuntu-latest

.gitignore

@@ -1,2 +1,3 @@
 node_modules
-coverage
+coverage
+changelog_guide.md

Conformance.md

@@ -142,7 +142,7 @@ View the source here: http://hl7.org/fhir/uv/sdc/behavior.html
 - [ ] minOccurs
 - [ ] maxOccurs
 - [ ] optionExclusive
-- [ ] unitOption
+- [x] unitOption
 - [ ] unitValueSet
 - [ ] unitOpen
 - [ ] unitSupplementalSystem

README.md

@@ -10,7 +10,6 @@ Powered by SMART on FHIR and Structured Data Capture, Smart Forms allow you to e
 <h4><a href="https://smartforms.csiro.au">Show me the app ➡️</a></h4>
 
 <h4><a href="https://smartforms.csiro.au/docs">Check out the documentation 📚</a></h4>
-Update 11/07/2024: The documentation link isn't working. It is currently being fixed. 
 
 ---
 Smart Forms is a Typescript-based [React](https://reactjs.org/) forms web application currently ongoing development by [CSIRO's Australian e-Health Research Centre](https://aehrc.csiro.au/) as part of the Primary Care Data Quality project funded by the Australian Government Department of Health.

apps/demo-renderer-app/package.json

@@ -11,8 +11,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@aehrc/sdc-populate": "^1.8.0",
-    "@aehrc/smart-forms-renderer": "file:../../packages/smart-forms-renderer",
+    "@aehrc/sdc-populate": "^2.3.1",
+    "@aehrc/smart-forms-renderer": "^0.39.0",
     "@tanstack/react-query": "^4.36.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

apps/demo-renderer-app/src/utils/populate.ts

@@ -37,12 +37,6 @@
 import { fetchResourceCallback } from './populateCallback';
 import { createPopulateInputParameters } from './populateInputParams';
 
-export const REQUEST_CONFIG: RequestConfig = {
-  clientEndpoint: 'https://gw.interop.community/AuConNov23/data',
-  authToken:
-    'eyJqa3UiOiJodHRwczpcL1wvaW9sMmF1dGguaW50ZXJvcC5jb21tdW5pdHlqd2siLCJraWQiOiJyc2ExIiwidHlwIjoiSldUIiwiYWxnIjoiUlMyNTYifQ.eyJhdWQiOiJhN2RkNDJlZi05ZDdjLTRhOWItOTgyZi0xZjRmZjBlNDI5OGUiLCJpc3MiOiJodHRwczpcL1wvaW9sMmF1dGguaW50ZXJvcC5jb21tdW5pdHkiLCJleHAiOjE3MDA0NTAyNDcsImlhdCI6MTcwMDQ0NjY0NywianRpIjoiYTE0ZmM0MzktZGUzNC00MzQwLTlkNGYtYmIwZDY3Y2ZjM2NhIn0.PQ2T8GQCyQkwAI0UTXZ9AEJF1KcK8H0CGePLj7XLg-jqn381-9j8OyOR5cjEh2EpzhdfeDQX2KCjvq4wd3PkPmkQYfPXBj84odtNHSuubtHlA_TnDK2fyhoDOn_CwYOIPJrFNZ2frvDlkdFs5s--dlPGGoAQoy3Szbf09PzbiiThf3Y3YmRGcb1JR1n4RwhwW6d7lhMEhbaqEqzsfig75TFhFw2wmJGXqIZMz0L2TTel9iYT9zeEyBmmmZpdoCTwgD2raC2nPpxU-OjslA50r_OvjfDpVhIAC40E5-ol_xAL7QhFioudsUQaQXGXWgcDs2lTqrNA-HPoxxrj1ZD9GQ'
-};
-
 export interface PopulateResult {
   populated: QuestionnaireResponse;
   hasWarnings: boolean;
@@ -57,7 +51,7 @@
   populateSuccess: boolean;
   populateResult: PopulateResult | null;
 }> {
   const fhirPathContext: Record<string, any> = {};
 
   // Get launch contexts, source queries and questionnaire-level variables
   const launchContexts = getLaunchContexts(questionnaire);
@@ -194,7 +188,7 @@
   }
 }
 
 async function addTimeoutToPromise(promise: Promise<any>, timeoutMs: number) {
   const timeoutPromise = new Promise((_, reject) => {
     setTimeout(() => {
       reject(new Error(`Promise timed out after ${timeoutMs} milliseconds`));

apps/demo-renderer-app/vite.config.ts

@@ -11,5 +11,6 @@ export default defineConfig({
     commonjsOptions: {
       include: [/node_modules/, '@aehrc/sdc-populate']
     }
-  }
+  },
+  resolve: { preserveSymlinks: true }
 });

apps/smart-forms-app/e2e/dashboard.spec.ts

@@ -33,6 +33,8 @@ test.beforeEach(async ({ page }) => {
   const fetchQRPromise = page.waitForResponse(
     new RegExp(/^https:\/\/proxy\.smartforms\.io\/v\/r4\/fhir\/QuestionnaireResponse\?.+$/)
   );
+  await page.getByTestId('dashboard-table-pagination').locator('div').getByRole('combobox').click();
+  await page.getByRole('option', { name: '50' }).click();
   await page.getByTestId('questionnaire-list-row').getByText(questionnaireTitle).first().click();
   const fetchQRResponse = await fetchQRPromise;
   expect(fetchQRResponse.status()).toBe(200);

apps/smart-forms-app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aehrc/smart-forms-app",
   "private": true,
-  "version": "0.2.0",
+  "version": "1.0.0",
   "type": "module",
   "description": "Typescript-based React web application implementing FHIR Structured Data Captured (SDC) specification",
   "scripts": {
@@ -27,23 +27,23 @@
   "homepage": "https://github.com/aehrc/smart-forms#readme",
   "dependencies": {
     "@aehrc/sdc-assemble": "^1.3.1",
-    "@aehrc/sdc-populate": "^2.2.7",
-    "@aehrc/smart-forms-renderer": "^0.35.9",
-    "@emotion/react": "^11.11.4",
+    "@aehrc/sdc-populate": "^2.3.1",
+    "@aehrc/smart-forms-renderer": "^0.39.0",
+    "@emotion/react": "^11.13.0",
     "@emotion/styled": "^11.11.5",
     "@fontsource/material-icons": "^5.0.18",
     "@fontsource/roboto": "^5.0.12",
     "@iconify/react": "^4.1.1",
-    "@microlink/react-json-view": "^1.23.0",
+    "@microlink/react-json-view": "^1.23.1",
     "@monaco-editor/react": "^4.6.0",
     "@mui/icons-material": "^5.15.20",
     "@mui/lab": "^5.0.0-alpha.151",
-    "@mui/material": "^5.15.20",
+    "@mui/material": "^5.16.7",
     "@mui/x-date-pickers": "^6.10.1",
     "@sentry/react": "^7.73.0",
     "@sentry/tracing": "^7.101.0",
     "@tanstack/react-query": "^4.36.1",
-    "@tanstack/react-table": "^8.10.7",
+    "@tanstack/react-table": "^8.19.3",
     "allotment": "^1.20.2",
     "dayjs": "^1.11.10",
     "fhirclient": "^2.5.2",
@@ -73,19 +73,19 @@
     "react-to-print": "^2.14.15",
     "simplebar-react": "^3.2.4",
     "usehooks-ts": "^2.9.1",
-    "zustand": "^4.5.2"
+    "zustand": "^4.5.5"
   },
   "devDependencies": {
     "@jest/globals": "^29.5.0",
     "@playwright/test": "^1.44.1",
-    "@sentry/cli": "^2.32.1",
+    "@sentry/cli": "^2.34.1",
     "@storybook/addon-essentials": "^8.0.6",
     "@storybook/addon-interactions": "^7.4.6",
     "@storybook/addon-links": "^8.0.3",
     "@storybook/addon-onboarding": "^8.0.0",
     "@storybook/addon-styling": "^1.3.7",
     "@storybook/blocks": "^7.5.2",
-    "@storybook/react": "^8.0.9",
+    "@storybook/react": "^8.2.6",
     "@storybook/react-vite": "^7.4.5",
     "@storybook/testing-library": "^0.2.1",
     "@tanstack/react-query-devtools": "^4.35.3",
@@ -96,7 +96,7 @@
     "@types/lodash.debounce": "^4.0.7",
     "@types/lodash.filter": "^4.6.7",
     "@types/lodash.isequal": "^4.5.8",
-    "@types/node": "^20.14.2",
+    "@types/node": "^22.5.0",
     "@types/randomcolor": "^0.5.9",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.22",
@@ -106,7 +106,7 @@
     "@vitejs/plugin-react": "^4.0.4",
     "eslint": "^8.52.0",
     "eslint-plugin-react": "^7.34.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.7",
     "eslint-plugin-storybook": "^0.8.0",
     "jest": "^29.7.0",
@@ -115,7 +115,7 @@
     "ts-jest": "^29.1.1",
     "typescript": "^5.2.2",
     "vite": "^4.5.3",
-    "vite-plugin-svgr": "^3.2.0",
+    "vite-plugin-svgr": "^4.2.0",
     "yui-lint": "^0.2.0"
   },
   "eslintConfig": {

apps/smart-forms-app/src/features/dashboard/components/DashboardPages/DashboardTablePagination.tsx

@@ -28,7 +28,7 @@ function DashboardTablePagination<T>(props: DashboardTablePaginationProps<T>) {
   const { table, children } = props;
 
   const { pageSize, pageIndex } = table.getState().pagination;
-  const totalNumberOfItems = table.getRowModel().rows.length;
+  const totalNumberOfItems = table.getRowCount();
 
   return (
     <Box display="flex" justifyContent="space-between" alignItems="center">
@@ -39,9 +39,10 @@ function DashboardTablePagination<T>(props: DashboardTablePaginationProps<T>) {
         count={table.getFilteredRowModel().rows.length}
         rowsPerPage={pageSize}
         page={pageIndex}
+        data-test="dashboard-table-pagination"
         onPageChange={(_, page) => table.setPageIndex(page)}
         onRowsPerPageChange={(event) => {
-          const size = event.target.value ? Number(event.target.value) : 10;
+          const size = parseInt(event.target.value, 10);
           table.setPageSize(size);
         }}
       />

apps/smart-forms-app/src/features/dashboard/components/DashboardPages/QuestionnairePage/Buttons/CreateNewResponseButton.tsx

@@ -20,10 +20,10 @@ import { useNavigate } from 'react-router-dom';
 import { postQuestionnaireToSMARTHealthIT } from '../../../../../../api/saveQr.ts';
 import { CircularProgress, IconButton, Stack, Typography } from '@mui/material';
 import EditNoteIcon from '@mui/icons-material/EditNote';
-import { buildForm } from '@aehrc/smart-forms-renderer';
 import useSmartClient from '../../../../../../hooks/useSmartClient.ts';
 import useSelectedQuestionnaire from '../../../../hooks/useSelectedQuestionnaire.ts';
 import { TERMINOLOGY_SERVER_URL } from '../../../../../../globals.ts';
+import { buildFormWrapper } from '../../../../../../utils/manageForm.ts';
 
 function CreateNewResponseButton() {
   const { smartClient, launchQuestionnaire } = useSmartClient();
@@ -46,7 +46,7 @@ function CreateNewResponseButton() {
       postQuestionnaireToSMARTHealthIT(smartClient, questionnaire);
     }
 
-    await buildForm(questionnaire, undefined, undefined, TERMINOLOGY_SERVER_URL);
+    await buildFormWrapper(questionnaire, undefined, undefined, TERMINOLOGY_SERVER_URL);
 
     navigate('/renderer');
     setIsLoading(false);