diff --git a/src/entities/activity/ui/items/ActionPlan/ResponseSegment.tsx b/src/entities/activity/ui/items/ActionPlan/ResponseSegment.tsx index 38594c01..357726f8 100644 --- a/src/entities/activity/ui/items/ActionPlan/ResponseSegment.tsx +++ b/src/entities/activity/ui/items/ActionPlan/ResponseSegment.tsx @@ -65,6 +65,14 @@ export const ResponseSegment = ({ phrasalData, field, isAtStart }: ResponseSegme words = isAnswersSkipped(fieldPhrasalData.values) ? [t('questionSkipped')] : fieldPhrasalData.values.map(transformValue); + } else if (fieldPhrasalDataType === 'paragraph') { + words = isAnswersSkipped(fieldPhrasalData.values) + ? [t('questionSkipped')] + : fieldPhrasalData.values + .flatMap((value) => value.split(/\r?\n+/)) // Split each paragraph by newlines + .map((sentence) => sentence.trim()) // Trim whitespace around each sentence + .filter((sentence) => sentence.length > 0) // Filter out any empty strings + .map(transformValue); // Transform each sentence individually } else if (fieldPhrasalDataType === 'indexed-array') { const indexedAnswers = fieldPhrasalData.values[field.itemIndex] || []; words = isAnswersSkipped(indexedAnswers) @@ -118,32 +126,52 @@ export const ResponseSegment = ({ phrasalData, field, isAtStart }: ResponseSegme return ( - {fieldDisplayMode === 'bullet_list' || - fieldDisplayMode === 'bullet_list_option_row' || - fieldDisplayMode === 'bullet_list_text_row' ? ( - <> - {isAtStart ? null : ( - -   -
-
- )} - - {words.map((item, index) => ( -
  • {item}
  • - ))} -
    - - ) : ( - <> - {isAtStart ? '' : ' '} - {joinSentenceWords(words)} - - )} + {(() => { + if ( + fieldDisplayMode === 'bullet_list' || + fieldDisplayMode === 'bullet_list_option_row' || + fieldDisplayMode === 'bullet_list_text_row' + ) { + return ( + <> + {isAtStart ? null : ( + +   +
    +
    + )} + + {words.map((item, index) => ( +
  • {item}
  • + ))} +
    + + ); + } else if (fieldPhrasalDataType === 'paragraph') { + return ( + <> + {isAtStart ? '' : ' '} + {words.map((item, index) => ( + + {item} + {index < words.length - 1 &&
    }{' '} +
    + ))} + + ); + } else { + return ( + <> + {isAtStart ? '' : ' '} + {joinSentenceWords(words)} + + ); + } + })()}
    ); }; diff --git a/src/entities/activity/ui/items/ActionPlan/phrasalData.ts b/src/entities/activity/ui/items/ActionPlan/phrasalData.ts index b268ba39..cb8cba5f 100644 --- a/src/entities/activity/ui/items/ActionPlan/phrasalData.ts +++ b/src/entities/activity/ui/items/ActionPlan/phrasalData.ts @@ -1,3 +1,4 @@ +/* eslint-disable prettier/prettier */ import { phrasalTemplateCompatibleResponseTypes } from '~/abstract/lib/constants'; import { ActivityItemType } from '~/entities/activity/lib'; import { ItemRecord } from '~/entities/applet/model'; @@ -23,6 +24,8 @@ type ActivityPhrasalBaseData< type ActivityPhrasalArrayFieldData = ActivityPhrasalBaseData<'array', string[]>; +type ActivityPhrasalParagraphFieldData = ActivityPhrasalBaseData<'paragraph', string[]>; + type ActivityPhrasalItemizedArrayValue = Record; type ActivityPhrasalIndexedArrayFieldData = ActivityPhrasalBaseData< @@ -45,7 +48,8 @@ type ActivityPhrasalMatrixFieldData = ActivityPhrasalBaseData<'matrix', Activity type ActivityPhrasalData = | ActivityPhrasalArrayFieldData | ActivityPhrasalIndexedArrayFieldData - | ActivityPhrasalMatrixFieldData; + | ActivityPhrasalMatrixFieldData + | ActivityPhrasalParagraphFieldData; export type ActivitiesPhrasalData = Record; @@ -84,8 +88,7 @@ export const extractActivitiesPhrasalData = (items: ItemRecord[]): ActivitiesPhr } else if ( item.responseType === 'numberSelect' || item.responseType === 'slider' || - item.responseType === 'text' || - item.responseType === 'paragraphText' + item.responseType === 'text' ) { const dateFieldData: ActivityPhrasalArrayFieldData = { type: 'array', @@ -93,6 +96,13 @@ export const extractActivitiesPhrasalData = (items: ItemRecord[]): ActivitiesPhr context: fieldDataContext, }; fieldData = dateFieldData; + } else if (item.responseType === 'paragraphText') { + const dateFieldData: ActivityPhrasalParagraphFieldData = { + type: 'paragraph', + values: item.answer.map((value) => value || ''), + context: fieldDataContext, + }; + fieldData = dateFieldData; } else if (item.responseType === 'singleSelect' || item.responseType === 'multiSelect') { const dateFieldData: ActivityPhrasalArrayFieldData = { type: 'array',