search

kolpage / RailroadInk-Oct2019

First repo for Railroad Ink development
GNU General Public License v3.0
2 stars 0 forks source link

Most state change code in front end is operating on shallow copies #2

Open mklams opened 4 years ago

mklams commented 4 years ago

Since a lot of the properties in components props and state in the front end are using objects, mutations happening on them are directly happening on the original objects instead of a copy of the object which then gets sets as the new state (via setState(...)). While it is not causing any issues at the moment, it will likely cause problems in the future since changes to an object in one place could unexpectedly change something else that is referencing that same object. Either deep copies of the objects should be made when mutation is happening or a library like immutable.js could be used to enforce this.

mklams commented 4 years ago

Could use this library (recommend by react) https://github.com/kolodny/immutability-helper

Also use plain old JS: let newObj = JSON.parse(JSON.stringify(oldObj));

mklams commented 4 years ago

This issue will also prevent Board.tsx from being migrated from a class component to a function component since function components only look for an entirely new object when determining if state should be updated.