search

mediacloud / web-tools

The shared repository for Media Cloud web apps (Explorer, Source Manager, Topic Mapper)
https://tools.mediacloud.org
Apache License 2.0
64 stars 30 forks source link

refactor all "UNSAFE_" calls to newer react lifecycle calls #1940

Open cindyloo opened 4 years ago

cindyloo commented 4 years ago

the following are deprecated: componentWillMount componentWillRecieveProps componentWillUpdate

according to this link we should implement componentWillReceiveProps-> getDerivedStateFromProps

componentWillUpdate -> getSnapshotBeforeUpdate getSnapshotBeforeUpdate handles what componentWillUpdate and componentDidUpdate would have done just before the DOM gets updated.

componentWillMount -> componentDidMount

this affect 36 matches across 27 files. Do we feel it is necessary at this point to do? When we move to React v17, it will be....

rahulbot commented 4 years ago

When that deprecation got release, I ran the script that marked them all as UNSAFE_. At that point I was daunted by refactoring to fix all of them, because we had ongoing features in development. It is technical debt we will have to pay in order to keep up with React updates soon, lest we fall behind like we have with react-router (#562). When to pay it is the tricky question.

dsjen commented 4 years ago

Thanks for digging up info on how to do it and I agree that it's a big endeavor. We don't have to tackle this all at once and can pick a file at a time. I bet once we establish a pattern the task will be less daunting, and we can divide and conquer.

cindyloo commented 4 years ago

I propose sectioning off first: common/ && common/mediapicker (10 files or so) in tandem or one then the other: sources && explorer (10 files or so) topics (13 files or so)

cindyloo commented 4 years ago

I found this article very helpful for refactoring https://itnext.io/react17-or-how-to-get-rid-of-componentwillreceiveprops-c91f9a6f6f03

cindyloo commented 4 years ago

mediapicker, topics, explorer now refactored and spot tested. sources will be the last section