From e50b8b2b70aa5b73e2f4130f2c7c7f90884336f6 Mon Sep 17 00:00:00 2001
From: LennartSchmidtKern <lennart.schmidt@kern.ai>
Date: Tue, 22 Jul 2025 18:21:24 +0200
Subject: [PATCH 01/11] text list attribute

---
 .../attributes/attributeId/ExecutionContainer.tsx  | 14 +++++++++++---
 src/types/shared/general.ts                        |  1 +
 .../projectId/settings/data-schema-helper.ts       |  1 +
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx b/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx
index 70c461c6..de65513a 100644
--- a/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx
+++ b/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx
@@ -75,7 +75,16 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
     const sampleRecordsFinal = useMemo(() => {
         if (sampleRecords && sampleRecords.calculatedAttributesDisplay) {
             return sampleRecords.calculatedAttributesDisplay.map((record: any, index) => {
-                const calculatedValue = currentAttributesRef.current.dataType != DataTypeEnum.EMBEDDING_LIST ? record : { id: record.id, value: JSON.parse(record.value) }
+                let calculatedValue;
+                if (currentAttributesRef.current.dataType == DataTypeEnum.EMBEDDING_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
+                }
                 return {
                     ...record,
                     onClick: viewRecordDetails(index),
@@ -85,7 +94,6 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
             );
         }
     }, [sampleRecords]);
-
     return (<div>
         <div className="mt-8 text-sm leading-5">
             <div className="text-gray-700 font-medium mr-2">
@@ -136,7 +144,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.value)}
+                                            {String(record?.calculatedValue?.value)}
                                         </div>
                                         <div className="flex items-center justify-center mr-5 ml-auto">
                                             <KernButton
diff --git a/src/types/shared/general.ts b/src/types/shared/general.ts
index 75ae07ee..083cdee0 100644
--- a/src/types/shared/general.ts
+++ b/src/types/shared/general.ts
@@ -22,4 +22,5 @@ export enum DataTypeEnum {
     EMBEDDING_LIST = "EMBEDDING_LIST",
     LLM_RESPONSE = "LLM_RESPONSE",
     PERMISSION = "PERMISSION",
+    TEXT_LIST = "TEXT_LIST",
 }
\ No newline at end of file
diff --git a/src/util/components/projects/projectId/settings/data-schema-helper.ts b/src/util/components/projects/projectId/settings/data-schema-helper.ts
index def7053a..c1d979bf 100644
--- a/src/util/components/projects/projectId/settings/data-schema-helper.ts
+++ b/src/util/components/projects/projectId/settings/data-schema-helper.ts
@@ -11,6 +11,7 @@ export const DATA_TYPES = [
     { name: 'Embedding List', value: 'EMBEDDING_LIST' },
     { name: 'LLM Response', value: 'LLM_RESPONSE' },
     { name: 'Permission', value: 'PERMISSION' },
+    { name: 'Text List', value: 'TEXT_LIST' }
 ];
 
 export const ATTRIBUTES_VISIBILITY_STATES = [

From e07520a34557ece8fdcdfc9853a1bdad1e3d56b4 Mon Sep 17 00:00:00 2001
From: LennartSchmidtKern <lennart.schmidt@kern.ai>
Date: Wed, 23 Jul 2025 14:29:37 +0200
Subject: [PATCH 02/11] display list

---
 src/components/shared/record-display/RecordDisplay.tsx | 2 +-
 src/util/classes/attribute-calculation.ts              | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/shared/record-display/RecordDisplay.tsx b/src/components/shared/record-display/RecordDisplay.tsx
index 6af65606..0f41aee3 100644
--- a/src/components/shared/record-display/RecordDisplay.tsx
+++ b/src/components/shared/record-display/RecordDisplay.tsx
@@ -33,7 +33,7 @@ export function RecordDisplay(props: any) {
                 </div>
             </div>
             {attributesDict[attribute.id] && <div className="text-gray-800 text-sm mb-4 overflow-anywhere flex text-left">
-                {attribute.dataType === DataTypeEnum.EMBEDDING_LIST || attribute.dataType === DataTypeEnum.PERMISSION ? (<div className="flex flex-col gap-y-1 divide-y">
+                {attribute.dataType === DataTypeEnum.EMBEDDING_LIST || attribute.dataType === DataTypeEnum.PERMISSION || attribute.dataType === DataTypeEnum.TEXT_LIST ? (<div className="flex flex-col gap-y-1 divide-y">
                     {preparedRecord.data[attributesDict[attribute.key].name] ? preparedRecord.data[attributesDict[attribute.key].name].map((item, indexJ) => (<div key={indexJ} className="pt-1">
                         {(configuration.highlightText && isTextHighlightNeeded[attribute.key]) ? (<Highlight text={item.toString()}
                             additionalClasses={[configuration.lineBreaks == LineBreaksType.NORMAL ? '' : (configuration.lineBreaks == LineBreaksType.IS_PRE_WRAP ? 'whitespace-pre-wrap' : 'whitespace-pre-line')]}
diff --git a/src/util/classes/attribute-calculation.ts b/src/util/classes/attribute-calculation.ts
index e800c099..39e69e65 100644
--- a/src/util/classes/attribute-calculation.ts
+++ b/src/util/classes/attribute-calculation.ts
@@ -57,6 +57,11 @@ async def ac(record):
 
     llm_response = await get_llm_response()
     return llm_response.get("result") or "no result provided"
+                    `
+                    }
+                    case DataTypeEnum.TEXT_LIST: return {
+                        code: `def ac(record):
+    return ["Hello World"]
                     `
                     }
                     default: return {

From 82a1c65de3f2958afc687539d1ec0e86f27d6e55 Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Wed, 23 Jul 2025 16:39:43 +0200
Subject: [PATCH 03/11] Added color for the new ac type

---
 .../components/projects/projectId/settings/data-schema-helper.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/util/components/projects/projectId/settings/data-schema-helper.ts b/src/util/components/projects/projectId/settings/data-schema-helper.ts
index c1d979bf..6fc9ff1a 100644
--- a/src/util/components/projects/projectId/settings/data-schema-helper.ts
+++ b/src/util/components/projects/projectId/settings/data-schema-helper.ts
@@ -55,6 +55,7 @@ export function getColorForDataType(dataType): string {
         case DataTypeEnum.FLOAT: return 'purple';
         case DataTypeEnum.EMBEDDING_LIST: return 'rose';
         case DataTypeEnum.LLM_RESPONSE: return 'emerald';
+        case DataTypeEnum.TEXT_LIST: return 'blue';
         default: return 'gray';
     }
 }

From 67d81a74536187c8c8d30549414d20afeead248f Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Mon, 28 Jul 2025 17:47:43 +0200
Subject: [PATCH 04/11] Added text list to data browser

---
 .../attributeId/LLM/LLMPlaygroundModal.tsx         |  2 +-
 .../attributeId/ViewRecordDetailsModal.tsx         |  9 ++-------
 .../projectId/data-browser/DataBrowser.tsx         | 14 +++++++-------
 .../projectId/data-browser/SearchGroups.tsx        | 14 ++++++++++++--
 .../projectId/data-browser/data-browser-helper.ts  |  6 +++++-
 5 files changed, 27 insertions(+), 18 deletions(-)

diff --git a/src/components/projects/projectId/attributes/attributeId/LLM/LLMPlaygroundModal.tsx b/src/components/projects/projectId/attributes/attributeId/LLM/LLMPlaygroundModal.tsx
index 13314807..8fddc8c4 100644
--- a/src/components/projects/projectId/attributes/attributeId/LLM/LLMPlaygroundModal.tsx
+++ b/src/components/projects/projectId/attributes/attributeId/LLM/LLMPlaygroundModal.tsx
@@ -155,7 +155,7 @@ export default function LLMPlaygroundModal() {
                     <div className="grid grid-cols-2 gap-2 text-sm max-h-52 overflow-y-auto" style={{ gridTemplateColumns: `max-content auto` }}>
                         {recordKeys.map((rk) => <Fragment key={rk.name}>
                             <label className="block font-bold text-gray-900">{rk.name}</label>
-                            {recordData.map((record) => rk.dataType == DataTypeEnum.EMBEDDING_LIST ? <div key={record.running_id} className="flex flex-col divide-y divide-gray-200">
+                            {recordData.map((record) => (rk.dataType == DataTypeEnum.EMBEDDING_LIST || rk.dataType == DataTypeEnum.TEXT_LIST) ? <div key={record.running_id} className="flex flex-col divide-y divide-gray-200">
                                 {record[rk.name].map((li, idx) => <span key={idx} className="text-gray-700">{li}</span>)}
                             </div> : <span key={record.running_id} className="text-gray-700">{record[rk.name]}</span>)}
                         </Fragment>)}
diff --git a/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx b/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx
index 007be4cd..1b0349b5 100644
--- a/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx
+++ b/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx
@@ -4,7 +4,6 @@ import { ModalEnum } from "@/src/types/shared/modal";
 import { useSelector } from "react-redux";
 import style from '@/src/styles/components/projects/projectId/attribute-calculation.module.css';
 import { RecordDisplay } from "@/src/components/shared/record-display/RecordDisplay";
-import { DataTypeEnum } from "@/src/types/shared/general";
 import { ViewRecordDetailsModalProps } from "@/src/types/components/projects/projectId/settings/attribute-calculation";
 import { selectVisibleAttributesHeuristics } from "@/src/reduxStore/states/pages/settings";
 
@@ -23,13 +22,9 @@ export default function ViewRecordDetailsModal(props: ViewRecordDetailsModalProp
                         record={modalViewRecordDetails.record} />
                     <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">
-                        {props.currentAttribute.dataType != DataTypeEnum.EMBEDDING_LIST ? <span>
+                        <div className="flex flex-col gap-y-2 divide-y">
                             {props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value}
-                        </span> : <div className="flex flex-col gap-y-2 divide-y">
-                            {props.sampleRecords[modalViewRecordDetails.recordIdx].calculatedValue.value.map((item: any) => <span key={item} className="mt-1">
-                                {item}
-                            </span>)}
-                        </div>}
+                        </div>
                     </div>
                 </div>
             </Modal>
diff --git a/src/components/projects/projectId/data-browser/DataBrowser.tsx b/src/components/projects/projectId/data-browser/DataBrowser.tsx
index 48ed77ae..9e66e1aa 100644
--- a/src/components/projects/projectId/data-browser/DataBrowser.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowser.tsx
@@ -48,9 +48,15 @@ export default function DataBrowser() {
         refetchAttributesAndProcess();
         refetchLabelingTasksAndProcess();
         refetchEmbeddingsAndPostProcess();
-        refetchUniqueValuesAndProcess();
     }, [projectId, users, user]);
 
+    useEffect(() => {
+        if (!attributes || attributes.length == 0 || !projectId) return;
+        getUniqueValuesByAttributes(projectId, (res) => {
+            dispatch(setUniqueValuesDict(postProcessUniqueValues(res, attributes)));
+        });
+    }, [attributes, projectId]);
+
     useEffect(() => {
         if (!projectId || !labelingTasks || !recordList) return;
         refetchRecordCommentsAndProcess(recordList);
@@ -140,12 +146,6 @@ export default function DataBrowser() {
         setSearchRequest({ offset: searchRequest.offset + searchRequest.limit, limit: searchRequest.limit });
     }
 
-    function refetchUniqueValuesAndProcess() {
-        getUniqueValuesByAttributes(projectId, (res) => {
-            dispatch(setUniqueValuesDict(postProcessUniqueValues(res, attributes)));
-        });
-    }
-
     const setSearchRequestToInit = useCallback(() => {
         setSearchRequest(SEARCH_REQUEST);
     }, []);
diff --git a/src/components/projects/projectId/data-browser/SearchGroups.tsx b/src/components/projects/projectId/data-browser/SearchGroups.tsx
index 9c5a1b55..727fa106 100644
--- a/src/components/projects/projectId/data-browser/SearchGroups.tsx
+++ b/src/components/projects/projectId/data-browser/SearchGroups.tsx
@@ -29,6 +29,7 @@ import { getRecordsByStaticSlice, searchRecordsExtended } from "@/src/services/b
 import { staticDataSlicesCurrentCount } from "@/src/services/base/dataSlices";
 import KernButton from "@/submodules/react-components/components/kern-button/KernButton";
 import { MemoIconArrowDown, MemoIconArrowsRandom, MemoIconFilterOff, MemoIconPlus, MemoIconPointerOff, MemoIconTrash } from "@/submodules/react-components/components/kern-icons/icons";
+import { useConsoleLog } from "@/submodules/react-components/hooks/useConsoleLog";
 
 const GROUP_SORT_ORDER = 0;
 let GLOBAL_SEARCH_GROUP_COUNT = 0;
@@ -336,7 +337,14 @@ export default function SearchGroups() {
             const attributeName = formControlsIdx['name'];
             attributeType = getAttributeType(attributesSortOrder, attributeName);
         }
-        if (attributeType !== DataTypeEnum.BOOLEAN) {
+        if (attributeType == DataTypeEnum.TEXT_LIST) {
+            operatorsCopy.push({
+                value: SearchOperator.CONTAINS.split("_").join(" "),
+            });
+            tooltipsCopy.push(getSearchOperatorTooltip(SearchOperator.CONTAINS));
+            formControlsIdx['operator'] = SearchOperator.CONTAINS;
+
+        } else if (attributeType !== DataTypeEnum.BOOLEAN) {
             for (let t of Object.values(SearchOperator)) {
                 operatorsCopy.push({
                     value: t.split("_").join(" "),
@@ -357,6 +365,8 @@ export default function SearchGroups() {
         dispatch(setFullSearchStore(fullSearchCopy));
     }
 
+    useConsoleLog(uniqueValuesDict, 'uniqueValuesDict');
+
     function removeSearchGroupItem(groupKey, index) {
         const fullSearchCopy = jsonCopy(fullSearchStore);
         fullSearchCopy[groupKey].groupElements.splice(index, 1);
@@ -622,7 +632,7 @@ export default function SearchGroups() {
                                             }
                                         </div>
                                     </div>
-                                    {uniqueValuesDict[groupItem['name']] && groupItem['operator'] != '' && groupItem['operator'] != 'BETWEEN' && groupItem['operator'] != 'IN' && groupItem['operator'] != 'IN WC' ? (
+                                    {(uniqueValuesDict[groupItem['name']] && groupItem['operator'] != '' && groupItem['operator'] != 'BETWEEN' && groupItem['operator'] != 'IN' && groupItem['operator'] != 'IN WC' || saveAttributeType == DataTypeEnum.TEXT_LIST) ? (
                                         <div className="my-2">
                                             <KernDropdown options={uniqueValuesDict[groupItem['name']]} buttonName={groupItem['searchValue'] ? groupItem['searchValue'] : 'Select value'}
                                                 selectedOption={(option: any) => selectValueDropdown(option, index, 'searchValue', group.key)} fontClass="font-dmMono" />
diff --git a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
index fe0c98a6..20ad1403 100644
--- a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
@@ -176,9 +176,13 @@ function parseUTC(utc: string, forOutlier: boolean = false) {
 export function postProcessUniqueValues(uniqueValues: any, attributesSortOrder: any) {
     const uniqueValuesDict = uniqueValues;
     for (let key in uniqueValuesDict) {
-        const attributeType = getAttributeType(attributesSortOrder, key);
+        const attributeType = attributesSortOrder.find(att => att.name == key)?.dataType;
         if (attributeType == DataTypeEnum.TEXT || attributeType == DataTypeEnum.LLM_RESPONSE) {
             delete uniqueValuesDict[key];
+        } else if (attributeType == DataTypeEnum.TEXT_LIST) {
+            uniqueValuesDict[key] = uniqueValuesDict[key].map((value: string) => {
+                return JSON.parse(value);
+            })[0];
         }
     }
     return uniqueValuesDict;

From e6e734366727e2a71690f6f8d64b44769d0def7b Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Tue, 29 Jul 2025 14:53:02 +0200
Subject: [PATCH 05/11] Clear filter fix and equal operator

---
 .../projectId/data-browser/DataBrowser.tsx    |  7 ++++--
 .../data-browser/DataBrowserRecords.tsx       |  2 +-
 .../data-browser/DataBrowserSidebar.tsx       |  8 +++----
 .../projectId/data-browser/SearchGroups.tsx   | 24 +++++++++----------
 .../settings/labeling-tasks/LabelingTasks.tsx |  1 -
 .../projectId/data-browser/data-browser.ts    | 12 ++++++++++
 .../data-browser/data-browser-helper.ts       |  3 +--
 .../data-browser/search-operators-helper.ts   |  4 ++++
 submodules/react-components                   |  2 +-
 9 files changed, 39 insertions(+), 24 deletions(-)

diff --git a/src/components/projects/projectId/data-browser/DataBrowser.tsx b/src/components/projects/projectId/data-browser/DataBrowser.tsx
index 9e66e1aa..2702ac34 100644
--- a/src/components/projects/projectId/data-browser/DataBrowser.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowser.tsx
@@ -21,10 +21,11 @@ import { getEmbeddings } from "@/src/services/base/embedding";
 import { parseFilterToExtended } from "@/src/util/components/projects/projectId/data-browser/filter-parser-helper";
 import { SearchGroup, Slice } from "@/submodules/javascript-functions/enums/enums";
 import { Application, CurrentPage } from "@/submodules/react-components/hooks/web-socket/constants";
+import { DataBrowserProps } from "@/src/types/components/projects/projectId/data-browser/data-browser";
 
 const SEARCH_REQUEST = { offset: 0, limit: 20 };
 
-export default function DataBrowser() {
+export default function DataBrowser(props: DataBrowserProps) {
     const dispatch = useDispatch();
 
     const projectId = useSelector(selectProjectId);
@@ -40,6 +41,7 @@ export default function DataBrowser() {
     const activeSlice = useSelector(selectActiveSlice);
 
     const [searchRequest, setSearchRequest] = useState(SEARCH_REQUEST);
+    const [clearRequest, setClearRequest] = useState(false);
 
     useEffect(() => {
         if (!projectId) return;
@@ -148,6 +150,7 @@ export default function DataBrowser() {
 
     const setSearchRequestToInit = useCallback(() => {
         setSearchRequest(SEARCH_REQUEST);
+        setClearRequest(true);
     }, []);
 
     const handleWebsocketNotification = useCallback((msgParts: string[]) => {
@@ -171,7 +174,7 @@ export default function DataBrowser() {
 
     return (<>
         {projectId && <div className="flex flex-row h-full">
-            <DataBrowserSidebar />
+            <DataBrowserSidebar clearRequest={clearRequest} />
             <DataBrowserRecords refetchNextRecords={getNextRecords} clearSearchRequest={setSearchRequestToInit} />
         </div>}
     </>)
diff --git a/src/components/projects/projectId/data-browser/DataBrowserRecords.tsx b/src/components/projects/projectId/data-browser/DataBrowserRecords.tsx
index 674de9db..afc6393e 100644
--- a/src/components/projects/projectId/data-browser/DataBrowserRecords.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowserRecords.tsx
@@ -1,5 +1,5 @@
 import { openModal } from '@/src/reduxStore/states/modal';
-import { selectActiveSearchParams, selectActiveSlice, selectAdditionalData, selectRecords, selectSimilaritySearch, setActiveDataSlice, setActiveSearchParams, setIsTextHighlightNeeded, setRecordsInDisplay, setTextHighlight, updateAdditionalDataState } from '@/src/reduxStore/states/pages/data-browser';
+import { selectActiveSearchParams, selectActiveSlice, selectAdditionalData, selectRecords, selectSimilaritySearch, setActiveDataSlice, setActiveSearchParams, setFullSearchStore, setIsTextHighlightNeeded, setRecordsInDisplay, setTextHighlight, updateAdditionalDataState } from '@/src/reduxStore/states/pages/data-browser';
 import style from '@/src/styles/components/projects/projectId/data-browser.module.css';
 import { ModalEnum } from '@/src/types/shared/modal';
 import { TOOLTIPS_DICT } from '@/src/util/tooltip-constants';
diff --git a/src/components/projects/projectId/data-browser/DataBrowserSidebar.tsx b/src/components/projects/projectId/data-browser/DataBrowserSidebar.tsx
index 183c8bac..6ffeea16 100644
--- a/src/components/projects/projectId/data-browser/DataBrowserSidebar.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowserSidebar.tsx
@@ -1,9 +1,9 @@
 import { selectAllUsers } from '@/src/reduxStore/states/general';
 import { setModalStates } from '@/src/reduxStore/states/modal';
-import { selectActiveSlice, selectAdditionalData, selectDataSlicesAll, setActiveDataSlice, setActiveSearchParams, setFullSearchStore, setIsTextHighlightNeeded, setRecordsInDisplay, setTextHighlight, updateAdditionalDataState } from '@/src/reduxStore/states/pages/data-browser';
+import { selectActiveSlice, selectAdditionalData, selectDataSlicesAll, setActiveDataSlice, setActiveSearchParams, setFullSearchStore, setIsTextHighlightNeeded, setRecordsInDisplay, setTextHighlight, setUniqueValuesDict, updateAdditionalDataState } from '@/src/reduxStore/states/pages/data-browser';
 import { selectProjectId } from '@/src/reduxStore/states/project';
 import style from '@/src/styles/components/projects/projectId/data-browser.module.css';
-import { DataSlice } from '@/src/types/components/projects/projectId/data-browser/data-browser';
+import { DataBrowserSidebarProps, DataSlice } from '@/src/types/components/projects/projectId/data-browser/data-browser';
 import { ModalEnum } from '@/src/types/shared/modal';
 import { updateSliceInfoHelper } from '@/src/util/components/projects/projectId/data-browser/data-browser-helper';
 import { Slice } from '@/submodules/javascript-functions/enums/enums';
@@ -17,7 +17,7 @@ import DataSliceInfoModal from './modals/DataSliceInfoModal';
 import MultilineTooltip from '@/src/components/shared/multilines-tooltip/MultilineTooltip';
 import { MemoIconAlertTriangle, MemoIconInfoCircle, MemoIconLayoutSidebar, MemoIconTrash } from '@/submodules/react-components/components/kern-icons/icons';
 
-export default function DataBrowserSidebar() {
+export default function DataBrowserSidebar(props: DataBrowserSidebarProps) {
     const dispatch = useDispatch();
 
     const projectId = useSelector(selectProjectId);
@@ -130,7 +130,7 @@ export default function DataBrowserSidebar() {
                 </div>
                 <span className="text-sm text-gray-400">You can filter and order all your data in the browser according to your needs. Selected filter criteria can be saved and used later on.</span>
 
-                <SearchGroups />
+                <SearchGroups clearRequest={props.clearRequest} />
             </div>}
         </div>
         <DeleteSliceModal />
diff --git a/src/components/projects/projectId/data-browser/SearchGroups.tsx b/src/components/projects/projectId/data-browser/SearchGroups.tsx
index 727fa106..384f8b5d 100644
--- a/src/components/projects/projectId/data-browser/SearchGroups.tsx
+++ b/src/components/projects/projectId/data-browser/SearchGroups.tsx
@@ -29,12 +29,12 @@ import { getRecordsByStaticSlice, searchRecordsExtended } from "@/src/services/b
 import { staticDataSlicesCurrentCount } from "@/src/services/base/dataSlices";
 import KernButton from "@/submodules/react-components/components/kern-button/KernButton";
 import { MemoIconArrowDown, MemoIconArrowsRandom, MemoIconFilterOff, MemoIconPlus, MemoIconPointerOff, MemoIconTrash } from "@/submodules/react-components/components/kern-icons/icons";
-import { useConsoleLog } from "@/submodules/react-components/hooks/useConsoleLog";
+import { SearchGroupsProps } from "@/src/types/components/projects/projectId/data-browser/data-browser";
 
 const GROUP_SORT_ORDER = 0;
 let GLOBAL_SEARCH_GROUP_COUNT = 0;
 
-export default function SearchGroups() {
+export default function SearchGroups(props: SearchGroupsProps) {
     const dispatch = useDispatch();
 
     const projectId = useSelector(selectProjectId);
@@ -97,7 +97,7 @@ export default function SearchGroups() {
         });
         setBackgroundColors(colors);
         setAttributeSortOrder(attributesSort);
-    }, [attributes]);
+    }, [attributes, props.clearRequest]);
 
     useEffect(() => {
         if (!attributesSortOrder || !searchGroupsStore) return;
@@ -339,10 +339,10 @@ export default function SearchGroups() {
         }
         if (attributeType == DataTypeEnum.TEXT_LIST) {
             operatorsCopy.push({
-                value: SearchOperator.CONTAINS.split("_").join(" "),
+                value: SearchOperator.EQUAL.split("_").join(" "),
             });
-            tooltipsCopy.push(getSearchOperatorTooltip(SearchOperator.CONTAINS));
-            formControlsIdx['operator'] = SearchOperator.CONTAINS;
+            tooltipsCopy.push(getSearchOperatorTooltip(SearchOperator.EQUAL));
+            formControlsIdx['operator'] = SearchOperator.EQUAL;
 
         } else if (attributeType !== DataTypeEnum.BOOLEAN) {
             for (let t of Object.values(SearchOperator)) {
@@ -365,8 +365,6 @@ export default function SearchGroups() {
         dispatch(setFullSearchStore(fullSearchCopy));
     }
 
-    useConsoleLog(uniqueValuesDict, 'uniqueValuesDict');
-
     function removeSearchGroupItem(groupKey, index) {
         const fullSearchCopy = jsonCopy(fullSearchStore);
         fullSearchCopy[groupKey].groupElements.splice(index, 1);
@@ -622,17 +620,17 @@ export default function SearchGroups() {
                                 <div className="flex-grow mr-2.5 flex flex-col  mt-2 ">
                                     <div className="flex-grow flex flex-row flex-wrap gap-1">
                                         <div style={{ width: groupItem.operator != '' ? '49%' : '100%' }}>
-                                            <KernDropdown options={attributesSortOrder} buttonName={groupItem.name} backgroundColors={backgroundColors}
-                                                selectedOption={(option: any) => selectValueDropdown(option.name, index, 'name', group.key)} fontClass="font-dmMono" buttonClasses="text-xs" />
+                                            {attributesSortOrder && <KernDropdown options={attributesSortOrder} buttonName={groupItem.name} backgroundColors={backgroundColors}
+                                                selectedOption={(option: any) => selectValueDropdown(option.name, index, 'name', group.key)} fontClass="font-dmMono" buttonClasses="text-xs" />}
                                         </div>
                                         <div style={{ width: '49%' }}>
-                                            {groupItem.operator != '' &&
+                                            {(groupItem.operator != '' && operatorsDropdown) &&
                                                 <KernDropdown options={operatorsDropdown} buttonName={groupItem.operator} tooltipsArray={tooltipsArray} tooltipArrayPlacement="right" buttonClasses="text-xs"
                                                     selectedOption={(option: any) => selectValueDropdown(option.value, index, 'operator', group.key)} fontClass="font-dmMono" />
                                             }
                                         </div>
                                     </div>
-                                    {(uniqueValuesDict[groupItem['name']] && groupItem['operator'] != '' && groupItem['operator'] != 'BETWEEN' && groupItem['operator'] != 'IN' && groupItem['operator'] != 'IN WC' || saveAttributeType == DataTypeEnum.TEXT_LIST) ? (
+                                    {(uniqueValuesDict && uniqueValuesDict[groupItem['name']] && groupItem['operator'] != '' && groupItem['operator'] != 'BETWEEN' && groupItem['operator'] != 'IN' && groupItem['operator'] != 'IN WC' || saveAttributeType == DataTypeEnum.TEXT_LIST) ? (
                                         <div className="my-2">
                                             <KernDropdown options={uniqueValuesDict[groupItem['name']]} buttonName={groupItem['searchValue'] ? groupItem['searchValue'] : 'Select value'}
                                                 selectedOption={(option: any) => selectValueDropdown(option, index, 'searchValue', group.key)} fontClass="font-dmMono" />
@@ -651,7 +649,7 @@ export default function SearchGroups() {
                                         </div>
                                     )}
 
-                                    {(groupItem['operator'] == "BEGINS WITH" || groupItem['operator'] == "ENDS WITH" || groupItem['operator'] == SearchOperator.CONTAINS || groupItem['operator'] == "IN WC") && (saveAttributeType != DataTypeEnum.INTEGER && saveAttributeType != DataTypeEnum.FLOAT) &&
+                                    {(groupItem['operator'] == "BEGINS WITH" || groupItem['operator'] == "ENDS WITH" || groupItem['operator'] == SearchOperator.CONTAINS || groupItem['operator'] == "IN WC") && (saveAttributeType != DataTypeEnum.INTEGER && saveAttributeType != DataTypeEnum.FLOAT && saveAttributeType != DataTypeEnum.TEXT_LIST) &&
                                         <label htmlFor="caseSensitive" className="text-xs text-gray-500 cursor-pointer flex items-center pb-2">
                                             <input name="caseSensitive" className="mr-1 cursor-pointer" id="caseSensitive"
                                                 onChange={(e: any) => selectValueDropdown(e.target.checked, index, 'caseSensitive', group.key)} type="checkbox" />Case sensitive</label>}
diff --git a/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx b/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
index ff5fad1d..d1025343 100644
--- a/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
+++ b/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
@@ -20,7 +20,6 @@ import { updateLabelingTask } from "@/src/services/base/labeling-tasks";
 import IconButton from "@/submodules/react-components/components/kern-button/IconButton";
 import KernButton from "@/submodules/react-components/components/kern-button/KernButton";
 import { MemoIconColorPicker, MemoIconPlus, MemoIconTrash } from "@/submodules/react-components/components/kern-icons/icons";
-import { useConsoleLog } from "@/submodules/react-components/hooks/useConsoleLog";
 
 export default function LabelingTasks() {
     const dispatch = useDispatch();
diff --git a/src/types/components/projects/projectId/data-browser/data-browser.ts b/src/types/components/projects/projectId/data-browser/data-browser.ts
index a8e15e78..8c863ed9 100644
--- a/src/types/components/projects/projectId/data-browser/data-browser.ts
+++ b/src/types/components/projects/projectId/data-browser/data-browser.ts
@@ -55,4 +55,16 @@ export enum LineBreaksType {
 export type DataBrowserRecordsProps = {
     refetchNextRecords: () => void;
     clearSearchRequest: () => void;
+};
+
+export type DataBrowserProps = {
+    clearSearchRequest: () => void;
+};
+
+export type DataBrowserSidebarProps = {
+    clearRequest: boolean;
+}
+
+export type SearchGroupsProps = {
+    clearRequest: boolean;
 };
\ No newline at end of file
diff --git a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
index 20ad1403..c6d1c3a5 100644
--- a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
@@ -5,8 +5,7 @@ import { buildFullLink } from "@/src/util/shared/link-parser-helper";
 import { dateAsUTCDate } from "@/submodules/javascript-functions/date-parser";
 import { informationSourceTypeToString, labelSourceToString, sliceTypeToString } from "@/submodules/javascript-functions/enums/enum-functions";
 import { LabelSource, Slice } from "@/submodules/javascript-functions/enums/enums";
-import { jsonCopy, tryParseJSON } from "@/submodules/javascript-functions/general";
-import { getAttributeType } from "./search-operators-helper";
+import { jsonCopy } from "@/submodules/javascript-functions/general";
 
 export function postProcessDataSlices(dataSlices: DataSlice[]) {
     const prepareDataSlices = jsonCopy(dataSlices);
diff --git a/src/util/components/projects/projectId/data-browser/search-operators-helper.ts b/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
index 93d0aeb7..2c7e4ec2 100644
--- a/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
@@ -1,4 +1,5 @@
 import { FilterIntegrationOperator, SearchOperator } from "@/src/types/components/projects/projectId/data-browser/search-operators";
+import { DataTypeEnum } from "@/src/types/shared/general";
 
 export function getAttributeType(attributes: any[], attributeName: string) {
     return attributes.find(att => att.name == attributeName)?.type;
@@ -134,6 +135,9 @@ export function prepareOperator(searchElement: any, attributeType: string): stri
     if (attributeType == "BOOLEAN") {
         return SearchOperator.EQUAL;
     } else {
+        if (attributeType == DataTypeEnum.TEXT_LIST && searchElement.values.operator == SearchOperator.EQUAL) {
+            return SearchOperator.CONTAINS;
+        }
         return searchElement.values.operator;
     }
 }
\ No newline at end of file
diff --git a/submodules/react-components b/submodules/react-components
index 1f1dc088..05a61ddd 160000
--- a/submodules/react-components
+++ b/submodules/react-components
@@ -1 +1 @@
-Subproject commit 1f1dc08839bbf7e02e1ddafa774af43fdbb7197a
+Subproject commit 05a61ddd39e294a5d101cebcefddcb6344d34f5c

From 5ced565e4581e124536277b7863942dd8fe99d30 Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Tue, 29 Jul 2025 16:11:36 +0200
Subject: [PATCH 06/11] Similary search, evalutation changes for the new
 attribute type

---
 .../data-browser/modals/SimilaritySeachModal.tsx      |  9 +++++++--
 .../projects/projectId/edit-records/EditField.tsx     |  2 +-
 .../projects/projectId/edit-records/EditRecords.tsx   |  2 +-
 .../playground/PlaygroundSearchMetaFilterModal.tsx    | 11 ++++++++---
 .../settings/embeddings/AddNewEmbeddingModal.tsx      |  2 +-
 .../projectId/data-browser/search-groups-helper.ts    |  6 ++++--
 6 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/src/components/projects/projectId/data-browser/modals/SimilaritySeachModal.tsx b/src/components/projects/projectId/data-browser/modals/SimilaritySeachModal.tsx
index 16d1cae1..7a759776 100644
--- a/src/components/projects/projectId/data-browser/modals/SimilaritySeachModal.tsx
+++ b/src/components/projects/projectId/data-browser/modals/SimilaritySeachModal.tsx
@@ -95,8 +95,13 @@ export default function SimilaritySearchModal() {
         filterAttributesSS.forEach((attribute: string) => {
             const attributeType = attributes.find(att => att.name == attribute)?.dataType
             if (attributeType !== DataTypeEnum.INTEGER) {
-                operators = operators.filter(operator => operator !== FilterIntegrationOperator.BETWEEN);
-                tooltips = tooltips.filter(tooltip => tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.BETWEEN));
+                if (attributeType == DataTypeEnum.TEXT_LIST) {
+                    operators = operators.filter(operator => operator !== FilterIntegrationOperator.BETWEEN && operator !== FilterIntegrationOperator.IN);
+                    tooltips = tooltips.filter(tooltip => tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.BETWEEN) && tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.IN));
+                } else {
+                    operators = operators.filter(operator => operator !== FilterIntegrationOperator.BETWEEN);
+                    tooltips = tooltips.filter(tooltip => tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.BETWEEN));
+                }
             }
             operatorsCopy[attribute] = operators;
             tooltipsCopy[attribute] = tooltips;
diff --git a/src/components/projects/projectId/edit-records/EditField.tsx b/src/components/projects/projectId/edit-records/EditField.tsx
index 94cfd4e8..f7ebe1cf 100644
--- a/src/components/projects/projectId/edit-records/EditField.tsx
+++ b/src/components/projects/projectId/edit-records/EditField.tsx
@@ -114,7 +114,7 @@ export default function EditField(props: EditFieldProps) {
                 type="checkbox"
                 className="w-6 "
             />}
-        {props.attribute.dataType == DataTypeEnum.EMBEDDING_LIST &&
+        {(props.attribute.dataType == DataTypeEnum.EMBEDDING_LIST || props.attribute.dataType == DataTypeEnum.TEXT_LIST) &&
             <textarea value={inputValue} ref={inputRef}
                 onChange={(e) => setInputValue(e.target.value)}
                 onInput={setDynamicStyles}
diff --git a/src/components/projects/projectId/edit-records/EditRecords.tsx b/src/components/projects/projectId/edit-records/EditRecords.tsx
index 2f7ba8d3..36673be7 100644
--- a/src/components/projects/projectId/edit-records/EditRecords.tsx
+++ b/src/components/projects/projectId/edit-records/EditRecords.tsx
@@ -97,7 +97,7 @@ export default function EditRecords() {
                                         </div>
                                     </div>
                                     <div className="text-gray-800 text-sm mb-4 overflow-anywhere flex">
-                                        {attribute.dataType == DataTypeEnum.EMBEDDING_LIST ? (<div className="flex flex-col gap-y-1 divide-y w-full">
+                                        {(attribute.dataType == DataTypeEnum.EMBEDDING_LIST || attribute.dataType == DataTypeEnum.TEXT_LIST) ? (<div className="flex flex-col gap-y-1 divide-y w-full">
                                             {record.data[attribute.name].map((item, subKey) => (<div key={subKey} className="pt-1">
                                                 {(record.id == erdData.editRecordId && !attribute.isPrimaryKey) ?
                                                     <EditField attribute={attribute} record={record} subKey={subKey} erdData={erdData} setErdData={(erdData) => setErdData(erdData)} /> : <>
diff --git a/src/components/projects/projectId/playground/PlaygroundSearchMetaFilterModal.tsx b/src/components/projects/projectId/playground/PlaygroundSearchMetaFilterModal.tsx
index 4bd6c59e..dfb1a77f 100644
--- a/src/components/projects/projectId/playground/PlaygroundSearchMetaFilterModal.tsx
+++ b/src/components/projects/projectId/playground/PlaygroundSearchMetaFilterModal.tsx
@@ -58,9 +58,14 @@ export default function PlaygroundSearchMetaFilterModal(props: { selectedEmbeddi
         const newTooltipsDict = {};
 
         filterAttributesSS.forEach((attribute) => {
-            const attributeType = attributes.find(att => att.name == attribute)?.dataType
-            newOperatorsDict[attribute] = FILTER_INTEGRATION_OPERATORS.filter(operator => attributeType == DataTypeEnum.INTEGER || operator !== FilterIntegrationOperator.BETWEEN);
-            newTooltipsDict[attribute] = FILTER_INTEGRATION_OPERATOR_TOOLTIPS.filter(tooltip => attributeType == DataTypeEnum.INTEGER || tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.BETWEEN));
+            const attributeType = attributes.find(att => att.name == attribute)?.dataType;
+            if (attributeType == DataTypeEnum.TEXT_LIST) {
+                newOperatorsDict[attribute] = [FilterIntegrationOperator.EQUAL];
+                newTooltipsDict[attribute] = [getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.EQUAL)];
+            } else {
+                newOperatorsDict[attribute] = FILTER_INTEGRATION_OPERATORS.filter(operator => attributeType == DataTypeEnum.INTEGER || operator !== FilterIntegrationOperator.BETWEEN);
+                newTooltipsDict[attribute] = FILTER_INTEGRATION_OPERATOR_TOOLTIPS.filter(tooltip => attributeType == DataTypeEnum.INTEGER || tooltip !== getFilterIntegrationOperatorTooltip(FilterIntegrationOperator.BETWEEN));
+            }
             colors.push(getColorForDataType(attributeType));
         });
         setOperatorsDict(newOperatorsDict);
diff --git a/src/components/projects/projectId/settings/embeddings/AddNewEmbeddingModal.tsx b/src/components/projects/projectId/settings/embeddings/AddNewEmbeddingModal.tsx
index 61bafc80..38ab1fae 100644
--- a/src/components/projects/projectId/settings/embeddings/AddNewEmbeddingModal.tsx
+++ b/src/components/projects/projectId/settings/embeddings/AddNewEmbeddingModal.tsx
@@ -99,7 +99,7 @@ export default function AddNewEmbeddingModal() {
 
     function checkIfAttributeHasToken() {
         const attribute = useableEmbedableAttributes.find((a) => a.id == targetAttribute.id);
-        if (attribute?.dataType == DataTypeEnum.EMBEDDING_LIST) {
+        if (attribute?.dataType == DataTypeEnum.EMBEDDING_LIST || attribute?.dataType == DataTypeEnum.TEXT_LIST) {
             setGranularityArray(GRANULARITY_TYPES_ARRAY.filter((g) => g.value != EmbeddingType.ON_TOKEN));
         } else {
             checkIfPlatformHasToken();
diff --git a/src/util/components/projects/projectId/data-browser/search-groups-helper.ts b/src/util/components/projects/projectId/data-browser/search-groups-helper.ts
index c18a9549..3bfd23da 100644
--- a/src/util/components/projects/projectId/data-browser/search-groups-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/search-groups-helper.ts
@@ -2,6 +2,7 @@ import { SearchGroupElement } from "@/src/types/components/projects/projectId/da
 import { SearchGroupItem, SearchItemType } from "@/src/types/components/projects/projectId/data-browser/search-groups";
 import { SearchOperator } from "@/src/types/components/projects/projectId/data-browser/search-operators";
 import { LabelingTask, LabelingTaskTarget } from "@/src/types/components/projects/projectId/settings/labeling-tasks";
+import { DataTypeEnum } from "@/src/types/shared/general";
 import { getOrderByDisplayName, nameForGroupKeyToString } from "@/submodules/javascript-functions/enums/enum-functions";
 import { InformationSourceType, SearchGroup, StaticOrderByKeys } from "@/submodules/javascript-functions/enums/enums";
 
@@ -233,8 +234,9 @@ export function orderByCreateSearchGroup(item, globalSearchGroupCount, attribute
 
 function orderByArray(attributesSortOrder: any[] = [], attributesDict: any) {
     let array = [];
-    for (let i = 1; i < attributesSortOrder.length; i++) {
-        array.push(getOrderByGroup(attributesDict[attributesSortOrder[i].key].name, true, -1)) //1, //-1 desc, 1 asc     
+    const finalAttributesSortOrder = attributesSortOrder.filter((a) => a.type !== DataTypeEnum.TEXT_LIST);
+    for (let i = 1; i < finalAttributesSortOrder.length; i++) {
+        array.push(getOrderByGroup(attributesDict[finalAttributesSortOrder[i].key].name, true, -1)) //1, //-1 desc, 1 asc
     }
     array.push(getOrderByGroup(StaticOrderByKeys.WEAK_SUPERVISION_CONFIDENCE, false, -1));
     array.push(getOrderByGroup(StaticOrderByKeys.RANDOM, false, -1));

From 5aaeb39fb4e775e07ef94050629b46a2a5438420 Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Tue, 29 Jul 2025 16:31:11 +0200
Subject: [PATCH 07/11] Labeling page display fix

---
 .../sub-components/LabelingSuiteLabeling.tsx   | 18 +++++++++++++++---
 .../projectId/settings/data-schema-helper.ts   |  2 +-
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/projects/projectId/labeling/sessionId/sub-components/LabelingSuiteLabeling.tsx b/src/components/projects/projectId/labeling/sessionId/sub-components/LabelingSuiteLabeling.tsx
index 2e7f8893..d7d5c3c9 100644
--- a/src/components/projects/projectId/labeling/sessionId/sub-components/LabelingSuiteLabeling.tsx
+++ b/src/components/projects/projectId/labeling/sessionId/sub-components/LabelingSuiteLabeling.tsx
@@ -28,6 +28,7 @@ import { createLabel } from "@/src/services/base/labeling-tasks";
 import { addClassificationLabels, addExtractionLabel, deleteRecordLabelAssociationByIds, removeGoldStar, setGoldStar } from "@/src/services/base/labeling"
 import KernButton from "@/submodules/react-components/components/kern-button/KernButton"
 import { MemoIconAlertCircle, MemoIconAssembly, MemoIconBolt, MemoIconCode, MemoIconStar } from "@/submodules/react-components/components/kern-icons/icons"
+import { DataTypeEnum } from "@/src/types/shared/general"
 
 const L_VARS = getDefaultLabelingVars();
 
@@ -568,9 +569,20 @@ export default function LabelingSuiteLabeling() {
                                     }}
                                     setSelected={(start, end, e) => setSelected(attribute.id, start, end, e)} />) : (<>
                                         {(recordRequests.record.data[lVars.taskLookup[attribute.id].attribute.name] != null && recordRequests.record.data[lVars.taskLookup[attribute.id].attribute.name] !== '') ?
-                                            (<p className={`break-words text-sm leading-5 font-normal text-gray-500 ${settings.main.lineBreaks != LineBreaksType.NORMAL ? (settings.main.lineBreaks == LineBreaksType.IS_PRE_WRAP ? 'whitespace-pre-wrap' : 'whitespace-pre-line') : ''}`}>
-                                                {`${recordRequests.record.data[lVars.taskLookup[attribute.id].attribute.name]}`}
-                                            </p>) : (<>
+                                            (<>
+                                                {(attribute.dataType == DataTypeEnum.TEXT_LIST || attribute.dataType == DataTypeEnum.EMBEDDING_LIST) ? <div className="flex flex-col gap-y-1 divide-y w-fit">
+                                                    {recordRequests.record.data[lVars.taskLookup[attribute.id].attribute.name].map((text, index) => (
+                                                        <p key={index} className={`break-words text-sm leading-5 font-normal text-gray-500 ${settings.main.lineBreaks != LineBreaksType.NORMAL ? (settings.main.lineBreaks == LineBreaksType.IS_PRE_WRAP ? 'whitespace-pre-wrap' : 'whitespace-pre-line') : ''}`}>
+                                                            {text}
+                                                        </p>
+                                                    ))}
+                                                </div> :
+                                                    <p className={`break-words text-sm leading-5 font-normal text-gray-500 ${settings.main.lineBreaks != LineBreaksType.NORMAL ? (settings.main.lineBreaks == LineBreaksType.IS_PRE_WRAP ? 'whitespace-pre-wrap' : 'whitespace-pre-line') : ''}`}>
+                                                        {`${recordRequests.record.data[lVars.taskLookup[attribute.id].attribute.name]}`}
+                                                    </p>
+                                                }
+                                            </>
+                                            ) : (<>
                                                 <MemoIconAlertCircle className="text-yellow-700 inline-block h-5 w-5" />
                                                 <span className="text-gray-500 text-sm font-normal italic">Not present in the
                                                     record</span>
diff --git a/src/util/components/projects/projectId/settings/data-schema-helper.ts b/src/util/components/projects/projectId/settings/data-schema-helper.ts
index 6fc9ff1a..79c48f8e 100644
--- a/src/util/components/projects/projectId/settings/data-schema-helper.ts
+++ b/src/util/components/projects/projectId/settings/data-schema-helper.ts
@@ -55,7 +55,7 @@ export function getColorForDataType(dataType): string {
         case DataTypeEnum.FLOAT: return 'purple';
         case DataTypeEnum.EMBEDDING_LIST: return 'rose';
         case DataTypeEnum.LLM_RESPONSE: return 'emerald';
-        case DataTypeEnum.TEXT_LIST: return 'blue';
+        case DataTypeEnum.TEXT_LIST: return 'teal';
         default: return 'gray';
     }
 }

From f5974aa5e1a94b4009f0de2a3a325dab3e528f23 Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Tue, 29 Jul 2025 16:51:31 +0200
Subject: [PATCH 08/11] Build fix

---
 .../projects/projectId/data-browser/DataBrowser.tsx           | 3 +--
 .../projects/projectId/data-browser/data-browser.ts           | 4 ----
 2 files changed, 1 insertion(+), 6 deletions(-)

diff --git a/src/components/projects/projectId/data-browser/DataBrowser.tsx b/src/components/projects/projectId/data-browser/DataBrowser.tsx
index 2702ac34..52b1c5d7 100644
--- a/src/components/projects/projectId/data-browser/DataBrowser.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowser.tsx
@@ -21,11 +21,10 @@ import { getEmbeddings } from "@/src/services/base/embedding";
 import { parseFilterToExtended } from "@/src/util/components/projects/projectId/data-browser/filter-parser-helper";
 import { SearchGroup, Slice } from "@/submodules/javascript-functions/enums/enums";
 import { Application, CurrentPage } from "@/submodules/react-components/hooks/web-socket/constants";
-import { DataBrowserProps } from "@/src/types/components/projects/projectId/data-browser/data-browser";
 
 const SEARCH_REQUEST = { offset: 0, limit: 20 };
 
-export default function DataBrowser(props: DataBrowserProps) {
+export default function DataBrowser() {
     const dispatch = useDispatch();
 
     const projectId = useSelector(selectProjectId);
diff --git a/src/types/components/projects/projectId/data-browser/data-browser.ts b/src/types/components/projects/projectId/data-browser/data-browser.ts
index 8c863ed9..14781046 100644
--- a/src/types/components/projects/projectId/data-browser/data-browser.ts
+++ b/src/types/components/projects/projectId/data-browser/data-browser.ts
@@ -57,10 +57,6 @@ export type DataBrowserRecordsProps = {
     clearSearchRequest: () => void;
 };
 
-export type DataBrowserProps = {
-    clearSearchRequest: () => void;
-};
-
 export type DataBrowserSidebarProps = {
     clearRequest: boolean;
 }

From 65664e9f406b83c718ddf6a7c45929638f5cee3e Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Wed, 30 Jul 2025 15:26:09 +0200
Subject: [PATCH 09/11] Text list attribute changes on data browser,
 heuristivcs and settings

---
 .../projectId/data-browser/DataBrowser.tsx        |  6 +++---
 .../projectId/data-browser/RecordList.tsx         | 15 ++++++++++++++-
 .../projectId/data-browser/SearchGroups.tsx       |  6 +++---
 .../labeling-function/LabelingFunction.tsx        |  2 +-
 .../labeling-function/SampleRecords.tsx           |  2 +-
 .../settings/labeling-tasks/LabelingTasks.tsx     | 10 +++++++---
 .../projects/projectId/settings/labeling-tasks.ts |  2 ++
 .../projectId/data-browser/data-browser-helper.ts |  8 +++++---
 .../data-browser/search-operators-helper.ts       |  3 ---
 9 files changed, 36 insertions(+), 18 deletions(-)

diff --git a/src/components/projects/projectId/data-browser/DataBrowser.tsx b/src/components/projects/projectId/data-browser/DataBrowser.tsx
index 52b1c5d7..d75fcce4 100644
--- a/src/components/projects/projectId/data-browser/DataBrowser.tsx
+++ b/src/components/projects/projectId/data-browser/DataBrowser.tsx
@@ -43,7 +43,7 @@ export default function DataBrowser() {
     const [clearRequest, setClearRequest] = useState(false);
 
     useEffect(() => {
-        if (!projectId) return;
+        if (!projectId || !attributes) return;
         if (!users || !user) return;
         refetchDataSlicesAndProcess();
         refetchAttributesAndProcess();
@@ -52,11 +52,11 @@ export default function DataBrowser() {
     }, [projectId, users, user]);
 
     useEffect(() => {
-        if (!attributes || attributes.length == 0 || !projectId) return;
+        if (!projectId || !attributes) return;
         getUniqueValuesByAttributes(projectId, (res) => {
             dispatch(setUniqueValuesDict(postProcessUniqueValues(res, attributes)));
         });
-    }, [attributes, projectId]);
+    }, [projectId, attributes]);
 
     useEffect(() => {
         if (!projectId || !labelingTasks || !recordList) return;
diff --git a/src/components/projects/projectId/data-browser/RecordList.tsx b/src/components/projects/projectId/data-browser/RecordList.tsx
index ffe0204e..e8573ff2 100644
--- a/src/components/projects/projectId/data-browser/RecordList.tsx
+++ b/src/components/projects/projectId/data-browser/RecordList.tsx
@@ -15,6 +15,9 @@ import SimilaritySearchModal from "./modals/SimilaritySeachModal";
 import RecordCommentsModal from "./modals/RecordCommentsModal";
 import ButtonAsText from "@/submodules/react-components/components/kern-button/ButtonAsText";
 import { MemoIconAngle, MemoIconArrowRight, MemoIconEdit, MemoIconNotes } from "@/submodules/react-components/components/kern-icons/icons";
+import { useEffect, useMemo } from "react";
+import { selectAllProjects, selectProject, setAllProjects } from "@/src/reduxStore/states/project";
+import { getAllProjects } from "@/src/services/base/project";
 
 export default function RecordList(props: RecordListProps) {
     const dispatch = useDispatch();
@@ -25,6 +28,16 @@ export default function RecordList(props: RecordListProps) {
     const embeddings = useSelector(selectEmbeddings);
     const recordComments = useSelector(selectRecordComments);
     const attributes = useSelector(selectVisibleAttributesDataBrowser);
+    const project = useSelector(selectProject);
+    const allProjects = useSelector(selectAllProjects);
+
+    useEffect(() => {
+        getAllProjects((projects) => dispatch(setAllProjects(projects)));
+    }, []);
+
+    const isIntegrationProject = useMemo(() => {
+        return allProjects && allProjects.find(p => p.id === project.id)?.isIntegrationProject;
+    }, [allProjects, project.id]);
 
     return (<>
         {recordList && recordList.map((record, index) => (<div key={record.id} className="bg-white overflow-hidden shadow rounded-lg border mb-4 pb-4 relative">
@@ -71,7 +84,7 @@ export default function RecordList(props: RecordListProps) {
                     </div>
                 </div>
             </div>
-            {user?.role == UserRole.ENGINEER && <div className="p-2 cursor-pointer absolute right-2 top-2">
+            {(user?.role == UserRole.ENGINEER && !isIntegrationProject) && <div className="p-2 cursor-pointer absolute right-2 top-2">
                 <Tooltip content={TOOLTIPS_DICT.DATA_BROWSER.EDIT_RECORD} color="invert">
                     <MemoIconEdit className="h-4 w-4" onClick={() => props.editRecord(index)} />
                 </Tooltip></div>}
diff --git a/src/components/projects/projectId/data-browser/SearchGroups.tsx b/src/components/projects/projectId/data-browser/SearchGroups.tsx
index 384f8b5d..a30a0305 100644
--- a/src/components/projects/projectId/data-browser/SearchGroups.tsx
+++ b/src/components/projects/projectId/data-browser/SearchGroups.tsx
@@ -339,10 +339,10 @@ export default function SearchGroups(props: SearchGroupsProps) {
         }
         if (attributeType == DataTypeEnum.TEXT_LIST) {
             operatorsCopy.push({
-                value: SearchOperator.EQUAL.split("_").join(" "),
+                value: SearchOperator.CONTAINS.split("_").join(" "),
             });
-            tooltipsCopy.push(getSearchOperatorTooltip(SearchOperator.EQUAL));
-            formControlsIdx['operator'] = SearchOperator.EQUAL;
+            tooltipsCopy.push(getSearchOperatorTooltip(SearchOperator.CONTAINS));
+            formControlsIdx['operator'] = SearchOperator.CONTAINS;
 
         } else if (attributeType !== DataTypeEnum.BOOLEAN) {
             for (let t of Object.values(SearchOperator)) {
diff --git a/src/components/projects/projectId/heuristics/heuristicId/labeling-function/LabelingFunction.tsx b/src/components/projects/projectId/heuristics/heuristicId/labeling-function/LabelingFunction.tsx
index 1979a907..05086ad8 100644
--- a/src/components/projects/projectId/heuristics/heuristicId/labeling-function/LabelingFunction.tsx
+++ b/src/components/projects/projectId/heuristics/heuristicId/labeling-function/LabelingFunction.tsx
@@ -8,7 +8,7 @@ import { postProcessCurrentHeuristic, postProcessLastTaskLogs } from "@/src/util
 import { Tooltip } from "@nextui-org/react";
 import { TOOLTIPS_DICT } from "@/src/util/tooltip-constants";
 import { postProcessLabelingTasksSchema } from "@/src/util/components/projects/projectId/settings/labeling-tasks-helper";
-import { selectVisibleAttributesHeuristics, selectLabelingTasksAll, setLabelingTasksAll, selectVisibleAttributesWithoutPermissions } from "@/src/reduxStore/states/pages/settings";
+import { selectLabelingTasksAll, setLabelingTasksAll, selectVisibleAttributesWithoutPermissions } from "@/src/reduxStore/states/pages/settings";
 import HeuristicsEditor from "../shared/HeuristicsEditor";
 import DangerZone from "@/src/components/shared/danger-zone/DangerZone";
 import HeuristicRunButtons from "../shared/HeuristicRunButtons";
diff --git a/src/components/projects/projectId/heuristics/heuristicId/labeling-function/SampleRecords.tsx b/src/components/projects/projectId/heuristics/heuristicId/labeling-function/SampleRecords.tsx
index d9122210..5a8d6c4c 100644
--- a/src/components/projects/projectId/heuristics/heuristicId/labeling-function/SampleRecords.tsx
+++ b/src/components/projects/projectId/heuristics/heuristicId/labeling-function/SampleRecords.tsx
@@ -16,7 +16,7 @@ export default function SampleRecords(props: SampleRecordProps) {
                             <div className="divide-y divide-gray-200 bg-white" key={record.id}>
                                 <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">
-                                        {record.fullRecordData[props.selectedAttribute]}
+                                        {Array.isArray(record.fullRecordData[props.selectedAttribute]) ? JSON.stringify(record.fullRecordData[props.selectedAttribute]) : record.fullRecordData[props.selectedAttribute]}
                                     </div>
                                     <div className="flex items-center justify-center mr-5 ml-auto">
                                         {Object.entries(record.calculatedLabelsResult).map(([key, value]: any) => (
diff --git a/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx b/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
index d1025343..113adc18 100644
--- a/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
+++ b/src/components/projects/projectId/settings/labeling-tasks/LabelingTasks.tsx
@@ -1,5 +1,5 @@
 import { openModal, setModalStates } from "@/src/reduxStore/states/modal";
-import { selectLabelingTasksAll, setLabelingTasksAll } from "@/src/reduxStore/states/pages/settings";
+import { selectAttributes, selectLabelingTasksAll, setLabelingTasksAll } from "@/src/reduxStore/states/pages/settings";
 import { selectProjectId } from "@/src/reduxStore/states/project";
 import { LabelType, LabelTypeWithOnClick, LabelingTask, LabelingTaskTaskType, LabelingTaskWithOnClick } from "@/src/types/components/projects/projectId/settings/labeling-tasks";
 import { ModalEnum } from "@/src/types/shared/modal";
@@ -20,12 +20,15 @@ import { updateLabelingTask } from "@/src/services/base/labeling-tasks";
 import IconButton from "@/submodules/react-components/components/kern-button/IconButton";
 import KernButton from "@/submodules/react-components/components/kern-button/KernButton";
 import { MemoIconColorPicker, MemoIconPlus, MemoIconTrash } from "@/submodules/react-components/components/kern-icons/icons";
+import { DataTypeEnum } from "@/src/types/shared/general";
 
 export default function LabelingTasks() {
     const dispatch = useDispatch();
 
     const projectId = useSelector(selectProjectId);
     const labelingTasksSchema = useSelector(selectLabelingTasksAll);
+    const attributes = useSelector(selectAttributes);
+
 
     const [labelingTasksDropdownArray, setLabelingTasksDropdownArray] = useState<{ name: string, value: string }[]>([]);
 
@@ -102,9 +105,10 @@ export default function LabelingTasks() {
                 ...labelingTask,
                 onDelete: () => dispatch(setModalStates(ModalEnum.DELETE_LABELING_TASK, { taskId: labelingTask.id, open: true })),
                 labels: labelingTask.labels.map((label) => ({ ...label, onDelete: deleteLabel(labelingTask, label), onChangeColor: changeColorLabel(labelingTask, label) })),
+                attributeType: attributes.find(att => att.name == labelingTask.targetName)?.dataType
             }
         ))
-    }, [labelingTasksSchema]);
+    }, [labelingTasksSchema, attributes]);
 
 
     return (<div className="mt-8">
@@ -152,7 +156,7 @@ export default function LabelingTasks() {
                                     </td>
                                     <td className="whitespace-nowrap text-center px-3 py-2 text-sm text-gray-500">
                                         <KernDropdown options={labelingTasksDropdownArray} buttonName={labelingTaskToString(task.taskType)}
-                                            disabledOptions={[false, task.targetName === 'Full Record', false]} dropdownWidth="w-60" dropdownItemsClasses="w-60"
+                                            disabledOptions={[false, task.targetName === 'Full Record' || task.attributeType == DataTypeEnum.TEXT_LIST, false]} dropdownWidth="w-60" dropdownItemsClasses="w-60"
                                             selectedOption={(option: any) => updateLabelingTaskType(task, index, labelingTaskFromString(option.name))} />
                                     </td>
                                     <td className="flex flex-wrap justify-center items-center px-3 py-2 text-sm text-gray-500">
diff --git a/src/types/components/projects/projectId/settings/labeling-tasks.ts b/src/types/components/projects/projectId/settings/labeling-tasks.ts
index 19da8bc5..b2ce45db 100644
--- a/src/types/components/projects/projectId/settings/labeling-tasks.ts
+++ b/src/types/components/projects/projectId/settings/labeling-tasks.ts
@@ -1,3 +1,4 @@
+import { DataTypeEnum } from "@/src/types/shared/general";
 import { Attribute } from "./data-schema";
 
 export type LabelingTask = {
@@ -16,6 +17,7 @@ export type LabelingTask = {
 
 export type LabelingTaskWithOnClick = LabelingTask & {
     onDelete: () => void;
+    attributeType: DataTypeEnum;
 }
 
 export type LabelType = {
diff --git a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
index c6d1c3a5..0c6594ed 100644
--- a/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/data-browser-helper.ts
@@ -179,9 +179,11 @@ export function postProcessUniqueValues(uniqueValues: any, attributesSortOrder:
         if (attributeType == DataTypeEnum.TEXT || attributeType == DataTypeEnum.LLM_RESPONSE) {
             delete uniqueValuesDict[key];
         } else if (attributeType == DataTypeEnum.TEXT_LIST) {
-            uniqueValuesDict[key] = uniqueValuesDict[key].map((value: string) => {
-                return JSON.parse(value);
-            })[0];
+            const uniqueSet = new Set<string>();
+            for (const item of uniqueValuesDict[key]) {
+                JSON.parse(item).forEach(str => uniqueSet.add(str));
+            }
+            uniqueValuesDict[key] = Array.from(uniqueSet);
         }
     }
     return uniqueValuesDict;
diff --git a/src/util/components/projects/projectId/data-browser/search-operators-helper.ts b/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
index 2c7e4ec2..898f6c4e 100644
--- a/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
+++ b/src/util/components/projects/projectId/data-browser/search-operators-helper.ts
@@ -135,9 +135,6 @@ export function prepareOperator(searchElement: any, attributeType: string): stri
     if (attributeType == "BOOLEAN") {
         return SearchOperator.EQUAL;
     } else {
-        if (attributeType == DataTypeEnum.TEXT_LIST && searchElement.values.operator == SearchOperator.EQUAL) {
-            return SearchOperator.CONTAINS;
-        }
         return searchElement.values.operator;
     }
 }
\ No newline at end of file

From 5b364a66e31248f93dfdbc06367c70ebe996c697 Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Thu, 31 Jul 2025 10:17:06 +0200
Subject: [PATCH 10/11] Configuration line breaks fix

---
 .../modals/ConfigurationModal.tsx             | 33 ++++++++++++-------
 1 file changed, 22 insertions(+), 11 deletions(-)

diff --git a/src/components/projects/projectId/data-browser/modals/ConfigurationModal.tsx b/src/components/projects/projectId/data-browser/modals/ConfigurationModal.tsx
index 56d6446f..5fbc124b 100644
--- a/src/components/projects/projectId/data-browser/modals/ConfigurationModal.tsx
+++ b/src/components/projects/projectId/data-browser/modals/ConfigurationModal.tsx
@@ -3,43 +3,55 @@ import { setModalStates } from "@/src/reduxStore/states/modal";
 import { selectConfiguration, updateConfigurationState } from "@/src/reduxStore/states/pages/data-browser";
 import { LineBreaksType } from "@/src/types/components/projects/projectId/data-browser/data-browser";
 import { ModalEnum } from "@/src/types/shared/modal";
+import { useCallback, useEffect } from "react";
 import { useDispatch, useSelector } from "react-redux";
 
 export default function ConfigurationModal() {
     const dispatch = useDispatch();
 
     const configuration = useSelector(selectConfiguration);
+    useEffect(() => {
+        const lineBreaks = localStorage.getItem('lineBreaks');
+        if (lineBreaks) {
+            dispatch(updateConfigurationState('lineBreaks', JSON.parse(lineBreaks) as LineBreaksType));
+        }
+    }, []);
+
 
-    function toggleConfigurationOption(field: string) {
+    const toggleConfigurationOption = useCallback((field: string) => {
         dispatch(updateConfigurationState(field, !configuration[field]));
         dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
-    }
+    }, [configuration]);
 
-    function toggleLineBreaks() {
+    const toggleLineBreaks = useCallback(() => {
         if (configuration.lineBreaks == LineBreaksType.IS_PRE_WRAP || configuration.lineBreaks == LineBreaksType.IS_PRE_LINE) {
             dispatch(updateConfigurationState('lineBreaks', LineBreaksType.NORMAL));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
+            localStorage.setItem('lineBreaks', JSON.stringify(LineBreaksType.NORMAL));
 
         } else {
             dispatch(updateConfigurationState('lineBreaks', LineBreaksType.IS_PRE_WRAP));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
-
+            localStorage.setItem('lineBreaks', JSON.stringify(LineBreaksType.IS_PRE_WRAP));
         }
-    }
+    }, [configuration]);
+
 
-    function toggleLineBreaksPreWrap() {
+    const toggleLineBreaksPreWrap = useCallback(() => {
         if (configuration.lineBreaks === LineBreaksType.IS_PRE_WRAP) {
             dispatch(updateConfigurationState('lineBreaks', LineBreaksType.IS_PRE_LINE));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
+            localStorage.setItem('lineBreaks', JSON.stringify(LineBreaksType.IS_PRE_LINE));
 
         } else if (configuration.lineBreaks === LineBreaksType.IS_PRE_LINE) {
             dispatch(updateConfigurationState('lineBreaks', LineBreaksType.IS_PRE_WRAP));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
-
+            localStorage.setItem('lineBreaks', JSON.stringify(LineBreaksType.IS_PRE_WRAP));
         }
-    }
+    }, [configuration]);
+
 
-    function toggleSeparator() {
+    const toggleSeparator = useCallback(() => {
         if (configuration.separator === ',') {
             dispatch(updateConfigurationState('separator', '-'));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
@@ -47,9 +59,8 @@ export default function ConfigurationModal() {
         } else {
             dispatch(updateConfigurationState('separator', ','));
             dispatch(setModalStates(ModalEnum.CONFIGURATION, { open: true }));
-
         }
-    }
+    }, [configuration]);
 
     return (<Modal modalName={ModalEnum.CONFIGURATION}>
         <div className="flex flex-grow justify-center text-lg leading-6 text-gray-900 font-medium">View configuration </div>

From 668538f37f1627255d511b4c42698241be886a2e Mon Sep 17 00:00:00 2001
From: Lina <lina.lumburovska@kern.ai>
Date: Thu, 31 Jul 2025 10:43:32 +0200
Subject: [PATCH 11/11] PR comments

---
 .../attributes/attributeId/ExecutionContainer.tsx      |  9 +++------
 .../attributes/attributeId/ViewRecordDetailsModal.tsx  | 10 +++++++++-
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx b/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx
index de65513a..d3e90b50 100644
--- a/src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx
+++ b/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
diff --git a/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx b/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx
index 1b0349b5..bfb1326f 100644
--- a/src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx
+++ b/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>