Multiple entries have the same country code [IO]

[tomaszrvvup]

Context

Library version: 1.6.11
Environment: [email protected]

I'm using the data from country codes to create a list, where each country is identified by the country code.

import countryCodes from 'country-codes-list';

const countryData = countryCodes.customArray({
  id: '{countryCode}',
  ...
});

This list is then uses as select options, using the country code as a select option value. I'm getting the following error.

Encountered two children with the same key, `IO`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.

This issue is specific to the select library that we're using, not directly to country-codes-list, but highlights a problem that could be solved on the library level.

Problem

Going over the countries configuration file, there are two entries for IO locale, which are the following:

https://github.com/LucianoGanga/country-codes-list/blob/master/countriesData.js#L1459

  {
    "countryNameEn": "British Indian Ocean Territories",
    "countryNameLocal": "British Indian Ocean Territories",
    "countryCode": "IO",
    "currencyCode": "USD",
    "currencyNameEn": "United States dollar",
    "tinType": "",
    "tinName": "",
    "officialLanguageCode": "en",
    "officialLanguageNameEn": "English",
    "officialLanguageNameLocal": "English",
    "countryCallingCode": "246",
    "areaCodes": [],
    "region": "Indian Ocean",
    "flag": "🇮🇴",
  }

https://github.com/LucianoGanga/country-codes-list/blob/master/countriesData.js#L3859

  {
    "countryNameEn": "British Indian Ocean Territory",
    "countryNameLocal": "British Indian Ocean Territory",
    "countryCode": "IO",
    "currencyCode": "USD",
    "currencyNameEn": "United States Dollar",
    "tinType": "",
    "tinName": "",
    "officialLanguageCode": "en",
    "officialLanguageNameEn": "English",
    "officialLanguageNameLocal": "English",
    "countryCallingCode": "246",
    "areaCodes": [],
    "region": "Indian Ocean",
    "flag": "🇮🇴",
  },

The only difference between these two entries is the name (Territories vs Territory), the rest of the data for these entries is identical.

Question

Why are there two entries with the same country code? Do they represent different countries, even though all data associated with them is the same, expect for the name? Could we remove one of the two entries?

Country code is the field that's most likely to be used as the identifier / value in user interfaces. Often, they have to be unique to work properly, so perhaps it might be good to ensure there are no duplicates on the library level.

[christopherbot]

A brief search indicates that "British Indian Ocean Territory" is the official name, so ideally the entry for "British Indian Ocean Territories" is removed to prevent consumers from needing to handle this near-duplicate data.