Skip to content

Commit 59cab65

Browse files
ickasclaude
andcommitted
fix(table-dnd): convert draggableId to string for react-beautiful-dnd
react-beautiful-dnd requires draggableId to be a string, but the component was passing numeric IDs directly, causing errors: "Draggable requires a [string] draggableId" Changes: - Convert row.id to String(row.id) for draggableId and key props - Update CellBaseType interface to accept string | number for id Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
1 parent 8c77ebb commit 59cab65

File tree

1 file changed

+5
-5
lines changed

1 file changed

+5
-5
lines changed

src/molecules/table-dnd/index.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export interface TableProps<CellDataType> {
4444
}
4545

4646
export interface CellBaseType {
47-
id: string;
47+
id: string | number;
4848
}
4949

5050
const TableDnD = <CellData extends CellBaseType>(
@@ -191,19 +191,19 @@ const TableDnD = <CellData extends CellBaseType>(
191191
<>
192192
{validValues.map((row, index) => (
193193
<Draggable
194-
key={row.id}
195-
draggableId={row.id}
194+
key={String(row.id)}
195+
draggableId={String(row.id)}
196196
index={index}
197197
>
198198
{(provided, snapshot) => (
199199
<tr
200200
ref={provided.innerRef}
201-
key={row.id}
201+
key={String(row.id)}
202202
data-testid={`row-${dataTestId}`}
203203
{...provided.draggableProps}
204204
className={clsx(
205205
styles.tableRow,
206-
draggableId === row.id && styles.isDragging
206+
draggableId === String(row.id) && styles.isDragging
207207
)}
208208
style={getItemStyle(
209209
snapshot.isDragging,

0 commit comments

Comments
 (0)