@planning-inspectorate/dynamic-forms 3.1.0 → 3.3.0

package/README.md

@@ -146,12 +146,12 @@ to add conditions to questions in multiple ways.
 The simplest condition applies to just one question:
 
 ```javascript
-import { questionHasAnswer } from '@pins/dynamic-forms/src/components/utils/question-has-answer';
+import { whenQuestionHasAnswer } from '@pins/dynamic-forms/src/components/utils/question-has-answer';
 
 new Section('section-key', 'Section title')
         .addQuestion(questions.q1)
         .addQuestion(questions.q2)
-        .withCondition((response) => questionHasAnswer(response, questions.q1, 'yes'))
+        .withCondition(whenQuestionHasAnswer(questions.q1, 'yes'))
 ```
 
 In this scenario question two will only be shown if question one has an answer of 'yes'.
@@ -160,10 +160,10 @@ Conditions can also be added to an entire section:
 
 ```javascript
 new Section('section-key', 'Section title')
-        .withSectionCondition((response) => questionHasAnswer(response, questions.q1, 'yes'))
+        .withSectionCondition(whenQuestionHasAnswer(questions.q1, 'yes'))
         .addQuestion(questions.q3)
         .addQuestion(questions.q4)
-        .withCondition((response) => questionHasAnswer(response, questions.q3, 'yes'))
+        .withCondition(whenQuestionHasAnswer(questions.q3, 'yes'))
 ```
 
 In this case q3 and q4 will only be shown if q1 (from a previous section) is answered 'yes'. Q4 will only show if q1 is
@@ -173,16 +173,16 @@ Finally, conditions can be added to multiple questions - these can overlap:
 
 ```javascript
 new Section('section-key', 'Section title')
-        .withSectionCondition((response) => questionHasAnswer(response, questions.q1, 'yes'))
+        .withSectionCondition(whenQuestionHasAnswer(questions.q1, 'yes'))
         .addQuestion(questions.q2)
-        .startMultiQuestionCondition('group-1', (response) => questionHasAnswer(response, questions.q2, 'valid'))
+        .startMultiQuestionCondition('group-1', whenQuestionHasAnswer(questions.q2, 'valid'))
         .addQuestion(questions.q3)
         .addQuestion(questions.q4)
-        .withCondition((response) => questionHasAnswer(response, questions.q3, 'yes'))
+        .withCondition(whenQuestionHasAnswer(questions.q3, 'yes'))
         .endMultiQuestionCondition('group-1')
         .addQuestion(questions.q5)
-        .withCondition((response) => questionHasAnswer(response, questions.q4, 'yes'))
-        .startMultiQuestionCondition('group-2', (response) => questionHasAnswer(response, questions.q5, 90))
+        .withCondition(whenQuestionHasAnswer(questions.q4, 'yes'))
+        .startMultiQuestionCondition('group-2', whenQuestionHasAnswer(questions.q5, 90))
         .addQuestion(questions.q6)
         .addQuestion(questions.q7)
         .endMultiQuestionCondition('group-2')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planning-inspectorate/dynamic-forms",
-  "version": "3.1.0",
+  "version": "3.3.0",
   "description": "This package is for building GDS forms using a configuration-based approach.",
   "main": "./src/index.js",
   "type": "module",

package/src/components/manage-list/README.md

@@ -59,7 +59,7 @@ const questionProps = {
 
 ### 2. Set up the section within the journey
 
-You can use conditional logic as normal in the `ManageListSection`.
+You can use conditional logic in the `ManageListSection` (see [Conditions](#conditions))
 
 ```js
 new Section('New Holiday', 'holiday')
@@ -94,4 +94,23 @@ router.post(
         validationErrorHandler,
         buildSave(saveDataToSession)
 );
-```
+```
+
+### Conditions
+
+The usual conditions can be used in a `ManageListSection`. However, only answers in the `ManageListSection` will be available to check, not answers for main the journey. For example:
+
+```js
+new Section('New Holiday', 'holiday')
+        .addQuestion(questions.holidayDestination)
+        // add a manage list question like any other, but include the `ManageListSection` as well
+        .addQuestion(
+                questions.holidayActivitiesList,
+                new ManageListSection()
+                        .addQuestion(questions.holidayActivityType)
+                        .addQuestion(questions.holidayActivityDate)
+                        .withCondition(whenQuestionHasAnswer(questions.holidayActivityType, 'swimming'))
+        )
+        .addQuestion(questions.departureDate)
+        .addQuestion(questions.holidayPeriod)
+```

package/src/components/manage-list/index.njk

@@ -31,12 +31,12 @@
                             <dd class="govuk-summary-list__actions">
                                 <ul class="govuk-summary-list__actions-list">
                                     <li class="govuk-summary-list__actions-list-item">
-                                        <a class="govuk-link" href="{{ originalUrl }}/edit/{{ item.id }}/{{ question.firstQuestionUrl }}">
+                                        <a class="govuk-link" href="{{ util.trimTrailingSlash(originalUrl) }}/edit/{{ item.id }}/{{ question.firstQuestionUrl }}">
                                             Change <span class="govuk-visually-hidden">{{ titleSingular }} {{ loop.index }}</span>
                                         </a>
                                     </li>
                                     <li class="govuk-summary-list__actions-list-item">
-                                        <a class="govuk-link" href="{{ originalUrl }}/remove/{{ item.id }}/confirm">
+                                        <a class="govuk-link" href="{{ util.trimTrailingSlash(originalUrl) }}/remove/{{ item.id }}/confirm">
                                             Remove <span class="govuk-visually-hidden">{{ titleSingular }} {{ loop.index }}</span>
                                         </a>
                                     </li>
@@ -47,7 +47,7 @@
                 </dl>
 
                 <p class="govuk-body">
-                    <a href="{{ originalUrl }}/{{ question.addAnotherLink }}" class="govuk-link">Add another</a>
+                    <a href="{{ util.trimTrailingSlash(originalUrl) }}/{{ question.addAnotherLink }}" class="govuk-link">Add another</a>
                 </p>
 
                 {{ govukButton({

package/src/components/manage-list/question.js

@@ -73,17 +73,29 @@ export default class ManageListQuestion extends Question {
 		const mockJourney = {
 			getCurrentQuestionUrl() {}
 		};
-		return this.section.questions.map((q) => {
-			const formatted = q
-				.formatAnswerForSummary('', mockJourney, answer[q.fieldName])
-				.map((a) => a.value)
-				.join(', ');
+		return (
+			this.section.questions
+				// only show questions which should be displayed based on any conditional logic
+				.filter((q) => q.shouldDisplay({ answers: answer }))
+				.map((q) => {
+					const formatted = q
+						.formatAnswerForSummary('', mockJourney, answer[q.fieldName])
+						.map((a) => a.value)
+						.join(', ');
 
-			return {
-				question: q.title,
-				answer: formatted
-			};
-		});
+					return {
+						question: q.title,
+						answer: formatted
+					};
+				})
+		);
+	}
+
+	async getDataToSave(req, journeyResponse) {
+		let responseToSave = { answers: {} };
+		const data = journeyResponse.answers[this.fieldName];
+		responseToSave.answers[this.fieldName] = data || [];
+		return responseToSave;
 	}
 
 	formatAnswerForSummary(sectionSegment, journey, answer) {

package/src/components/manage-list/utils.js

@@ -0,0 +1,14 @@
+/**
+ *
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @param {import('./question.js')} manageListQuestion
+ * @param {string} manageListItemId
+ * @returns {Record<string, unknown>}
+ */
+export function answerObjectForManageList(response, manageListQuestion, manageListItemId) {
+	const answers = response.answers[manageListQuestion.fieldName];
+	if (!Array.isArray(answers)) {
+		return {};
+	}
+	return answers.find((a) => a.id === manageListItemId) || {};
+}

package/src/components/manage-list/utils.test.js

@@ -0,0 +1,47 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { answerObjectForManageList } from '#src/components/manage-list/utils.js';
+
+describe('manage-list-utils', () => {
+	describe('answerObjectForManageList', () => {
+		it('should return the manage list item object for manage list questions', () => {
+			const manageListQuestion = {
+				fieldName: 'manageListQuestion'
+			};
+			const answers = {
+				id: '1',
+				myField: 'my-value'
+			};
+			const journeyResponse = {
+				answers: {
+					manageListQuestion: [answers]
+				}
+			};
+			const manageListItemId = '1';
+			const got = answerObjectForManageList(journeyResponse, manageListQuestion, manageListItemId);
+			assert.strictEqual(got, answers);
+		});
+
+		it('should fallback to {} if manage list item id not found', () => {
+			const manageListQuestion = {
+				fieldName: 'manageListQuestion'
+			};
+			const answers = {
+				id: '2',
+				myField: 'my-value'
+			};
+			const journeyResponse = {
+				answers: {
+					manageListQuestion: [answers]
+				}
+			};
+			const manageListItemId = '1';
+			let got = answerObjectForManageList(journeyResponse, manageListQuestion, manageListItemId);
+			assert.deepStrictEqual(got, {});
+			// also fallback to {} if there is no manageListQuestion answer
+			delete journeyResponse.answers.manageListQuestion;
+			got = answerObjectForManageList(journeyResponse, manageListQuestion, manageListItemId);
+			assert.deepStrictEqual(got, {});
+		});
+	});
+});

package/src/components/utils/question-has-answer.js

@@ -1,7 +1,10 @@
-/** @typedef {import('../../journey/journey-response').JourneyResponse} JourneyResponse */
-/** @typedef {import('../../questions/question').Question} Question */
+/** @typedef {[any, unknown][]} QuestionKeyTuples */
+/** @typedef {(questionKeyTuples: QuestionKeyTuples) => boolean} CombinationFunc */
 
-/** @type {(response: JourneyResponse) => {and: (questionKeyTuples: [any, unknown][]) => boolean, or: (questionKeyTuples: [any, unknown][]) => boolean}} */
+/**
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @returns {{and: CombinationFunc, or: CombinationFunc}}
+ */
 export const logicalCombinations = (response) => ({
 	and: (questionKeyTuples) =>
 		questionKeyTuples.every((questionKeyTuple) => questionHasAnswer(response, ...questionKeyTuple)),
@@ -9,8 +12,28 @@ export const logicalCombinations = (response) => ({
 		questionKeyTuples.some((questionKeyTuple) => questionHasAnswer(response, ...questionKeyTuple))
 });
 
-// TODO Make a type for all the question classes and use it here
-/** @type {(response: JourneyResponse, question: any, expectedValue: unknown) => boolean} */
+/**
+ * A wrapper around questionHasAnswer to use as a condition directly
+ *
+ * @example
+ * .withCondition(whenQuestionHasAnswer(question.q1, 'answer-1'))
+ *
+ * @param {import('#question').Question} question
+ * @param {unknown} expectedValue
+ * @returns {import('#src/section.js').QuestionCondition}
+ */
+export const whenQuestionHasAnswer = (question, expectedValue) => {
+	return (response) => questionHasAnswer(response, question, expectedValue);
+};
+
+/**
+ * Does the question have the expected answer?
+ *
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @param {import('#question').Question|{optionJoinString: string}} question
+ * @param {unknown} expectedValue
+ * @returns {boolean}
+ */
 export const questionHasAnswer = (response, question, expectedValue) => {
 	if (!response.answers) return false;
 	const answerField = response.answers[question.fieldName];
@@ -46,8 +69,13 @@ export const questionArrayMeetsCondition = (response, question, conditionFn = ()
 	return false;
 };
 
-// TODO Make a type for all the question classes and use it here
-/** @type {(response: JourneyResponse, questionKeyTuples: [any, unknown][], options?: {logicalCombinator: 'and' | 'or'}) => boolean} */
+/**
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @param {QuestionKeyTuples} questionKeyTuples
+ * @param {Object} [options]
+ * @param {'and' | 'or'} options.logicalCombinator
+ * @returns {boolean}
+ */
 export const questionsHaveAnswers = (
 	response,
 	questionKeyTuples,
@@ -58,16 +86,22 @@ export const questionsHaveAnswers = (
 	return combinators[logicalCombinator](questionKeyTuples);
 };
 
-// TODO Make a type for all the question classes and use it here
-/** @type {(response: JourneyResponse, question: any) => boolean} */
+/**
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @param {import('#question').Question} question
+ * @returns {boolean}
+ */
 export const questionHasNonEmptyStringAnswer = (response, question) => {
 	if (!response.answers) return false;
 	const answerField = response.answers[question.fieldName];
 	return typeof answerField === 'string' && answerField.trim().length > 0;
 };
 
-// TODO Make a type for all the question classes and use it here
-/** @type {(response: JourneyResponse, question: any) => boolean} */
+/**
+ * @param {import('#src/journey/journey-response.js').JourneyResponse} response
+ * @param {import('#question').Question} question
+ * @returns {boolean}
+ */
 export const questionHasNonEmptyNumberAnswer = (response, question) => {
 	if (!response.answers) return false;
 	const answerField = response.answers[question.fieldName];

package/src/components/utils/question-utils.js

@@ -1,7 +1,3 @@
-/**
- * @typedef {import('../../journey/journey-response').JourneyResponse} JourneyResponse
- */
-
 export function getConditionalFieldName(parentField, conditionalField) {
 	return `${parentField}_${conditionalField}`;
 }
@@ -12,44 +8,14 @@ export function getConditionalAnswer(answers, question, answer) {
 }
 
 /**
- * @param {JourneyResponse} journeyResponse
- * @param {string} fieldName
- */
-export function getAddressesForQuestion(journeyResponse, fieldName) {
-	const addresses = journeyResponse.answers?.SubmissionAddress || [];
-
-	return addresses.filter((address) => address.fieldName === fieldName);
-}
-
-/**
- * @param {JourneyResponse} journeyResponse
- * @param {string} fieldName
+ * @param {unknown} conditional
+ * @returns {conditional is {html: string}}
  */
-export function getLinkedCasesForQuestion(journeyResponse, fieldName) {
-	const linkedCases = journeyResponse.answers?.SubmissionLinkedCase || [];
-
-	return linkedCases.filter((linkedCase) => linkedCase.fieldName === fieldName);
-}
-
-/**
- * @param {JourneyResponse} journeyResponse
- * @param {string} fieldName
- */
-export function getListedBuildingForQuestion(journeyResponse, fieldName) {
-	const listedBuildings = journeyResponse.answers?.SubmissionListedBuilding || [];
-
-	return listedBuildings.filter((listedBuilding) => listedBuilding.fieldName === fieldName);
-}
-
-/** @type {(conditional: unknown) => conditional is { html: string }} */
 export function conditionalIsJustHTML(conditional) {
 	return !!conditional && Object.hasOwn(conditional, 'html') && Object.keys(conditional).length === 1;
 }
 
 export default {
-	getAddressesForQuestion,
 	getConditionalAnswer,
-	getConditionalFieldName,
-	getListedBuildingForQuestion,
-	getLinkedCasesForQuestion
+	getConditionalFieldName
 };

package/src/controller.js

@@ -184,6 +184,8 @@ export async function question(req, res) {
  * @property {import('express').Response} res
  * @property {string} journeyId
  * @property {string} referenceId
+ * @property {boolean} isManageListItem
+ * @property {string} [manageListQuestionFieldName]
  * @property {Object<string, any>} data
  */
 
@@ -234,6 +236,8 @@ export function buildSave(saveData, redirectToTaskListOnSuccess) {
 				res,
 				journeyId: journeyResponse.journeyId,
 				referenceId: journeyResponse.referenceId,
+				isManageListItem: question.isInManageListSection,
+				manageListQuestionFieldName: manageListQuestion?.fieldName,
 				data
 			});
 

package/src/controller.test.js

@@ -386,6 +386,8 @@ describe('dynamic-form/controller', () => {
 					res,
 					journeyId: journeyParams.journeyId,
 					referenceId: journeyParams.referenceId,
+					isManageListItem: undefined,
+					manageListQuestionFieldName: undefined,
 					data: undefined
 				}
 			]);
@@ -443,7 +445,9 @@ describe('dynamic-form/controller', () => {
 						res,
 						journeyId: journeyParams.journeyId,
 						referenceId: journeyParams.referenceId,
-						data: undefined
+						data: undefined,
+						isManageListItem: undefined,
+						manageListQuestionFieldName: undefined
 					}
 				],
 				'save data args'

package/src/journey/journey.js

@@ -269,6 +269,7 @@ export class Journey {
 					response: this.response,
 					manageListQuestion,
 					takeNextQuestion,
+					routeParams: params,
 					reverse
 				});
 				if (question === END_OF_SECTION) {

package/src/lib/session-answer-store.js

@@ -35,11 +35,12 @@ import { booleanToYesNoValue } from '../components/boolean/question.js';
  *
  *
  * @param {Object} opts
- * @param {string} [opts.reqParam] - optional request parameter to use as a key
+ * @param {string} [opts.reqParam]
+ * - optional request parameter to use as a key
  * @returns {import('../controller').SaveDataFn}
  */
 export function buildSaveDataToSession({ reqParam } = {}) {
-	return async ({ req, journeyId, data }) => {
+	return async ({ req, journeyId, data, isManageListItem, manageListQuestionFieldName }) => {
 		if (!req.session) {
 			throw new Error('request session required');
 		}
@@ -50,8 +51,16 @@ export function buildSaveDataToSession({ reqParam } = {}) {
 			// key by a further param
 			forms = forms[reqParamValue] || (forms[reqParamValue] = {});
 		}
-		const answers = forms[journeyId] || (forms[journeyId] = {});
+		let answers = forms[journeyId] || (forms[journeyId] = {});
+		if (isManageListItem) {
+			const answersList = answers[manageListQuestionFieldName] || (answers[manageListQuestionFieldName] = []);
+			answers = answersList.find((item) => item.id === req.params.manageListItemId);
 
+			if (!answers) {
+				answers = { id: req.params.manageListItemId };
+				answersList.push(answers);
+			}
+		}
 		for (const [k, v] of Object.entries(data?.answers || {})) {
 			answers[k] = v;
 		}

package/src/lib/session-answer-store.test.js

@@ -80,6 +80,48 @@ describe('session-answer-store', () => {
 				}
 			});
 		});
+		it('should add a new managed list item when not present in the session', async () => {
+			const req = mockReq();
+			req.params = { manageListItemId: '12345' };
+			req.session = {};
+			const journeyId = 'j-1';
+			const data = { answers: { q1: 'a1' } };
+			const isManageListItem = true;
+			const manageListQuestionFieldName = 'myManagedList';
+			const saveDataToSession = buildSaveDataToSession();
+			await saveDataToSession({ req, journeyId, data, isManageListItem, manageListQuestionFieldName });
+			assert.deepStrictEqual(req.session, {
+				forms: {
+					'j-1': {
+						myManagedList: [{ id: '12345', q1: 'a1' }]
+					}
+				}
+			});
+		});
+		it('should add to an existing managed list item using the id when present in the session', async () => {
+			const req = mockReq();
+			req.params = { manageListItemId: '12345' };
+			req.session = {
+				forms: {
+					'j-1': {
+						myManagedList: [{ id: '12345', q1: 'old value' }]
+					}
+				}
+			};
+			const journeyId = 'j-1';
+			const data = { answers: { q2: 'a1' } };
+			const isManageListItem = true;
+			const manageListQuestionFieldName = 'myManagedList';
+			const saveDataToSession = buildSaveDataToSession();
+			await saveDataToSession({ req, journeyId, data, isManageListItem, manageListQuestionFieldName });
+			assert.deepStrictEqual(req.session, {
+				forms: {
+					'j-1': {
+						myManagedList: [{ id: '12345', q1: 'old value', q2: 'a1' }]
+					}
+				}
+			});
+		});
 
 		it('should overwrite existing data by reqParam & journeyId', async () => {
 			const req = mockReq();

package/src/lib/utils.js

@@ -17,3 +17,14 @@ export function capitalize(str) {
 	if (typeof str !== 'string') return '';
 	return str.charAt(0).toUpperCase() + str.slice(1);
 }
+
+/**
+ * Trim a trailing slash if present
+ *
+ * @param {string} [str]
+ * @returns {string}
+ */
+export function trimTrailingSlash(str) {
+	if (typeof str !== 'string') return str;
+	return str.replace(/\/$/, '');
+}

package/src/lib/utils.test.js

@@ -0,0 +1,19 @@
+import { describe, it } from 'node:test';
+import assert from 'node:assert';
+import { trimTrailingSlash } from '#src/lib/utils.js';
+
+describe('utils', () => {
+	describe('trimTrailingSlash', () => {
+		it('should trim a trailing slash', () => {
+			assert.strictEqual(trimTrailingSlash('my-url.com/hello/'), 'my-url.com/hello');
+		});
+		it('should do nothing if no trailing slash', () => {
+			assert.strictEqual(trimTrailingSlash('my-url.com/hello'), 'my-url.com/hello');
+		});
+		it('should return non-string types', () => {
+			assert.strictEqual(trimTrailingSlash(null), null);
+			assert.strictEqual(trimTrailingSlash(undefined), undefined);
+			assert.strictEqual(trimTrailingSlash(5), 5);
+		});
+	});
+});

package/src/questions/question.js

@@ -1,9 +1,9 @@
 import escape from 'escape-html';
 import RequiredValidator from '../validator/required-validator.js';
-import RequiredFileUploadValidator from '../validator/required-file-upload-validator.js';
-import { capitalize, nl2br } from '../lib/utils.js';
+import { capitalize, nl2br, trimTrailingSlash } from '../lib/utils.js';
 import AddressValidator from '../validator/address-validator.js';
 import MultiFieldInputValidator from '../validator/multi-field-input-validator.js';
+import { answerObjectForManageList } from '#src/components/manage-list/utils.js';
 
 /**
  * @typedef {import('../validator/base-validator.js')} BaseValidator
@@ -33,6 +33,8 @@ import MultiFieldInputValidator from '../validator/multi-field-input-validator.j
  * @property {string} backLink
  * @property {boolean} showBackToListLink
  * @property {string} listLink
+ * @property {Object} util
+ * @property {function(string): string} util.trimTrailingSlash
  */
 
 /**
@@ -239,6 +241,10 @@ export class Question {
 
 			continueButtonText: this.continueButtonText,
 
+			util: {
+				trimTrailingSlash
+			},
+
 			...customViewData,
 			...this.viewData
 		};
@@ -284,12 +290,7 @@ export class Question {
 				throw new Error('no manageListQuestion for manage list question');
 			}
 			// if this is a manage list question, the response is within the 'parent' manage list answers array
-			const answers = response.answers[manageListQuestion.fieldName];
-			if (!Array.isArray(answers)) {
-				return {};
-			}
-			const itemId = params.manageListItemId;
-			return answers.find((a) => a.id === itemId) || {};
+			return answerObjectForManageList(response, manageListQuestion, params.manageListItemId);
 		}
 		return response.answers;
 	}
@@ -470,7 +471,6 @@ export class Question {
 		return this.validators?.some(
 			(item) =>
 				item instanceof RequiredValidator ||
-				item instanceof RequiredFileUploadValidator ||
 				(item instanceof AddressValidator && item.isRequired()) ||
 				(item instanceof MultiFieldInputValidator && item.isRequired())
 		);

package/src/questions/question.test.js

@@ -179,6 +179,8 @@ describe('./src/dynamic-forms/question.js', () => {
 			assert.deepStrictEqual(result.listLink, journey.taskListUrl);
 			assert.deepStrictEqual(result.journeyTitle, journey.journeyTitle);
 			assert.deepStrictEqual(result.hello, 'hi');
+			assert.ok(result.util);
+			assert.ok(typeof result.util.trimTrailingSlash === 'function');
 		});
 		it('should include viewData in viewModel', () => {
 			const question = getTestQuestion({ viewData: { test: 'data' } });

package/src/section-types.d.ts

@@ -1,6 +1,7 @@
 import { JourneyResponse } from '#src/journey/journey-response.js';
 import ManageListQuestion from '#src/components/manage-list/question.js';
 import { Question } from '#src/questions/question.js';
+import { RouteParams } from '#src/journey/journey-types.d.ts';
 
 export interface GetNextQuestionParams {
 	questionFieldName: string;
@@ -8,6 +9,7 @@ export interface GetNextQuestionParams {
 	// if this is part of a manage list section
 	manageListQuestion?: ManageListQuestion;
 	takeNextQuestion: boolean;
+	routeParams: RouteParams;
 	// to get previous question instead of next
 	reverse: boolean;
 }

package/src/section.js

@@ -5,6 +5,7 @@
  */
 
 import RequiredValidator from './validator/required-validator.js';
+import { answerObjectForManageList } from '#src/components/manage-list/utils.js';
 
 /**
  * A value indicating the final question of a section has been reached
@@ -203,11 +204,14 @@ export class Section {
 	 * @returns {Question|Symbol|null}
 	 */
 	getNextQuestion(params) {
-		const { manageListQuestion } = params;
+		const { response, manageListQuestion, routeParams } = params;
 		if (manageListQuestion) {
 			// first check if the next question is within the manage list section
+			// here we get the answers for the manage list item for the question.shouldDisplay logic
+			const answers = answerObjectForManageList(response, manageListQuestion, routeParams.manageListItemId);
 			const next = Section.getNextQuestion({
 				...params,
+				response: { answers },
 				questions: manageListQuestion.section.questions
 			});
 			if (next === END_OF_SECTION) {