[flow] make EPropNotReadable ReactDeepReadOnly deferred_in_speculation

Summary:
In
```
component Foo(arr: Array<number>) {
    arr.sort((a, b) => {
        return 1;
    });
    return null;
}
```
the call to `.sort` is an error, but we should still be able to contextually type `a` and `b`.

This diff makes EPropNotReadable ReactDeepReadOnly error deferred_in_speculation, which means that it won't hinder hint computation.

Changelog: [internal]

Reviewed By: SamChou19815

Differential Revision: D67320625

fbshipit-source-id: 1a2fe1a1d6cf00a064d67154e258be2b98fa263b

src/typing/errors/error_message.ml

@@ -2868,7 +2868,8 @@ let defered_in_speculation = function
   | EAnyValueUsedAsType _
   | EValueUsedAsType _
   | EUnusedPromise _
-  | EImplicitInstantiationUnderconstrainedError _ ->
+  | EImplicitInstantiationUnderconstrainedError _
+  | EPropNotReadable { use_op = Frame (ReactDeepReadOnly _, _); _ } ->
     true
   | _ -> false
 

tests/react_rules/dro.js

@@ -140,3 +140,10 @@ component WriteToComponentProperty(x: {}) {
   declare const obj: React$Immutable<O>;
   ({ n: obj.n }) as React$Immutable<O>; // ok
 }
+
+component NonInterferenceWithInference(arr: Array<number>) {
+  arr.sort((a, b) => { // only dro error
+      return 1;
+  });
+  return null;
+}

tests/react_rules/react_rules.exp

@@ -412,23 +412,6 @@ References:
                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [1]
 
 
-Error ----------------------------------------------------------------------------------------------------- dro.js:84:13
-
-Cannot call `droarr.push` because number [1] is incompatible with unknown element of empty array [2] in array element of
-array element. Arrays are invariantly typed. See
-https://flow.org/en/docs/faq/#why-cant-i-pass-an-arraystring-to-a-function-that-takes-an-arraystring-number.
-[incompatible-call]
-
-   dro.js:84:13
-   84| droarr.push([]); // error
-                   ^^ [2]
-
-References:
-   dro.js:83:51
-   83| declare const droarr: React$Immutable<Array<Array<number>>>;
-                                                         ^^^^^^ [1]
-
-
 Error ------------------------------------------------------------------------------------------------------ dro.js:85:1
 
 Cannot call `droarr[0].push` because property `push` is not readable. Values annotated using `React.Immutable` [1] are
@@ -677,6 +660,22 @@ References:
                                            ^^^^^ [1]
 
 
+Error ----------------------------------------------------------------------------------------------------- dro.js:145:3
+
+Cannot call `arr.sort` because property `sort` is not readable. React component properties [1] and their nested props
+and elements cannot be written to. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#props).
+[react-rule-unsafe-mutation]
+
+   dro.js:145:3
+   145|   arr.sort((a, b) => { // only dro error
+          ^^^^^^^^
+
+References:
+   dro.js:144:40
+   144| component NonInterferenceWithInference(arr: Array<number>) {
+                                               ^^^^^^^^^^^^^^^^^^ [1]
+
+
 Error ------------------------------------------------------------------- error.invalid-access-ref-during-render.js:8:17
 
 Cannot read `current` from `ref` [1] because `ref` values may not be read during render.