Issue/833

apps/demo-renderer-app/package.json

@@ -22,12 +22,8 @@
     "@types/fhir": "^0.0.38",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
-    "@typescript-eslint/eslint-plugin": "^6.0.0",
-    "@typescript-eslint/parser": "^6.0.0",
     "@vitejs/plugin-react": "^4.0.3",
     "eslint": "^8.45.0",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-react-refresh": "^0.4.3",
     "typescript": "^5.0.2",
     "vite": "^4.5.3"
   }

apps/smart-forms-app/package.json

@@ -107,7 +107,7 @@
     "eslint": "^8.52.0",
     "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-react-refresh": "^0.4.4",
+    "eslint-plugin-react-refresh": "^0.4.7",
     "eslint-plugin-storybook": "^0.8.0",
     "jest": "^29.7.0",
     "prettier": "^3.2.5",

apps/smart-forms-app/src/features/playground/api/fetchFhirResources.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Bundle } from 'fhir/r4';
+import type { Bundle } from 'fhir/r4';
 import * as FHIR from 'fhirclient';
 import { HEADERS } from '../../../api/headers.ts';
 

apps/smart-forms-app/src/features/playground/api/verifyFhirServer.ts

@@ -17,7 +17,7 @@
 
 import * as FHIR from 'fhirclient';
 import { HEADERS } from '../../../api/headers.ts';
-import { CapabilityStatement } from 'fhir/r4';
+import type { CapabilityStatement } from 'fhir/r4';
 
 export async function verifyFhirServer(
   endpointUrl: string

apps/smart-forms-app/src/features/playground/components/PlaygroundHeader.tsx

@@ -24,7 +24,7 @@ import { StyledRoot, StyledToolbar } from '../../../components/Header/Header.sty
 import { memo, useState } from 'react';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import useSmartClient from '../../../hooks/useSmartClient.ts';
-import { Patient, Practitioner } from 'fhir/r4';
+import type { Patient, Practitioner } from 'fhir/r4';
 import PlaygroundSettingsDialog from './PlaygroundSettingsDialog.tsx';
 import SettingsIcon from '@mui/icons-material/Settings';
 

apps/smart-forms-app/src/features/playground/components/PlaygroundRenderer.tsx

@@ -20,7 +20,7 @@ import PrePopButtonForPlayground from './PrePopButtonForPlayground.tsx';
 import { populateQuestionnaire } from '@aehrc/sdc-populate';
 import { BaseRenderer, buildForm, useQuestionnaireStore } from '@aehrc/smart-forms-renderer';
 import { fetchResourceCallback } from './PrePopCallbackForPlayground.tsx';
-import { Patient, Practitioner } from 'fhir/r4';
+import type { Patient, Practitioner } from 'fhir/r4';
 import { Box, Typography } from '@mui/material';
 import useLaunchContextNames from '../hooks/useLaunchContextNames.ts';
 import { TERMINOLOGY_SERVER_URL } from '../../../globals.ts';

apps/smart-forms-app/src/features/playground/components/PlaygroundSettingsDialog.tsx

@@ -17,7 +17,7 @@
 
 import { Box, Button, Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material';
 import PlaygroundPatientPicker from './PlaygroundPatientPicker.tsx';
-import { Patient, Practitioner } from 'fhir/r4';
+import type { Patient, Practitioner } from 'fhir/r4';
 import { useState } from 'react';
 import PlaygroundUserPicker from './PlaygroundUserPicker.tsx';
 import PlaygroundFhirServerUrlInput from './PlaygroundSourceFhirServerInput.tsx';

apps/smart-forms-app/src/features/playground/components/PlaygroundSourceFhirServerInput.tsx

@@ -16,7 +16,8 @@
  */
 
 import { IconButton, Stack, TextField, Tooltip, Typography } from '@mui/material';
-import { ChangeEvent, useState } from 'react';
+import type { ChangeEvent } from 'react';
+import { useState } from 'react';
 import InputAdornment from '@mui/material/InputAdornment';
 import QuestionMarkIcon from '@mui/icons-material/QuestionMark';
 import { verifyFhirServer } from '../api/verifyFhirServer.ts';

apps/smart-forms-app/src/features/sdcide/GenericScreen.tsx

@@ -16,7 +16,7 @@
  */
 
 import { Stack, Typography } from '@mui/material';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 interface SdcIdeScreenProps {
   screenTitle: string;

documentation/src/theme/ReactLiveScope/questionnaires.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Questionnaire } from 'fhir/r4';
+import type { Questionnaire } from 'fhir/r4';
 
 export const qItemControlDisplayContextDisplay: Questionnaire = {
   resourceType: 'Questionnaire',

package.json

@@ -15,6 +15,7 @@
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^7.8.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-prettier": "^5.0.1"
+    "eslint-plugin-prettier": "^5.0.1",
+    "eslint-plugin-react-refresh": "^0.4.7"
   }
 }

packages/smart-forms-renderer/src/components/FormComponents/BooleanItem/BooleanField.tsx

@@ -16,7 +16,6 @@
  */
 
 import React, { memo } from 'react';
-import type { PropsWithIsTabledAttribute } from '../../../interfaces/renderProps.interface';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import { grey } from '@mui/material/colors';
@@ -29,7 +28,7 @@ import { StyledRadioGroup } from '../Item.styles';
 import { getChoiceOrientation } from '../../../utils/choice';
 import FadingCheckIcon from '../ItemParts/FadingCheckIcon';
 
-interface BooleanFieldProps extends PropsWithIsTabledAttribute {
+interface BooleanFieldProps {
   qItem: QuestionnaireItem;
   readOnly: boolean;
   valueBoolean: boolean | undefined;
@@ -39,8 +38,7 @@ interface BooleanFieldProps extends PropsWithIsTabledAttribute {
 }
 
 const BooleanField = memo(function BooleanField(props: BooleanFieldProps) {
-  const { qItem, readOnly, valueBoolean, calcExpUpdated, isTabled, onCheckedChange, onClear } =
-    props;
+  const { qItem, readOnly, valueBoolean, calcExpUpdated, onCheckedChange, onClear } = props;
 
   // defaults to horizontal, only set to vertical if explicitly set
   const orientation = getChoiceOrientation(qItem) ?? ChoiceItemOrientation.Horizontal;

packages/smart-forms-renderer/src/components/FormComponents/BooleanItem/BooleanItem.tsx

@@ -96,7 +96,6 @@ function BooleanItem(props: BooleanItemProps) {
         <BooleanField
           qItem={qItem}
           readOnly={readOnly}
-          isTabled={isTabled}
           valueBoolean={valueBoolean}
           calcExpUpdated={calcExpUpdated}
           onCheckedChange={handleValueChange}
@@ -111,7 +110,6 @@ function BooleanItem(props: BooleanItemProps) {
       <BooleanField
         qItem={qItem}
         readOnly={readOnly}
-        isTabled={isTabled}
         valueBoolean={valueBoolean}
         calcExpUpdated={calcExpUpdated}
         onCheckedChange={handleValueChange}
@@ -128,7 +126,6 @@ function BooleanItem(props: BooleanItemProps) {
         <BooleanField
           qItem={qItem}
           readOnly={readOnly}
-          isTabled={isTabled}
           valueBoolean={valueBoolean}
           calcExpUpdated={calcExpUpdated}
           onCheckedChange={handleValueChange}

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceCheckboxAnswerOptionItem.tsx

@@ -23,7 +23,6 @@ import { FullWidthFormComponentBox } from '../../Box.styles';
 import useRenderingExtensions from '../../../hooks/useRenderingExtensions';
 import type {
   PropsWithIsRepeatedAttribute,
-  PropsWithIsTabledAttribute,
   PropsWithParentIsReadOnlyAttribute,
   PropsWithQrItemChangeHandler,
   PropsWithShowMinimalViewAttribute
@@ -37,7 +36,6 @@ import ChoiceCheckboxAnswerOptionFields from './ChoiceCheckboxAnswerOptionFields
 interface ChoiceCheckboxAnswerOptionItemProps
   extends PropsWithQrItemChangeHandler,
     PropsWithIsRepeatedAttribute,
-    PropsWithIsTabledAttribute,
     PropsWithShowMinimalViewAttribute,
     PropsWithParentIsReadOnlyAttribute {
   qItem: QuestionnaireItem;
@@ -49,7 +47,6 @@ function ChoiceCheckboxAnswerOptionItem(props: ChoiceCheckboxAnswerOptionItemPro
     qItem,
     qrItem,
     isRepeated,
-    isTabled,
     showMinimalView = false,
     parentIsReadOnly,
     onQrItemChange

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceCheckboxAnswerValueSetItem.tsx

@@ -24,7 +24,6 @@ import { FullWidthFormComponentBox } from '../../Box.styles';
 import useRenderingExtensions from '../../../hooks/useRenderingExtensions';
 import type {
   PropsWithIsRepeatedAttribute,
-  PropsWithIsTabledAttribute,
   PropsWithParentIsReadOnlyAttribute,
   PropsWithQrItemChangeHandler,
   PropsWithShowMinimalViewAttribute
@@ -39,7 +38,6 @@ interface ChoiceCheckboxAnswerValueSetItemProps
   extends PropsWithQrItemChangeHandler,
     PropsWithIsRepeatedAttribute,
     PropsWithShowMinimalViewAttribute,
-    PropsWithIsTabledAttribute,
     PropsWithParentIsReadOnlyAttribute {
   qItem: QuestionnaireItem;
   qrItem: QuestionnaireResponseItem | null;
@@ -51,7 +49,6 @@ function ChoiceCheckboxAnswerValueSetItem(props: ChoiceCheckboxAnswerValueSetIte
     qItem,
     qrItem,
     isRepeated,
-    isTabled,
     showMinimalView = false,
     parentIsReadOnly,
     onQrItemChange

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceItemSwitcher.tsx

@@ -70,7 +70,6 @@ function ChoiceItemSwitcher(props: ChoiceItemSwitcherProps) {
             qItem={qItem}
             qrItem={qrItem}
             isRepeated={isRepeated}
-            isTabled={isTabled}
             parentIsReadOnly={parentIsReadOnly}
             onQrItemChange={onQrItemChange}
           />
@@ -83,7 +82,6 @@ function ChoiceItemSwitcher(props: ChoiceItemSwitcherProps) {
             qItem={qItem}
             qrItem={qrItem}
             isRepeated={qItem.repeats ?? false}
-            isTabled={isTabled}
             showMinimalView={showMinimalView}
             parentIsReadOnly={parentIsReadOnly}
             onQrItemChange={onQrItemChange}
@@ -95,7 +93,6 @@ function ChoiceItemSwitcher(props: ChoiceItemSwitcherProps) {
             qItem={qItem}
             qrItem={qrItem}
             isRepeated={qItem.repeats ?? false}
-            isTabled={isTabled}
             showMinimalView={showMinimalView}
             parentIsReadOnly={parentIsReadOnly}
             onQrItemChange={onQrItemChange}

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceRadioAnswerOptionFields.tsx

@@ -21,15 +21,14 @@ import type { QuestionnaireItem, QuestionnaireItemAnswerOption } from 'fhir/r4';
 import RadioOptionList from '../ItemParts/RadioOptionList';
 import { StyledRadioGroup } from '../Item.styles';
 import { getChoiceOrientation } from '../../../utils/choice';
-import type { PropsWithIsTabledAttribute } from '../../../interfaces/renderProps.interface';
 import Box from '@mui/material/Box';
 import FadingCheckIcon from '../ItemParts/FadingCheckIcon';
 import Fade from '@mui/material/Fade';
 import Tooltip from '@mui/material/Tooltip';
 import Button from '@mui/material/Button';
 import { grey } from '@mui/material/colors';
 
-interface ChoiceRadioAnswerOptionFieldsProps extends PropsWithIsTabledAttribute {
+interface ChoiceRadioAnswerOptionFieldsProps {
   qItem: QuestionnaireItem;
   options: QuestionnaireItemAnswerOption[];
   valueRadio: string | null;
@@ -40,16 +39,7 @@ interface ChoiceRadioAnswerOptionFieldsProps extends PropsWithIsTabledAttribute
 }
 
 function ChoiceRadioAnswerOptionFields(props: ChoiceRadioAnswerOptionFieldsProps) {
-  const {
-    qItem,
-    options,
-    valueRadio,
-    readOnly,
-    calcExpUpdated,
-    isTabled,
-    onCheckedChange,
-    onClear
-  } = props;
+  const { qItem, options, valueRadio, readOnly, calcExpUpdated, onCheckedChange, onClear } = props;
 
   const orientation = getChoiceOrientation(qItem) ?? ChoiceItemOrientation.Vertical;
 

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceRadioAnswerOptionItem.tsx

@@ -96,7 +96,6 @@ function ChoiceRadioAnswerOptionItem(props: ChoiceRadioAnswerOptionItemProps) {
           options={options}
           valueChoice={valueChoice}
           isRepeated={isRepeated}
-          isTabled={isTabled}
           readOnly={readOnly}
           calcExpUpdated={calcExpUpdated}
           onFocusLinkId={() => onFocusLinkId(qItem.linkId)}

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceRadioAnswerOptionView.tsx

@@ -19,15 +19,10 @@ import React from 'react';
 import ChoiceRadioAnswerOptionFields from './ChoiceRadioAnswerOptionFields';
 import { FullWidthFormComponentBox } from '../../Box.styles';
 import ItemFieldGrid from '../ItemParts/ItemFieldGrid';
-import type {
-  PropsWithIsRepeatedAttribute,
-  PropsWithIsTabledAttribute
-} from '../../../interfaces/renderProps.interface';
+import type { PropsWithIsRepeatedAttribute } from '../../../interfaces/renderProps.interface';
 import type { QuestionnaireItem, QuestionnaireItemAnswerOption } from 'fhir/r4';
 
-interface ChoiceRadioAnswerOptionViewProps
-  extends PropsWithIsRepeatedAttribute,
-    PropsWithIsTabledAttribute {
+interface ChoiceRadioAnswerOptionViewProps extends PropsWithIsRepeatedAttribute {
   qItem: QuestionnaireItem;
   options: QuestionnaireItemAnswerOption[];
   valueChoice: string | null;
@@ -44,7 +39,6 @@ function ChoiceRadioAnswerOptionView(props: ChoiceRadioAnswerOptionViewProps) {
     options,
     valueChoice,
     isRepeated,
-    isTabled,
     readOnly,
     calcExpUpdated,
     onFocusLinkId,
@@ -58,7 +52,6 @@ function ChoiceRadioAnswerOptionView(props: ChoiceRadioAnswerOptionViewProps) {
         qItem={qItem}
         options={options}
         valueRadio={valueChoice}
-        isTabled={isTabled}
         readOnly={readOnly}
         calcExpUpdated={calcExpUpdated}
         onCheckedChange={onCheckedChange}
@@ -78,7 +71,6 @@ function ChoiceRadioAnswerOptionView(props: ChoiceRadioAnswerOptionViewProps) {
           options={options}
           valueRadio={valueChoice}
           readOnly={readOnly}
-          isTabled={isTabled}
           calcExpUpdated={calcExpUpdated}
           onCheckedChange={onCheckedChange}
           onClear={onClear}

packages/smart-forms-renderer/src/components/FormComponents/ChoiceItems/ChoiceRadioAnswerValueSetFields.tsx

@@ -25,15 +25,14 @@ import { StyledAlert } from '../../Alert.styles';
 import type { TerminologyError } from '../../../hooks/useValueSetCodings';
 import { getChoiceOrientation } from '../../../utils/choice';
 import FadingCheckIcon from '../ItemParts/FadingCheckIcon';
-import type { PropsWithIsTabledAttribute } from '../../../interfaces/renderProps.interface';
 import Box from '@mui/material/Box';
 import RadioOptionList from '../ItemParts/RadioOptionList';
 import Tooltip from '@mui/material/Tooltip';
 import Button from '@mui/material/Button';
 import { grey } from '@mui/material/colors';
 import Fade from '@mui/material/Fade';
 
-interface ChoiceRadioAnswerValueSetFieldsProps extends PropsWithIsTabledAttribute {
+interface ChoiceRadioAnswerValueSetFieldsProps {
   qItem: QuestionnaireItem;
   options: QuestionnaireItemAnswerOption[];
   valueRadio: string | null;
@@ -52,7 +51,6 @@ function ChoiceRadioAnswerValueSetFields(props: ChoiceRadioAnswerValueSetFieldsP
     readOnly,
     calcExpUpdated,
     terminologyError,
-    isTabled,
     onCheckedChange,
     onClear
   } = props;