Using useEffect in config - Warning: Internal React error: Expected static flag was missing. Please notify the React team.

[cs-manughian]

Describe the bug The following error appears when using the custom toast functionality in the React Native Web emulator with a useEffect hook:

console.js:273 Warning: Internal React error: Expected static flag was missing. Please notify the React team.
    at ToastUI (http://localhost:19006/static/js/bundle.js:17604:25)
    at http://localhost:19006/static/js/bundle.js:17456:22
    at LoggerProvider (http://localhost:19006/static/js/bundle.js:18089:23)
    at Toast (http://localhost:19006/static/js/bundle.js:17493:63)

I suspect this is caused by my desire to use a useEffect hook in the custom toast function:

const toastConfig = {
  customToast: ({ text1, props }: ToastConfigParams<any>) => {
    // Call external function that generates encouraging sayings; Update the saying when the text changes
    const [encouragement, setEncouragement] = useState<string>();
    useEffect(() => {
      const saying = getNextSaying();
      setEncouragement(saying);
    }, [text1]);

    return (
      <View style={styles.base}>
        ...
      </View>
    )
  }
}

Steps to reproduce Steps to reproduce the behavior:

1. Make a custom toast config
2. Add a useEffect hook that sets local state based on text1 changes
3. See error when toast appears

Expected behavior I don't expect this error to appear. The toast seems to be working in the web emulator. I have not tested on a device yet.

Screenshots Console error in Chrome, run with the expo web emulator:

Environment:

• OS: [Web Emulator]
• react-native-toast-message version: [^v2.0.0]
• react-native version [v0.72.10]

Thank you for your help!