[EuiDataGrid] Dedupe columns that contain duplicated column.id

[mgadewoll]

Summary

Related to elastic/kibana#242481

This PR is a follow-up to #9030 which ensured that columns are sorted according to visibleColumns. While this generally works fine, it does not account for the edge case that columns could in theory have duplicate columns that have the same id. In that case, the added functionality to sort the columns would run into a out-of-bounds value and pass undefined as column (code).

While it's generally not valid or expected to pass duplicated columns, this is not prevented and could potentially happen, as it recently did in Kibana here. The underlying issue is that Kibana passed duplicate columns, which they fixed in elastic/kibana#242557.

To make our functionality a bit more robust for this edge case, this PR updates the column_selector to dedupe duplicate columns and prevent app crashes if consumers pass unexpected duplicated columns.

Why are we making this change?

💪 Component robustness: Provide a safety net for misuse to prevent crashes.

Screenshots #

Passing duplicate columns

before	after

Impact to users

🟢 There are no updates required on consumer side.

ℹ️ The changes have been tested against Kibana CI here.

QA

🧪 Testing story

• verify that changing the visibleColumns order and amount correctly renders columns
• verify that updating column order (via dragging, via column selector and via action menu "move left/right") work as expected and have no regression
• verify that adding duplicate items in columns renders correctly and without error (visible columns are rendered only, duplicate columns are removed completely and are also not included in the column selector)

General checklist

• Browser QA
  • Checked in both light and dark modes
  • Checked in both MacOS and Windows high contrast modes
    • (emulate forced colors if you do not have access to a Windows machine.)
  • Checked in mobile
  • Checked in Chrome, Safari, Edge, and Firefox
  • Checked for accessibility including keyboard-only and screenreader modes
• Docs site QA
  • Added documentation
  • Props have proper autodocs (using @default if default values are missing) and playground toggles
  • Checked Code Sandbox works for any docs examples
• Code quality checklist
  • Added or updated jest and cypress tests
  • Updated visual regression tests
• Release checklist
  • A changelog entry exists and is marked appropriately
  • If applicable, added the breaking change issue label (and filled out the breaking change checklist)
  • If the changes unblock an issue in a different repo, smoke tested carefully (see Testing EUI features in Kibana ahead of time)
• Designer checklist
  • If applicable, file an issue to update EUI's Figma library with any corresponding UI changes. (This is an internal repo, if you are external to Elastic, ask a maintainer to submit this request)

[weronikaolejniczak]

I tested the visibleColumns and it works as expected 👍🏻 I have one doubt that I think could potentially cause confusion for the consumers so it's worth tackling, that being said everything else is fine so I'll leave an approve. 🟢

[elasticmachine]

💚 Build Succeeded

• Buildkite Build
• Commit: d73137d
• Documentation website
• Storybook

History

• 💚 Build #1903 succeeded 7ff74d9

cc @mgadewoll

[elasticmachine]

💚 Build Succeeded

• Buildkite Build
• Commit: d73137d

History

• 💚 Build #5195 succeeded 7ff74d9

cc @mgadewoll