medusajs/medusa

Duplicate React key warning in `CustomerOrderSection` due to duplicate `"actions"` column IDs

Open

#15 485 ouverte le 24 mai 2026

Voir sur GitHub
 (1 commentaire) (0 réactions) (0 assignés)TypeScript (22 539 stars) (2 090 forks)batch import
good first issuetype: bug

Description

Description

While navigating to the customer detail orders table, a React warning appears in the console:

Warning: Encountered two children with the same key, `0_actions`

After tracing the issue, it seems to originate from duplicate TanStack Table display column IDs.

useOrderTableColumns already defines a display column with:

columnHelper.display({
  id: "actions",
  cell: ({ row }) => {
    return <CountryCell country={country} />
  },
})

Then CustomerOrderSection appends another display column:

columnHelper.display({
  id: "actions",
  cell: ({ row }) => <CustomerOrderActions order={row.original} />,
})

This results in duplicate column IDs inside the same table, causing TanStack Table to generate duplicate internal keys such as:

0_actions

which triggers the React warning.

Expected behavior

Column IDs should be unique.

The CountryCell display column appears to semantically represent a country/shipping country column, so renaming its ID from:

id: "actions"

to something like:

id: "country"

would likely resolve the warning.

Environment

  • Admin dashboard
  • TanStack Table

Guide contributeur