Using synced realms resets expo navigation on every route change

I want to use react/realm in my expo project but I hit a roadblock that is a show stopper.

Whenever I turn on sync and I use “DownloadBeforeOpen” as sync config, my expo router stopps working.
Whenever I go to another screen, it flashes and brings me back to the home screen.
I printed the path segmets in the _layout.tsx and it shows that it changes the route forth and back (a lot of flashing involved).

So why on earth would that happen? Is realm resetting the whole react app and the router looses its state?

On another note, when I use “OpenImmediatiely”, it still flashes when I navigate to another screen but at least it shows the screen. However, when I want to write anything to the realm, I am greeted with the error message: “Error: Cannot write to class [ModelName] when no flexible sync subscription has been created.”

Here is the my Code for Reference:

                <AppProvider id={appId} baseUrl={baseUrl}>
                  <UserProvider fallback={Login}>
                    <RealmProvider
                      schema={[Model1, Model2
                      // deleteRealmIfMigrationNeeded
                      sync={{
                        newRealmFileBehavior: { type: OpenRealmBehaviorType.DownloadBeforeOpen },
                        flexible: true,
                        initialSubscriptions: {
                          update(subs, realm) {
                            subs.add(realm.objects(Model1));
                            // this is an embedded model and adding it here creates another error
                            // subs.add(realm.objects(Model2));
                          },
                        },
                        onError: (_session, error) => {
                          console.error(error);
                        },

                        existingRealmFileBehavior: {
                          type: OpenRealmBehaviorType.DownloadBeforeOpen,
                          // timeOut: 0,
                          // timeOutBehavior: OpenRealmTimeOutBehavior.OpenLocalRealm,
                        },
                      }}
                    >
                      <ExpoStack
                        screenOptions={{
                          headerStyle: {
                            backgroundColor: '#fff',
                          },
                          headerTintColor: '#000',
                          headerShadowVisible: false,
                          headerTitleStyle: {
                            fontWeight: 'bold',
                          },
                          contentStyle: {
                            backgroundColor: '#fff',
                          },
                        }}
                      ></ExpoStack>
                    </RealmProvider>
                  </UserProvider>
                </AppProvider>
1 Like