instea/react-native-popup-menu

"Menu name cannot be changed" error when dynamically updating FlatList (or FlashList)

bogdan-boksan-ananas opened this issue · 1 comments

I have a list of items dynamically updated using pull to refresh. The items are rendered in a FlashList specifically, but the issue is in FLatList as well. When I update items, I get Menu name cannot be changed warning in the console and clicking on the last added item doesn't open the menu and I get a new warning that says "menu with name menu_19 does not exist".

This is how I'm rendering the popup menu:

<Menu name={name} style={styles.container}>
      <MenuTrigger customStyles={{ triggerOuterWrapper: styles.trigger }} />
      <MenuOptions optionsContainerStyle={styles.menuOptions}>
        {renderButtons()}
      </MenuOptions>
</Menu>

where "name" is just 'menu + ${index}'

well, the warning tells you that you can't change the name...

options are:

  1. don't use name - you don't need it unless you want to controll it programatically - but I guess you can use also ref instead
  2. use stable name - it is always prefered to use "business" key/names instead of IDs
  3. use React "key" to force create new menu instance https://react.dev/learn/rendering-lists