FE: Fix sorting connectors duplicates items (#119)

kafbat · Feb 16, 2024 · 877272b · 877272b
1 parent b7db580
commit 877272b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/frontend/src/components/Connect/List/List.tsx b/frontend/src/components/Connect/List/List.tsx
@@ -43,6 +43,7 @@ const List: React.FC = () => {
         navigate(clusterConnectConnectorPath(clusterName, connect, name))
       }
       emptyMessage="No connectors found"
+      setRowId={(originalRow) => `${originalRow.name}-${originalRow.connect}`}
     />
   );
 };

diff --git a/frontend/src/components/common/NewTable/Table.tsx b/frontend/src/components/common/NewTable/Table.tsx
@@ -55,6 +55,8 @@ export interface TableProps<TData> {
 
   onRowHover?: (row: Row<TData>) => void;
   onMouseLeave?: () => void;
+
+  setRowId?: (originalRow: Row<TData>) => string;
 }
 
 type UpdaterFn<T> = (previousState: T) => T;
@@ -132,6 +134,7 @@ const Table: React.FC<TableProps<any>> = ({
   onRowClick,
   onRowHover,
   onMouseLeave,
+  setRowId,
 }) => {
   const [searchParams, setSearchParams] = useSearchParams();
   const location = useLocation();
@@ -164,7 +167,10 @@ const Table: React.FC<TableProps<any>> = ({
       rowSelection,
     },
     getRowId: (originalRow, index) => {
-      return originalRow.name ? originalRow.name : `${index}`;
+      return (
+        setRowId?.(originalRow) ||
+        (originalRow.name ? originalRow.name : `${index}`)
+      );
     },
     onSortingChange: onSortingChange as OnChangeFn<SortingState>,
     onPaginationChange: onPaginationChange as OnChangeFn<PaginationState>,
-Original file line number
+Diff line change
@@ Expand Up / @@ -43,6 +43,7 @@ const List: React.FC = () => { @@
             navigate(clusterConnectConnectorPath(clusterName, connect, name))
           }
           emptyMessage="No connectors found"
+          setRowId={(originalRow) => `${originalRow.name}-${originalRow.connect}`}
         />
       );
     };
@@ Expand Down @@