React Native 0.5.0 - Attempted to assign to readonly property

[luukvanettinger]

Hello 👋

I upgraded @talkjs/expo from 0.4.2 to 0.5.0 and I am getting the following error in ChatBox component: TypeError: Attempted to assign to readonly property.

On version 0.4.2 it worked fine, I see that the only breaking change is the addition of @react-native-async-storage/async-storage as peer dep, but my project had already installed this package. I have tried to get it working on 0.5.0 with the code that I already had working on 0.4.2 and also tried the same code as is shown in the React Native example https://talkjs.com/docs/Reference/React_Native_SDK/API/getConversationBuilder/#example but nothing seems to work. I am running @react-native-async-storage/async-storage on version 1.17.3 but have tried different version too.

Am I missing/forgetting something, have other people ran into the same problem?

[Julianerik]

Hi there! Thanks for reporting this issue. Which version of RN are you running? Is this appearing during the build process, or when are you seeing this? is it specific to iOS or Android by any chance?

[luukvanettinger]

Thanks for the quick reply!

• "react-native": "0.68.2"
• "expo": "^45.0.0"

Nothing goes wrong in build process, app loads just fine. The error occurs when I navigate to the screen where the Chatbox component is located. If I comment out the part in the following code I do not get the error:

const conversationBuilder = TalkRn.getConversationBuilder(conversationId);

conversationBuilder.setParticipant(me);
conversationBuilder.setParticipant(other);

return (
    <TalkRn.Session appId='app_id' me={me} signature={user?.talkjsSignature}>
           <TalkRn.Chatbox
                 theme="default_mobile"
                 conversationBuilder={conversationBuilder}
           />
    </TalkRn.Session>
)

It happens on IOS, on Android I tried testing it out but now noticed that ConversationList component is not showing, no error or anything the list just doesn't show, so hard for me to test on Android. On version 0.4.2 it does show with the exact same code. Have not checked this thoroughly yet tho so could be that I am doing something wrong.

[Julianerik]

Thanks for providing this info, we'll have to dig a bit deeper into this one, let use get back to you as soon as possible 👍

[luukvanettinger]

Any update yet?

[Julianerik]

Hi there! Sorry for the delay on this one. This seems to be a build related issue that gets solved in react native 0.71 and version above. You can use this React Native helper to upgrade the react native version of your app: https://react-native-community.github.io/upgrade-helper/ Also, make sure to clear any caches: Gradle, yarn, metro e.t.c. before rebuilding your application. Hope this can help you out! 👍

[luukvanettinger]

Hi Julianerik, thanks for the reply! This week I had to upgrade the Expo SDK of my project from 45 to 48, and while doing so, I also upgraded my react-native version from 0.68.2 to 0.71.3 by running expo doctor --fix-dependencies. I tried upgrading the @talkjs/expo again with this new react native version + clearing caches but still I am getting an error when navigating to the screen which contains the component. I noticed that the error is a bit different with the updated react native version. (see screenshot below)

[vickz84259]

Closing this as the issues mentioned were fixed in v0.5.1 of our SDK.