Version: datastore-0.5.0

React Native - using Datastore for Mobile

Offix Datastore provides support for indexeddb by default. When using datastore in React Native is necessary to override the default storage and network implementations.

Storage#

The Datastore provides an SQLite adapter out of the box. In order to enable this storage options can be passed as the second paramater to the datastore constructor.

...
import { SQLiteAdapter } from "offix-datastore/dist/storage/adapters/sqlite/SQLiteAdapter";
...

export const datastore = new DataStore({
  // datastore config
}, {
  storeAdapter: new SQLiteAdapter("offixdb", "1.0") // name & version
});

Network Status#

Since the default implementation relies on the browser window.navigator for network connectivity, it is necessary to provide an implementation of the NetworkStatus interface for native application. This can be done with Capacitor or @react-native-community/netinfo for React Native.

import { NetworkStatus, NetworkStatusEvent } from "offix-datastore";
import Observable from "zen-observable";
import NetInfo from "@react-native-community/netinfo";

/**
 * Uses web api to detect network status changes
 */
export class ReactNativeNetworkStatus implements NetworkStatus {

  public observable: Observable<NetworkStatusEvent>;

  constructor() {
    this.observable = new Observable((observer) => {
      NetInfo.addEventListener((state) => observer.next({ isOnline: state.isConnected }));
    });
  }

  public subscribe(observer: ZenObservable.Observer<NetworkStatusEvent>) {
    return this.observable.subscribe(observer);
  }

  public isOnline(): Promise<boolean> {
    return new Promise((resolve, reject) => {
      NetInfo.fetch()
        .then((state) => resolve(state.isConnected))
        .catch((err) => reject(err));
    });
  }
}

This can then be provided as in the config for the Datastore

export const datastore = new DataStore({
  // normal config options
  ...
  networkStatus: new ReactNativeNetworkStatus(),
  ...
}, {
  // custom engine config
});