PR comments

Author: lumburovskalina

src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx

@@ -45,7 +45,7 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
             setRequestedSomething(false);
             props.setEnabledButton(false);
             setRunOn10HasError(sampleRecordsFinal.calculatedAttributes.length > 0 ? false : true);
-            if (currentAttributesRef.current.dataType == DataTypeEnum.EMBEDDING_LIST) {
+            if (currentAttributesRef.current.dataType == DataTypeEnum.EMBEDDING_LIST || currentAttributesRef.current.dataType == DataTypeEnum.TEXT_LIST) {
                 sampleRecordsFinal.calculatedAttributesList = sampleRecordsFinal.calculatedAttributes.map((record: string) => JSON.parse(record));
                 sampleRecordsFinal.calculatedAttributesListDisplay = extendArrayElementsByUniqueId(sampleRecordsFinal.calculatedAttributesList);
             }
@@ -76,12 +76,9 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
         if (sampleRecords && sampleRecords.calculatedAttributesDisplay) {
             return sampleRecords.calculatedAttributesDisplay.map((record: any, index) => {
                 let calculatedValue;
-                if (currentAttributesRef.current.dataType == DataTypeEnum.EMBEDDING_LIST) {
+                if (currentAttributesRef.current.dataType == DataTypeEnum.EMBEDDING_LIST || currentAttributesRef.current.dataType == DataTypeEnum.TEXT_LIST) {
                     calculatedValue = { id: record.id, value: JSON.parse(record.value) };
                 }
-                if (currentAttributesRef.current.dataType == DataTypeEnum.TEXT_LIST) {
-                    calculatedValue = { id: record.id, value: JSON.stringify(record) };
-                }
                 else {
                     calculatedValue = record
                 }
@@ -144,7 +141,7 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
                                 <div key={record.id} className="divide-y divide-gray-200 bg-white">
                                     <div className="flex-shrink-0 border-b border-gray-200 shadow-sm flex justify-between items-center">
                                         <div className="flex items-center text-xs leading-5 text-gray-500 font-normal mx-4 my-3 text-justify">
-                                            {String(record?.calculatedValue?.value)}
+                                            {Array.isArray(record?.calculatedValue?.value) ? JSON.stringify(record?.calculatedValue?.value) : String(record?.calculatedValue?.value)}
                                         </div>
                                         <div className="flex items-center justify-center mr-5 ml-auto">
                                             <KernButton

src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx

@@ -6,11 +6,19 @@ import style from '@/src/styles/components/projects/projectId/attribute-calculat
 import { RecordDisplay } from "@/src/components/shared/record-display/RecordDisplay";
 import { ViewRecordDetailsModalProps } from "@/src/types/components/projects/projectId/settings/attribute-calculation";
 import { selectVisibleAttributesHeuristics } from "@/src/reduxStore/states/pages/settings";
+import { useMemo } from "react";
 
 export default function ViewRecordDetailsModal(props: ViewRecordDetailsModalProps) {
     const modalViewRecordDetails = useSelector(selectModal(ModalEnum.VIEW_RECORD_DETAILS));
     const attributes = useSelector(selectVisibleAttributesHeuristics);
 
+    const displayValue = useMemo(() => {
+        if (!props.sampleRecords || !modalViewRecordDetails.open) return null;
+        return Array.isArray(props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value)
+            ? JSON.stringify(props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value)
+            : String(props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value);
+    }, [props.sampleRecords, modalViewRecordDetails.recordIdx, modalViewRecordDetails.open]);
+
     return (<>
         {modalViewRecordDetails.open && modalViewRecordDetails.record && props.sampleRecords && <>
             <Modal modalName={ModalEnum.VIEW_RECORD_DETAILS} className="md:max-w-5xl">
@@ -23,7 +31,7 @@ export default function ViewRecordDetailsModal(props: ViewRecordDetailsModalProp
                     <div className="text-sm leading-5 text-left text-gray-900 font-medium">Calculated value</div>
                     <div className="text-sm leading-5 text-left text-gray-500 font-normal whitespace-pre-line">
                         <div className="flex flex-col gap-y-2 divide-y">
-                            {props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value}
+                            {displayValue}
                         </div>
                     </div>
                 </div>