Warning: componentWillReceiveProps has been renamed - When using <SelectMenu />

[cdedreuille]

I'm having some warning when using the component. Nothing blocking but I thought you should know.

Here is my implementation:

<FormField label="Values">
  <SelectMenu
    isMultiSelect
    title="Values"
    options={newValues}
    selected={listValues}
    onSelect={item => handleOnSelect(listValues, item)}
    onDeselect={item => handleOnDeselect(listValues, item)}
  >
    <Button width="100%">
      {nameValues || 'Select multiple values'}
    </Button>
  </SelectMenu>
</FormField>

and the warning I received

Warning: componentWillReceiveProps has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.

* Move data fetching code or side effects to componentDidUpdate.
* If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://fb.me/react-derived-state
* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

Please update the following components: VirtualList

Thanks 🙏

[akleiner2]

This is because <SelectMenu /> under the hood uses react-tiny-virtual-list. It actually looks like this package hasn't been updated in a while, but here's the line in question: https://github.com/clauderic/react-tiny-virtual-list/blob/master/src/index.tsx#L173.

Are you seeing this only in dev @cdedreuille or in a productionized env?

Might be worth forking ourselves + making the changes ourselves, or finding an alternative virtual list implementation that's better-maintained. What do y'all think? @mshwery @colinlohner

[cdedreuille]

I only see this warning in my local environment @akleiner2. So nothing too concerning for now but I just thought I would let you know.

[mshwery]

Resolved with v6.3.0!

[jd615645]

@mshwery thank you so much for trying to solve this problem
I already updated evergreen to 6.4.0, but I still get this warning message when I use <SelectMenu />

Warning: Using UNSAFE_componentWillReceiveProps in strict mode is not recommended and may indicate bugs in your code. See https://reactjs.org/link/unsafe-component-lifecycles for details.

* Move data fetching code or side effects to componentDidUpdate.
* If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state

Please update the following components: VirtualList

[mshwery]

@jd615645 my understanding is that you will always get these warnings with strict mode but they are only warnings. My changes allowed us to support React 17 (otherwise some components would have completely failed to work). I don't think we'll avoid these warnings until all of our deps are no longer using the UNSAFE_* methods, but they shouldn't break!