fix(experiments): move column dedup to table display layer only

Keep dynamicOutputColumns intact in the shared hook so filters and
column visibility state are unaffected. Apply the dedup filter only
when building outputColumnsData for table rendering.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: alexkuzmik

apps/opik-frontend/src/v2/pages-shared/experiments/useExperimentItemsData.ts

@@ -146,18 +146,14 @@ const useExperimentItemsData = ({
   }, [data]);
 
   const dynamicOutputColumns = useMemo(() => {
-    const datasetColumnNames = new Set(
-      dynamicDatasetColumns.map((c) => c.label),
-    );
     return (experimentsOutputData?.columns ?? [])
-      .filter((c) => !datasetColumnNames.has(c.name))
       .sort((c1, c2) => c1.name.localeCompare(c2.name))
       .map<DynamicColumn>((c) => ({
         id: `${EXPERIMENT_ITEM_OUTPUT_PREFIX}.${c.name}`,
         label: c.name,
         columnType: mapDynamicColumnTypesToColumnType(c.types),
       }));
-  }, [experimentsOutputData, dynamicDatasetColumns]);
+  }, [experimentsOutputData]);
 
   const dynamicScoresColumns = useMemo(() => {
     return (feedbackScoresData?.scores ?? [])

apps/opik-frontend/src/v2/pages/CompareExperimentsPage/ExperimentItemsTab/ExperimentItemsTab.tsx

@@ -273,24 +273,31 @@ const ExperimentItemsTab: React.FunctionComponent<ExperimentItemsTabProps> = ({
     ];
   }, [dynamicDatasetColumns, experimentsCount, sortableColumns]);
 
+  const datasetColumnLabels = useMemo(
+    () => new Set(dynamicDatasetColumns.map((c) => c.label)),
+    [dynamicDatasetColumns],
+  );
+
   const outputColumnsData = useMemo(() => {
     return [
-      ...dynamicOutputColumns.map(
-        ({ label, id, columnType }) =>
-          ({
-            id,
-            label,
-            type: columnType,
-            cell: CompareExperimentsOutputCell as never,
-            customMeta: {
-              experiments,
-              experimentsIds,
-              outputKey: label,
-              openTrace: setTraceId,
-            },
-            ...(columnType === COLUMN_TYPE.dictionary && { size: 400 }),
-          }) as ColumnData<ExperimentsCompare>,
-      ),
+      ...dynamicOutputColumns
+        .filter((c) => !datasetColumnLabels.has(c.label))
+        .map(
+          ({ label, id, columnType }) =>
+            ({
+              id,
+              label,
+              type: columnType,
+              cell: CompareExperimentsOutputCell as never,
+              customMeta: {
+                experiments,
+                experimentsIds,
+                outputKey: label,
+                openTrace: setTraceId,
+              },
+              ...(columnType === COLUMN_TYPE.dictionary && { size: 400 }),
+            }) as ColumnData<ExperimentsCompare>,
+        ),
       {
         id: COLUMN_DURATION_ID,
         label: "Duration",
@@ -343,6 +350,7 @@ const ExperimentItemsTab: React.FunctionComponent<ExperimentItemsTabProps> = ({
       } as ColumnData<ExperimentsCompare>,
     ];
   }, [
+    datasetColumnLabels,
     dynamicOutputColumns,
     experiments,
     experimentsIds,