Atom state seems to be locked as read-only when using objects on Expo 49

[mphill]

Simple reproduction repo:

https://github.com/mphill/recoil-readonly

I recently upgraded to Expo 49 which is based on the following:

  "react": "18.2.0",
  "react-native": "0.72.4",

I noticed my recoil states that contain objects cannot be modified, only primitives seem to work as expected. Everything was working as expected in Expo 48.

Normally when updating the objects I would do something like this:

const copy = [...original];

copy[0].options[0].enabled = true; // indexes are hard coded for this example;

setConfig(copy);

Now the property will remain false, it can not be changed.

The only way I could work around this was to make a clone method:

function clone<T>(value: T): T {
	return JSON.parse(JSON.stringify(value)) as T;
}

const copy = clone(original);

copy[0].options[0].enabled = true; // indexes are hard coded for this example;

setConfig(copy);


// Now it works as expected

You can see this in the reproduction repo:

// Doesn't work
			<Button
				title="Enable AC (spread operator)"
				onPress={() => {
					const newCars = [...cars];
					newCars[0].options[0].selected = true;
					setCars(newCars);
				}}
			/>

// Works
			<Button
				title="Enable AC (dirty clone)"
				onPress={() => {
					const newCars = clone(cars);
					newCars[0].options[0].selected = true;
					setCars(newCars);
				}}
			/>