@aehrc/smart-forms-renderer 0.40.1 → 0.40.2

package/lib/utils/manageForm.js

@@ -12,6 +12,8 @@ import { initialiseQuestionnaireResponse } from './initialise';
 import { removeEmptyAnswers } from './removeEmptyAnswers';
 import { readEncounter, readPatient, readUser } from '../api/smartClient';
 import cloneDeep from 'lodash.clonedeep';
+import { updateQuestionnaireResponse } from './genericRecursive';
+import { removeInternalRepeatIdsRecursive } from './repeatId';
 /**
  * Build the form with an initial Questionnaire and an optional filled QuestionnaireResponse.
  * If a QuestionnaireResponse is not provided, an empty QuestionnaireResponse is set as the initial QuestionnaireResponse.
@@ -86,7 +88,8 @@ export function initialiseFhirClient(fhirClient) {
  * @author Sean Fong
  */
 export function getResponse() {
-    return cloneDeep(questionnaireResponseStore.getState().updatableResponse);
+    const cleanResponse = removeInternalIdsFromResponse(questionnaireStore.getState().sourceQuestionnaire, questionnaireResponseStore.getState().updatableResponse);
+    return cloneDeep(cleanResponse);
 }
 /**
  * Remove all empty/hidden answers from the filled QuestionnaireResponse.
@@ -107,6 +110,16 @@ export function removeEmptyAnswersFromResponse(questionnaire, questionnaireRespo
         enableWhenExpressions
     });
 }
+/**
+ * Remove all instances of item.answer.id from the filled QuestionnaireResponse.
+ * These IDs are used internally for rendering repeating items, and can be safely left out of the final response.
+ *
+ * @author Sean Fong
+ */
+export function removeInternalIdsFromResponse(questionnaire, questionnaireResponse) {
+    const questionnaireResponseToUpdate = cloneDeep(questionnaireResponse);
+    return updateQuestionnaireResponse(questionnaire, questionnaireResponseToUpdate, removeInternalRepeatIdsRecursive, undefined);
+}
 /**
  * Check if a QuestionnaireResponseItem has either an item or an answer property.
  *

package/lib/utils/manageForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"manageForm.js","sourceRoot":"","sources":["../../src/utils/manageForm.ts"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EACL,0BAA0B,EAC1B,kBAAkB,EAClB,gBAAgB,EAChB,sBAAsB,EACvB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,+BAA+B,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE1E,OAAO,SAAS,MAAM,kBAAkB,CAAC;AAEzC;;;;;;;;;;;;GAYG;AACH,MAAM,UAAgB,SAAS,CAC7B,aAA4B,EAC5B,qBAA6C,EAC7C,QAAkB,EAClB,oBAA6B,EAC7B,mBAA4C;;QAE5C,2BAA2B;QAC3B,IAAI,oBAAoB,EAAE;YACxB,sBAAsB,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;SAChE;aAAM;YACL,sBAAsB,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC;SAC9C;QAED,yIAAyI;QACzI,MAAM,kBAAkB;aACrB,QAAQ,EAAE;aACV,wBAAwB,CAAC,aAAa,EAAE,SAAS,EAAE,mBAAmB,EAAE,oBAAoB,CAAC,CAAC;QAEjG,MAAM,gCAAgC,GAAG,+BAA+B,CACtE,aAAa,EACb,qBAAqB,CACtB,CAAC;QACF,0BAA0B,CAAC,QAAQ,EAAE,CAAC,mBAAmB,CAAC,gCAAgC,CAAC,CAAC;QAC5F,kBAAkB,CAAC,QAAQ,EAAE,CAAC,yBAAyB,CAAC,gCAAgC,CAAC,CAAC;QAE1F,IAAI,QAAQ,EAAE;YACZ,kBAAkB,CAAC,QAAQ,EAAE,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC;SAC3D;IACH,CAAC;CAAA;AAED;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,kBAAkB,CAAC,QAAQ,EAAE,CAAC,0BAA0B,EAAE,CAAC;IAC3D,0BAA0B,CAAC,QAAQ,EAAE,CAAC,qBAAqB,EAAE,CAAC;AAChE,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAgB,oBAAoB,CAAC,UAAkB;;QAC3D,gBAAgB,CAAC,QAAQ,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;QAClD,MAAM,cAAc,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;QAC/C,MAAM,WAAW,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;QACzC,MAAM,gBAAgB,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;QAEnD,MAAM,CAAC,OAAO,EAAE,IAAI,EAAE,SAAS,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC;YACnD,cAAc;YACd,WAAW;YACX,gBAAgB;SACjB,CAAC,CAAC;QACH,gBAAgB,CAAC,QAAQ,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAChD,gBAAgB,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAC1C,gBAAgB,CAAC,QAAQ,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACtD,CAAC;CAAA;AAED;;;;;GAKG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,SAAS,CAAC,0BAA0B,CAAC,QAAQ,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAC5E,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,8BAA8B,CAC5C,aAA4B,EAC5B,qBAA4C;IAE5C,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,qBAAqB,CAAC;IAClF,MAAM,eAAe,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,eAAe,CAAC;IACtE,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,qBAAqB,CAAC;IAElF,OAAO,kBAAkB,CAAC;QACxB,aAAa;QACb,qBAAqB;QACrB,qBAAqB;QACrB,eAAe;QACf,qBAAqB;KACtB,CAAC,CAAC;AACL,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAC,MAAiC;IACtE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AACpG,CAAC"}
+{"version":3,"file":"manageForm.js","sourceRoot":"","sources":["../../src/utils/manageForm.ts"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EACL,0BAA0B,EAC1B,kBAAkB,EAClB,gBAAgB,EAChB,sBAAsB,EACvB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,+BAA+B,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE1E,OAAO,SAAS,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,2BAA2B,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,gCAAgC,EAAE,MAAM,YAAY,CAAC;AAE9D;;;;;;;;;;;;GAYG;AACH,MAAM,UAAgB,SAAS,CAC7B,aAA4B,EAC5B,qBAA6C,EAC7C,QAAkB,EAClB,oBAA6B,EAC7B,mBAA4C;;QAE5C,2BAA2B;QAC3B,IAAI,oBAAoB,EAAE;YACxB,sBAAsB,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;SAChE;aAAM;YACL,sBAAsB,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC;SAC9C;QAED,yIAAyI;QACzI,MAAM,kBAAkB;aACrB,QAAQ,EAAE;aACV,wBAAwB,CAAC,aAAa,EAAE,SAAS,EAAE,mBAAmB,EAAE,oBAAoB,CAAC,CAAC;QAEjG,MAAM,gCAAgC,GAAG,+BAA+B,CACtE,aAAa,EACb,qBAAqB,CACtB,CAAC;QACF,0BAA0B,CAAC,QAAQ,EAAE,CAAC,mBAAmB,CAAC,gCAAgC,CAAC,CAAC;QAC5F,kBAAkB,CAAC,QAAQ,EAAE,CAAC,yBAAyB,CAAC,gCAAgC,CAAC,CAAC;QAE1F,IAAI,QAAQ,EAAE;YACZ,kBAAkB,CAAC,QAAQ,EAAE,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC;SAC3D;IACH,CAAC;CAAA;AAED;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,kBAAkB,CAAC,QAAQ,EAAE,CAAC,0BAA0B,EAAE,CAAC;IAC3D,0BAA0B,CAAC,QAAQ,EAAE,CAAC,qBAAqB,EAAE,CAAC;AAChE,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAgB,oBAAoB,CAAC,UAAkB;;QAC3D,gBAAgB,CAAC,QAAQ,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;QAClD,MAAM,cAAc,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;QAC/C,MAAM,WAAW,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;QACzC,MAAM,gBAAgB,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;QAEnD,MAAM,CAAC,OAAO,EAAE,IAAI,EAAE,SAAS,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC;YACnD,cAAc;YACd,WAAW;YACX,gBAAgB;SACjB,CAAC,CAAC;QACH,gBAAgB,CAAC,QAAQ,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAChD,gBAAgB,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAC1C,gBAAgB,CAAC,QAAQ,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACtD,CAAC;CAAA;AAED;;;;;GAKG;AACH,MAAM,UAAU,WAAW;IACzB,MAAM,aAAa,GAAG,6BAA6B,CACjD,kBAAkB,CAAC,QAAQ,EAAE,CAAC,mBAAmB,EACjD,0BAA0B,CAAC,QAAQ,EAAE,CAAC,iBAAiB,CACxD,CAAC;IACF,OAAO,SAAS,CAAC,aAAa,CAAC,CAAC;AAClC,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,8BAA8B,CAC5C,aAA4B,EAC5B,qBAA4C;IAE5C,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,qBAAqB,CAAC;IAClF,MAAM,eAAe,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,eAAe,CAAC;IACtE,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,QAAQ,EAAE,CAAC,qBAAqB,CAAC;IAElF,OAAO,kBAAkB,CAAC;QACxB,aAAa;QACb,qBAAqB;QACrB,qBAAqB;QACrB,eAAe;QACf,qBAAqB;KACtB,CAAC,CAAC;AACL,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,6BAA6B,CAC3C,aAA4B,EAC5B,qBAA4C;IAE5C,MAAM,6BAA6B,GAAG,SAAS,CAAC,qBAAqB,CAAC,CAAC;IAEvE,OAAO,2BAA2B,CAChC,aAAa,EACb,6BAA6B,EAC7B,gCAAgC,EAChC,SAAS,CACV,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAC,MAAiC;IACtE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AACpG,CAAC"}

package/lib/utils/repeatId.d.ts

@@ -1,2 +1,4 @@
+import type { QuestionnaireItem, QuestionnaireResponseItem } from 'fhir/r4';
 export declare function generateNewRepeatId(linkId: string): string;
 export declare function generateExistingRepeatId(linkId: string, index: number): string;
+export declare function removeInternalRepeatIdsRecursive(qItem: QuestionnaireItem, qrItemOrItems: QuestionnaireResponseItem | QuestionnaireResponseItem[] | null): QuestionnaireResponseItem | QuestionnaireResponseItem[] | null;

package/lib/utils/repeatId.js

@@ -14,12 +14,80 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { nanoid } from 'nanoid';
+import { getQrItemsIndex, mapQItemsIndex } from './mapItem';
 export function generateNewRepeatId(linkId) {
-    return `${linkId}-${nanoid()}`;
+    return `${linkId}-repeat-${nanoid()}`;
 }
 export function generateExistingRepeatId(linkId, index) {
     const paddedIndex = index.toString().padStart(6, '0');
-    return `${linkId}-${paddedIndex}`;
+    return `${linkId}-repeat-${paddedIndex}`;
+}
+export function removeInternalRepeatIdsRecursive(qItem, qrItemOrItems) {
+    var _a, _b;
+    // Process repeating group items separately
+    const hasMultipleAnswers = Array.isArray(qrItemOrItems);
+    if (hasMultipleAnswers) {
+        return removeInternalRepeatIdsFromRepeatGroup(qItem, qrItemOrItems);
+    }
+    // At this point qrItemOrItems is a single QuestionnaireResponseItem
+    const qrItem = qrItemOrItems;
+    // Process items with child items
+    const childQItems = (_a = qItem.item) !== null && _a !== void 0 ? _a : [];
+    const childQrItems = (_b = qrItem === null || qrItem === void 0 ? void 0 : qrItem.item) !== null && _b !== void 0 ? _b : [];
+    const updatedChildQrItems = [];
+    if (childQItems.length > 0) {
+        const indexMap = mapQItemsIndex(qItem);
+        const qrItemsByIndex = getQrItemsIndex(childQItems, childQrItems, indexMap);
+        // Iterate child items
+        for (const [index, childQItem] of childQItems.entries()) {
+            const childQRItemOrItems = qrItemsByIndex[index];
+            const updatedChildQRItemOrItems = removeInternalRepeatIdsRecursive(childQItem, childQRItemOrItems !== null && childQRItemOrItems !== void 0 ? childQRItemOrItems : null);
+            if (Array.isArray(updatedChildQRItemOrItems)) {
+                if (updatedChildQRItemOrItems.length > 0) {
+                    updatedChildQrItems.push(...updatedChildQRItemOrItems);
+                }
+                continue;
+            }
+            if (updatedChildQRItemOrItems) {
+                updatedChildQrItems.push(updatedChildQRItemOrItems);
+            }
+        }
+    }
+    // Construct updated qrItem
+    return removeInternalRepeatIdsFromItem(qItem, qrItem, updatedChildQrItems);
+}
+function removeInternalRepeatIdsFromRepeatGroup(qItem, qrItems) {
+    if (!qItem.item) {
+        return [];
+    }
+    return qrItems
+        .flatMap((childQrItem) => removeInternalRepeatIdsRecursive(qItem, childQrItem))
+        .filter((childQRItem) => !!childQRItem);
+}
+function removeInternalRepeatIdsFromItem(qItem, qrItem, childQrItems) {
+    var _a, _b;
+    if (!qrItem) {
+        return null;
+    }
+    // Remove internal repeatId from all answers
+    const updatedAnswers = (_b = (_a = qrItem.answer) === null || _a === void 0 ? void 0 : _a.map(
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    (_a) => {
+        var { id } = _a, rest = __rest(_a, ["id"]);
+        return Object.assign({}, rest);
+    }).filter((answer) => !!answer && Object.keys(answer).length > 0)) !== null && _b !== void 0 ? _b : [];
+    return Object.assign(Object.assign(Object.assign({ linkId: qItem.linkId }, (qItem.text && { text: qItem.text })), (childQrItems.length > 0 && { item: childQrItems })), (updatedAnswers.length > 0 && { answer: updatedAnswers }));
 }
 //# sourceMappingURL=repeatId.js.map

package/lib/utils/repeatId.js.map

@@ -1 +1 @@
-{"version":3,"file":"repeatId.js","sourceRoot":"","sources":["../../src/utils/repeatId.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,MAAM,UAAU,mBAAmB,CAAC,MAAc;IAChD,OAAO,GAAG,MAAM,IAAI,MAAM,EAAE,EAAE,CAAC;AACjC,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,MAAc,EAAE,KAAa;IACpE,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACtD,OAAO,GAAG,MAAM,IAAI,WAAW,EAAE,CAAC;AACpC,CAAC"}
+{"version":3,"file":"repeatId.js","sourceRoot":"","sources":["../../src/utils/repeatId.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aehrc/smart-forms-renderer",
-  "version": "0.40.1",
+  "version": "0.40.2",
   "description": "FHIR Structured Data Captured (SDC) rendering engine for Smart Forms",
   "main": "lib/index.js",
   "scripts": {

package/src/components/FormComponents/RepeatGroup/RepeatGroup.tsx

@@ -58,7 +58,7 @@ function RepeatGroup(props: RepeatGroupProps) {
 
   const mutateRepeatEnableWhenItems = useQuestionnaireStore.use.mutateRepeatEnableWhenItems();
 
-  const initialRepeatGroups = useInitialiseRepeatGroups(qItem, qrItems);
+  const initialRepeatGroups = useInitialiseRepeatGroups(qItem.linkId, qrItems);
 
   const [repeatGroups, setRepeatGroups] = useRepeatGroups(initialRepeatGroups);
 
@@ -104,7 +104,7 @@ function RepeatGroup(props: RepeatGroupProps) {
     setRepeatGroups([
       ...repeatGroups,
       {
-        nanoId: generateNewRepeatId(qItem.linkId),
+        id: generateNewRepeatId(qItem.linkId),
         qrItem: null
       }
     ]);

package/src/components/FormComponents/RepeatGroup/RepeatGroupView.tsx

@@ -76,7 +76,7 @@ function RepeatGroupView(props: RepeatGroupViewProps) {
     return (
       <QGroupContainerBox key={qItem.linkId} cardElevation={groupCardElevation} isRepeated={true}>
         <Card elevation={groupCardElevation} sx={{ p: 2 }}>
-          {repeatGroups.map(({ nanoId, qrItem: nullableQrItem }, index) => {
+          {repeatGroups.map(({ id, qrItem: nullableQrItem }, index) => {
             const answeredQrItem = createEmptyQrItem(qItem, undefined);
             if (nullableQrItem) {
               answeredQrItem.item = nullableQrItem.item;
@@ -84,7 +84,7 @@ function RepeatGroupView(props: RepeatGroupViewProps) {
 
             return (
               <RepeatGroupItem
-                key={nanoId}
+                key={id}
                 qItem={qItem}
                 repeatGroupIndex={index}
                 answeredQrItem={answeredQrItem}
@@ -127,14 +127,14 @@ function RepeatGroupView(props: RepeatGroupViewProps) {
         <AccordionDetails sx={{ pt: 0 }}>
           {qItem.text ? <Divider sx={{ mb: 1.5 }} light /> : null}
           <TransitionGroup>
-            {repeatGroups.map(({ nanoId, qrItem: nullableQrItem }, index) => {
+            {repeatGroups.map(({ id, qrItem: nullableQrItem }, index) => {
               const answeredQrItem = createEmptyQrItem(qItem, undefined);
               if (nullableQrItem) {
                 answeredQrItem.item = nullableQrItem.item;
               }
 
               return (
-                <Collapse key={nanoId} timeout={200}>
+                <Collapse key={id} timeout={200}>
                   <RepeatGroupItem
                     qItem={qItem}
                     repeatGroupIndex={index}
@@ -169,14 +169,14 @@ function RepeatGroupView(props: RepeatGroupViewProps) {
           </>
         ) : null}
         <TransitionGroup>
-          {repeatGroups.map(({ nanoId, qrItem: nullableQrItem }, index) => {
+          {repeatGroups.map(({ id, qrItem: nullableQrItem }, index) => {
             const answeredQrItem = createEmptyQrItem(qItem, undefined);
             if (nullableQrItem) {
               answeredQrItem.item = nullableQrItem.item;
             }
 
             return (
-              <Collapse key={nanoId} timeout={200}>
+              <Collapse key={id} timeout={200}>
                 <RepeatGroupItem
                   qItem={qItem}
                   repeatGroupIndex={index}

package/src/components/FormComponents/Tables/GroupTable.tsx

@@ -104,7 +104,7 @@ function GroupTable(props: GroupTableProps) {
     const updatedTableRows = [...tableRows];
 
     const rowToRemove = updatedTableRows[index];
-    const updatedSelectedIds = selectedIds.filter((id) => id !== rowToRemove.nanoId);
+    const updatedSelectedIds = selectedIds.filter((id) => id !== rowToRemove.id);
 
     updatedTableRows.splice(index, 1);
 
@@ -117,21 +117,21 @@ function GroupTable(props: GroupTableProps) {
   }
 
   function handleAddRow() {
-    const newRowNanoId = generateNewRepeatId(qItem.linkId);
+    const newRowId = generateNewRepeatId(qItem.linkId);
     setTableRows([
       ...tableRows,
       {
-        nanoId: newRowNanoId,
+        id: newRowId,
         qrItem: null
       }
     ]);
-    setSelectedIds([...selectedIds, newRowNanoId]);
+    setSelectedIds([...selectedIds, newRowId]);
   }
 
   function handleSelectAll() {
     // deselect all if all are selected, otherwise select all
     const updatedTableIds =
-      selectedIds.length === tableRows.length ? [] : tableRows.map((tableRow) => tableRow.nanoId);
+      selectedIds.length === tableRows.length ? [] : tableRows.map((tableRow) => tableRow.id);
     setSelectedIds(updatedTableIds);
     onQrRepeatGroupChange({
       linkId: qItem.linkId,
@@ -139,12 +139,12 @@ function GroupTable(props: GroupTableProps) {
     });
   }
 
-  function handleSelectRow(nanoId: string) {
+  function handleSelectRow(rowId: string) {
     const updatedSelectedIds = [...selectedIds];
 
-    const index = updatedSelectedIds.indexOf(nanoId);
+    const index = updatedSelectedIds.indexOf(rowId);
     if (index === -1) {
-      updatedSelectedIds.push(nanoId);
+      updatedSelectedIds.push(rowId);
     } else {
       updatedSelectedIds.splice(index, 1);
     }

package/src/components/FormComponents/Tables/GroupTableBody.tsx

@@ -41,7 +41,7 @@ interface GroupTableBodyProps
   qItemsIndexMap: Record<string, number>;
   onRowChange: (newQrRow: QuestionnaireResponseItem, index: number) => void;
   onRemoveRow: (index: number) => void;
-  onSelectRow: (nanoId: string) => void;
+  onSelectRow: (rowId: string) => void;
   onReorderRows: (newTableRows: GroupTableRowModel[]) => void;
 }
 
@@ -80,8 +80,8 @@ function GroupTableBody(props: GroupTableBodyProps) {
       <Droppable droppableId="gtable_rows" direction="vertical">
         {(droppableProvided, snapshot) => (
           <TableBody ref={droppableProvided.innerRef} {...droppableProvided.droppableProps}>
-            {tableRows.map(({ nanoId, qrItem: nullableQrItem }, index) => {
-              const itemIsSelected = selectedIds.indexOf(nanoId) !== -1;
+            {tableRows.map(({ id, qrItem: nullableQrItem }, index) => {
+              const itemIsSelected = selectedIds.indexOf(id) !== -1;
               const answeredQrItem = createEmptyQrItem(tableQItem, undefined);
               if (nullableQrItem) {
                 answeredQrItem.item = nullableQrItem.item;
@@ -89,9 +89,9 @@ function GroupTableBody(props: GroupTableBodyProps) {
 
               return (
                 <GroupTableRow
-                  key={nanoId}
+                  key={id}
                   index={index}
-                  nanoId={nanoId}
+                  rowId={id}
                   tableQItem={tableQItem}
                   answeredQrItem={answeredQrItem}
                   nullableQrItem={nullableQrItem}

package/src/components/FormComponents/Tables/GroupTableRow.tsx

@@ -39,7 +39,7 @@ interface GroupTableRowProps
     PropsWithShowMinimalViewAttribute,
     PropsWithParentIsReadOnlyAttribute,
     TableRowProps {
-  nanoId: string;
+  rowId: string;
   index: number;
   tableQItem: QuestionnaireItem;
   answeredQrItem: QuestionnaireResponseItem;
@@ -58,7 +58,7 @@ interface GroupTableRowProps
 
 function GroupTableRow(props: GroupTableRowProps) {
   const {
-    nanoId,
+    rowId,
     index,
     tableQItem,
     answeredQrItem,
@@ -78,7 +78,7 @@ function GroupTableRow(props: GroupTableRowProps) {
 
   if (isRepeated) {
     return (
-      <Draggable draggableId={nanoId} index={index}>
+      <Draggable draggableId={rowId} index={index}>
         {(draggableProvided, snapshot) => (
           <StyledGroupTableRow
             itemIsDragged={snapshot.isDragging}
@@ -106,7 +106,7 @@ function GroupTableRow(props: GroupTableRowProps) {
                 <SelectRowButton
                   isSelected={itemIsSelected}
                   readOnly={readOnly}
-                  onSelectItem={() => onSelectRow(nanoId)}
+                  onSelectItem={() => onSelectRow(rowId)}
                 />
               </>
             )}
@@ -150,7 +150,7 @@ function GroupTableRow(props: GroupTableRowProps) {
           <SelectRowButton
             isSelected={itemIsSelected}
             readOnly={readOnly}
-            onSelectItem={() => onSelectRow(nanoId)}
+            onSelectItem={() => onSelectRow(rowId)}
           />
         </>
       )}

package/src/components/FormComponents/Tables/GroupTableView.tsx

@@ -54,7 +54,7 @@ interface GroupTableViewProps
   onAddRow: () => void;
   onRowChange: (newQrRow: QuestionnaireResponseItem, index: number) => void;
   onRemoveRow: (index: number) => void;
-  onSelectRow: (nanoId: string) => void;
+  onSelectRow: (rowId: string) => void;
   onSelectAll: () => void;
   onReorderRows: (newTableRows: GroupTableRowModel[]) => void;
 }

package/src/components/Renderer/FormTopLevelItem.tsx

@@ -175,14 +175,16 @@ function FormTopLevelItem(props: FormTopLevelItemProps) {
   const itemRepeatsAndIsNotCheckbox = isRepeatItemAndNotCheckbox(topLevelQItem);
   if (itemRepeatsAndIsNotCheckbox) {
     return (
-      <RepeatItem
-        key={topLevelQItem.linkId}
-        qItem={topLevelQItem}
-        qrItem={topLevelQRItem}
-        groupCardElevation={1}
-        parentIsReadOnly={readOnly}
-        onQrItemChange={onQrItemChange}
-      />
+      <Box mt={1}>
+        <RepeatItem
+          key={topLevelQItem.linkId}
+          qItem={topLevelQItem}
+          qrItem={topLevelQRItem}
+          groupCardElevation={1}
+          parentIsReadOnly={readOnly}
+          onQrItemChange={onQrItemChange}
+        />
+      </Box>
     );
   }
 

package/src/hooks/useGroupTableRows.ts

@@ -24,7 +24,7 @@ function useGroupTableRows(linkId: string, qrItems: QuestionnaireResponseItem[])
 
   const [tableRows, setTableRows] = useState(initialisedGroupTableRows);
   const [selectedIds, setSelectedIds] = useState<string[]>(
-    initialisedGroupTableRows.map((row) => row.nanoId)
+    initialisedGroupTableRows.map((row) => row.id)
   );
 
   return { tableRows, selectedIds, setTableRows, setSelectedIds };

package/src/hooks/useInitialiseGroupTable.ts

@@ -23,23 +23,16 @@ function useInitialiseGroupTable(
   linkId: string,
   qrItems: QuestionnaireResponseItem[]
 ): GroupTableRowModel[] {
-  let initialGroupTableRows: GroupTableRowModel[] = [
-    {
-      nanoId: generateNewRepeatId(linkId),
-      qrItem: null
-    }
-  ];
-
-  if (qrItems.length > 0) {
-    initialGroupTableRows = qrItems.map((qrItem, index) => {
-      return {
-        nanoId: generateExistingRepeatId(linkId, index),
-        qrItem
-      };
-    });
+  if (qrItems.length === 0) {
+    return [{ id: generateNewRepeatId(linkId), qrItem: null }];
   }
 
-  return initialGroupTableRows;
+  return qrItems.map((qrItem, index) => {
+    return {
+      id: generateExistingRepeatId(linkId, index),
+      qrItem
+    };
+  });
 }
 
 export default useInitialiseGroupTable;

package/src/hooks/useInitialiseRepeatGroups.ts

@@ -15,38 +15,27 @@
  * limitations under the License.
  */
 
-import type { QuestionnaireItem, QuestionnaireResponseItem } from 'fhir/r4';
+import type { QuestionnaireResponseItem } from 'fhir/r4';
 import type { RepeatGroupSingle } from '../interfaces/repeatGroup.interface';
 import { useMemo } from 'react';
 import { generateExistingRepeatId, generateNewRepeatId } from '../utils/repeatId';
 
 function useInitialiseRepeatGroups(
-  qItem: QuestionnaireItem,
+  linkId: string,
   qrItems: QuestionnaireResponseItem[]
 ): RepeatGroupSingle[] {
-  return useMemo(
-    () => {
-      let initialRepeatGroupAnswers: RepeatGroupSingle[] = [
-        {
-          nanoId: generateNewRepeatId(qItem.linkId),
-          qrItem: null
-        }
-      ];
+  return useMemo(() => {
+    if (qrItems.length === 0) {
+      return [{ id: generateNewRepeatId(linkId), qrItem: null }];
+    }
 
-      if (qrItems.length > 0) {
-        initialRepeatGroupAnswers = qrItems.map((qrItem, index) => {
-          return {
-            nanoId: generateExistingRepeatId(qItem.linkId, index),
-            qrItem
-          };
-        });
-      }
-      return initialRepeatGroupAnswers;
-    },
-    // Requires checking of both qItem and qrItems
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [qItem, qrItems]
-  );
+    return qrItems.map((qrItem, index) => {
+      return {
+        id: generateExistingRepeatId(linkId, index),
+        qrItem
+      };
+    });
+  }, [linkId, qrItems]);
 }
 
 export default useInitialiseRepeatGroups;

package/src/hooks/useRepeatGroups.ts

@@ -19,6 +19,7 @@ import type { Dispatch, SetStateAction } from 'react';
 import { useEffect, useState } from 'react';
 import type { RepeatGroupSingle } from '../interfaces/repeatGroup.interface';
 import _isEqual from 'lodash/isEqual';
+import type { QuestionnaireResponseItem } from 'fhir/r4';
 
 function useRepeatGroups(
   valueFromProps: RepeatGroupSingle[]
@@ -27,10 +28,13 @@ function useRepeatGroups(
 
   useEffect(
     () => {
-      const valueFromPropsQRItems = valueFromProps.map(
-        (repeatGroupSingle) => repeatGroupSingle.qrItem
-      );
-      const repeatGroupsQRItems = repeatGroups.map((repeatGroupSingle) => repeatGroupSingle.qrItem);
+      const valueFromPropsQRItems = valueFromProps
+        .map((repeatGroupSingle) => repeatGroupSingle.qrItem)
+        .filter((qrItem): qrItem is QuestionnaireResponseItem => qrItem !== null);
+
+      const repeatGroupsQRItems = repeatGroups
+        .map((repeatGroupSingle) => repeatGroupSingle.qrItem)
+        .filter((qrItem): qrItem is QuestionnaireResponseItem => qrItem !== null);
 
       if (!_isEqual(valueFromPropsQRItems, repeatGroupsQRItems)) {
         setRepeatGroups(valueFromProps);

package/src/index.ts

@@ -42,6 +42,7 @@ export {
   destroyForm,
   getResponse,
   removeEmptyAnswersFromResponse,
+  removeInternalIdsFromResponse,
   isSpecificItemControl,
   isRepeatItemAndNotCheckbox,
   initialiseQuestionnaireResponse,

package/src/interfaces/groupTable.interface.ts

@@ -18,6 +18,6 @@
 import type { QuestionnaireResponseItem } from 'fhir/r4';
 
 export interface GroupTableRowModel {
-  nanoId: string;
+  id: string;
   qrItem: QuestionnaireResponseItem | null;
 }

package/src/interfaces/repeatGroup.interface.ts

@@ -23,6 +23,6 @@ export interface QrRepeatGroup {
 }
 
 export interface RepeatGroupSingle {
-  nanoId: string;
+  id: string;
   qrItem: QuestionnaireResponseItem | null;
 }

package/src/stories/storybookWrappers/BuildFormButtonForStorybook.tsx

@@ -44,7 +44,7 @@ function BuildFormButtonForStorybook(props: BuildFormButtonProps) {
     <Box display="flex" mb={0.5} alignItems="center" columnGap={3}>
       <Tooltip title="Build form with questionnaire response" placement="right">
         <IconButton onClick={handleBuildForm} size="small" color="primary">
-          <Iconify icon="ph:hammer" sx={{ mb: 0.5 }} />
+          <Iconify icon="ph:hammer" />
         </IconButton>
       </Tooltip>
     </Box>

package/src/stories/storybookWrappers/IdRemoverButtonForStorybook.tsx

@@ -17,27 +17,24 @@
 
 // @ts-ignore
 import React from 'react';
-import type { QuestionnaireResponse } from 'fhir/r4';
+import type { Questionnaire, QuestionnaireResponse } from 'fhir/r4';
 import { Box, IconButton, Tooltip } from '@mui/material';
 import ContentCutIcon from '@mui/icons-material/ContentCut';
+import { useQuestionnaireResponseStore } from '../../stores';
+import { removeInternalIdsFromResponse } from '../../utils/manageForm';
 
 interface IdRemoverButtonProps {
+  questionnaire: Questionnaire;
   questionnaireResponse: QuestionnaireResponse;
 }
 
 function IdRemoverButtonForStorybook(props: IdRemoverButtonProps) {
-  const { questionnaireResponse } = props;
+  const { questionnaire, questionnaireResponse } = props;
 
-  async function handleRemoveIds() {
-    console.log('handle remove IDs');
+  const updateResponse = useQuestionnaireResponseStore.use.updateResponse();
 
-    // return buildForm()
-    // updateQuestionnaireResponse(
-    //   questionnaire,
-    //   populatedResponse,
-    //   initialiseItemCalculatedExpressionValueRecursive,
-    //   calculatedExpressionsWithValues
-    // );
+  async function handleRemoveIds() {
+    updateResponse(removeInternalIdsFromResponse(questionnaire, questionnaireResponse));
   }
 
   return (

package/src/stories/storybookWrappers/IdRemoverDebuggerWrapperForStorybook.tsx

@@ -48,7 +48,7 @@ function IdRemoverDebuggerWrapperForStorybook(props: IdRemoverDebuggerWrapperFor
 
   const isBuilding = useBuildForm(
     questionnaire,
-    undefined,
+    questionnaireResponse,
     undefined,
     STORYBOOK_TERMINOLOGY_SERVER_URL
   );
@@ -63,7 +63,10 @@ function IdRemoverDebuggerWrapperForStorybook(props: IdRemoverDebuggerWrapperFor
         <div>
           <Grid container>
             <Grid item xs={6}>
-              <IdRemoverButtonForStorybook questionnaireResponse={questionnaireResponse} />
+              <IdRemoverButtonForStorybook
+                questionnaire={questionnaire}
+                questionnaireResponse={updatableResponse}
+              />
               <BaseRenderer />
             </Grid>
             <Grid item xs={6}>

package/src/theme/palette.ts

@@ -77,10 +77,6 @@ const palette: PaletteOptions = {
     secondary: grey['600'],
     disabled: grey['500']
   },
-  background: {
-    paper: '#fff',
-    default: grey['50']
-  },
   customBackground: {
     neutral: '#F4F6F8'
   },

package/src/utils/groupTable.ts

@@ -32,6 +32,6 @@ export function reorderRows(
 
 export function getGroupTableItemsToUpdate(tableRows: GroupTableRowModel[], selectedIds: string[]) {
   return tableRows
-    .filter((row) => selectedIds.includes(row.nanoId))
+    .filter((row) => selectedIds.includes(row.id))
     .flatMap((singleRow) => (singleRow.qrItem ? [cloneDeep(singleRow.qrItem)] : []));
 }

package/src/utils/index.ts

@@ -15,7 +15,13 @@
  * limitations under the License.
  */
 
-export { buildForm, destroyForm, getResponse, removeEmptyAnswersFromResponse } from './manageForm';
+export {
+  buildForm,
+  destroyForm,
+  getResponse,
+  removeEmptyAnswersFromResponse,
+  removeInternalIdsFromResponse
+} from './manageForm';
 export { initialiseQuestionnaireResponse } from './initialise';
 export { isSpecificItemControl } from './itemControl';
 export { isRepeatItemAndNotCheckbox } from './qItem';