@fidscript/instant-react-native 0.1.0

package/src/EventSourceShim.ts

@@ -0,0 +1,285 @@
+import { type EventSourceType } from '@fidscript/instant-sdk';
+
+// Modified version of https://github.com/binaryminds/react-native-sse/blob/master/src/EventSource.js
+// that conforms to our `EventSourceType` subset of the browser-native `EventSource`.
+
+const XMLReadyStateMap = [
+  'UNSENT',
+  'OPENED',
+  'HEADERS_RECEIVED',
+  'LOADING',
+  'DONE',
+];
+
+class EventSource implements EventSourceType {
+  private ERROR = -1;
+  static CONNECTING = 0;
+  static OPEN = 1;
+  static CLOSED = 2;
+
+  private CRLF = '\r\n';
+  private LF = '\n';
+  private CR = '\r';
+
+  readonly url: string;
+
+  onopen;
+  onerror;
+  onmessage;
+
+  debug: boolean;
+
+  private status: number;
+
+  private headers = {
+    Accept: 'text/event-stream',
+    'Cache-Control': 'no-cache',
+    'X-Requested-With': 'XMLHttpRequest',
+  };
+
+  private _xhr: XMLHttpRequest | null;
+  private lineEndingCharacter: string | null;
+  private _lastIndexProcessed: number;
+
+  constructor(url) {
+    this.status = EventSource.CONNECTING;
+
+    this.lineEndingCharacter = null;
+    this._xhr = null;
+    this._lastIndexProcessed = 0;
+    this.debug = false;
+
+    if (!url || typeof url !== 'string') {
+      throw new SyntaxError('[EventSource] Invalid URL argument.');
+    }
+
+    this.url = url;
+
+    this.open();
+  }
+
+  public get readyState() {
+    if (this.status === this.ERROR) {
+      return EventSource.CLOSED;
+    }
+    return this.status;
+  }
+
+  open() {
+    try {
+      this.status = EventSource.CONNECTING;
+
+      this._lastIndexProcessed = 0;
+
+      this._xhr = new XMLHttpRequest();
+      this._xhr.open('GET', this.url, true);
+
+      for (const [key, value] of Object.entries(this.headers)) {
+        if (value !== undefined && value !== null) {
+          this._xhr.setRequestHeader(key, value);
+        }
+      }
+
+      this._xhr.onreadystatechange = () => {
+        if (this.status === EventSource.CLOSED) {
+          return;
+        }
+
+        const xhr = this._xhr!;
+
+        this._logDebug(
+          `[EventSource][onreadystatechange] ReadyState: ${XMLReadyStateMap[xhr.readyState] || 'Unknown'}(${
+            xhr.readyState
+          }), status: ${xhr.status}`,
+        );
+
+        if (
+          xhr.readyState !== XMLHttpRequest.DONE &&
+          xhr.readyState !== XMLHttpRequest.LOADING
+        ) {
+          return;
+        }
+
+        if (xhr.status >= 200 && xhr.status < 400) {
+          if (this.status === EventSource.CONNECTING) {
+            this.status = EventSource.OPEN;
+            this.dispatch('open', { type: 'open' });
+            this._logDebug(
+              '[EventSource][onreadystatechange][OPEN] Connection opened.',
+            );
+          }
+
+          this._handleEvent(xhr.responseText || '');
+
+          if (xhr.readyState === XMLHttpRequest.DONE) {
+            this._logDebug(
+              '[EventSource][onreadystatechange][DONE] Operation done.',
+            );
+            this.dispatch('error', { type: 'error' });
+          }
+        } else if (xhr.status !== 0) {
+          this.status = this.ERROR;
+          this.dispatch('error', {
+            type: 'error',
+            message: xhr.responseText,
+            xhrStatus: xhr.status,
+            xhrState: xhr.readyState,
+          });
+
+          if (xhr.readyState === XMLHttpRequest.DONE) {
+            this._logDebug(
+              '[EventSource][onreadystatechange][ERROR] Response status error.',
+            );
+          }
+        }
+      };
+
+      this._xhr.onerror = () => {
+        if (this.status === EventSource.CLOSED) {
+          return;
+        }
+
+        this.status = this.ERROR;
+        this.dispatch('error', {
+          type: 'error',
+          message: this._xhr!.responseText,
+          xhrStatus: this._xhr!.status,
+          xhrState: this._xhr!.readyState,
+        });
+      };
+
+      this._xhr.send();
+    } catch (e) {
+      this.status = this.ERROR;
+      this.dispatch('error', {
+        type: 'exception',
+        message: e.message,
+        error: e,
+      });
+    }
+  }
+
+  _logDebug(...msg) {
+    if (this.debug) {
+      console.debug(...msg);
+    }
+  }
+
+  _handleEvent(response) {
+    if (this.lineEndingCharacter === null) {
+      const detectedNewlineChar = this._detectNewlineChar(response);
+      if (detectedNewlineChar !== null) {
+        this._logDebug(
+          `[EventSource] Automatically detected lineEndingCharacter: ${JSON.stringify(
+            detectedNewlineChar,
+          ).slice(1, -1)}`,
+        );
+        this.lineEndingCharacter = detectedNewlineChar;
+      } else {
+        console.warn(
+          "[EventSource] Unable to identify the line ending character. Ensure your server delivers a standard line ending character: \\r\\n, \\n, \\r, or specify your custom character using the 'lineEndingCharacter' option.",
+        );
+        return;
+      }
+    }
+
+    const indexOfDoubleNewline = this._getLastDoubleNewlineIndex(response);
+    if (indexOfDoubleNewline <= this._lastIndexProcessed) {
+      return;
+    }
+
+    const parts = response
+      .substring(this._lastIndexProcessed, indexOfDoubleNewline)
+      .split(this.lineEndingCharacter);
+
+    this._lastIndexProcessed = indexOfDoubleNewline;
+
+    let type: string | undefined = undefined;
+    let data: string[] = [];
+    let line = '';
+
+    for (let i = 0; i < parts.length; i++) {
+      line = parts[i].trim();
+      if (line.startsWith('event')) {
+        type = line.replace(/event:?\s*/, '');
+      } else if (line.startsWith('retry')) {
+        // Ignore for our use case, we'll reconnect with a new
+        // instance on error
+      } else if (line.startsWith('data')) {
+        data.push(line.replace(/data:?\s*/, ''));
+      } else if (line.startsWith('id')) {
+        // Ignore this, not used for our use case
+      } else if (line === '') {
+        if (data.length > 0) {
+          const eventType = type || 'message';
+          const event = {
+            type: eventType,
+            data: data.join('\n'),
+            url: this.url,
+          };
+
+          this.dispatch(eventType, event);
+
+          data = [];
+          type = undefined;
+        }
+      }
+    }
+  }
+
+  _detectNewlineChar(response) {
+    const supportedLineEndings = [this.CRLF, this.LF, this.CR];
+    for (const char of supportedLineEndings) {
+      if (response.includes(char)) {
+        return char;
+      }
+    }
+    return null;
+  }
+
+  _getLastDoubleNewlineIndex(response) {
+    const doubleLineEndingCharacter =
+      this.lineEndingCharacter! + this.lineEndingCharacter!;
+    const lastIndex = response.lastIndexOf(doubleLineEndingCharacter);
+    if (lastIndex === -1) {
+      return -1;
+    }
+
+    return lastIndex + doubleLineEndingCharacter.length;
+  }
+
+  dispatch(type, data) {
+    switch (type) {
+      case 'open': {
+        if (this.onopen) {
+          this.onopen(data);
+        }
+        break;
+      }
+      case 'error': {
+        if (this.onerror) {
+          this.onerror(data);
+        }
+        break;
+      }
+      case 'message': {
+        if (this.onmessage) {
+          this.onmessage(data);
+        }
+        break;
+      }
+    }
+  }
+
+  close() {
+    if (this.status !== EventSource.CLOSED) {
+      this.status = EventSource.CLOSED;
+    }
+
+    if (this._xhr) {
+      this._xhr.abort();
+    }
+  }
+}
+
+export default EventSource;

package/src/NetworkListener.js

@@ -0,0 +1,13 @@
+import NetInfo from '@react-native-community/netinfo';
+
+export default class NetworkListener {
+  static async getIsOnline() {
+    const network = await NetInfo.fetch();
+    return network.isConnected;
+  }
+  static listen(f) {
+    return NetInfo.addEventListener((state) => {
+      f(state.isConnected);
+    });
+  }
+}

package/src/Storage.js

@@ -0,0 +1,3 @@
+import { IndexedDBStorage } from '@fidscript/instant-sdk';
+
+export default IndexedDBStorage;

package/src/Storage.native.ts

@@ -0,0 +1,91 @@
+import { StoreInterface, StoreInterfaceStoreName } from '@fidscript/instant-sdk';
+
+const version = 5;
+
+// AsyncStorage is an optional peer dependency. The `require` must sit
+// directly inside a `try` block: that's what makes Metro treat it as an
+// optional dependency (`transformer.allowOptionalDependencies`, enabled by
+// default in the Expo and React Native metro configs), so bundling doesn't
+// fail when it isn't installed. When it can't be loaded, `init` surfaces a
+// helpful error unless a custom `Store` is passed.
+let AsyncStorage: any = null;
+let asyncStorageLoadError: unknown = null;
+try {
+  AsyncStorage = require('@react-native-async-storage/async-storage').default;
+} catch (e) {
+  asyncStorageLoadError = e;
+}
+
+export class AsyncStorageStore extends StoreInterface {
+  private appId: string;
+  private dbName: StoreInterfaceStoreName;
+  constructor(appId: string, dbName: StoreInterfaceStoreName) {
+    super(appId, dbName);
+    this.appId = appId;
+    this.dbName = dbName;
+  }
+
+  private makeKey(k: string): string {
+    return `instant_${this.appId}_${version}_${this.dbName}_${k}`;
+  }
+
+  async getItem(k) {
+    const res = await AsyncStorage.getItem(this.makeKey(k));
+    if (res === null) return res;
+    return JSON.parse(res);
+  }
+
+  async setItem(k, v) {
+    await AsyncStorage.setItem(this.makeKey(k), JSON.stringify(v));
+  }
+
+  async removeItem(k: string): Promise<void> {
+    await AsyncStorage.removeItem(this.makeKey(k));
+  }
+
+  async getAllKeys(): Promise<string[]> {
+    const allKeys = await AsyncStorage.getAllKeys();
+    const keys: string[] = [];
+    const keyPrefix = this.makeKey('');
+    for (const key of allKeys) {
+      if (key.startsWith(keyPrefix)) {
+        keys.push(key.substring(keyPrefix.length));
+      }
+    }
+    return keys;
+  }
+
+  async multiSet(keyValuePairs: Array<[string, any]>): Promise<void> {
+    await AsyncStorage.multiSet(
+      keyValuePairs.map(([k, v]) => [this.makeKey(k), JSON.stringify(v)]),
+    );
+  }
+}
+
+class MissingStore extends StoreInterface {
+  constructor(appId: string, dbName: StoreInterfaceStoreName) {
+    super(appId, dbName);
+    throw new Error(
+      'Instant needs a store to persist data on device. ' +
+        'Install `@react-native-async-storage/async-storage`, ' +
+        'or pass a `Store` to `init` (e.g. from `@instantdb/react-native-mmkv` or `@instantdb/expo-sqlite`).' +
+        (asyncStorageLoadError
+          ? `\n\nLoading async-storage failed with: ${asyncStorageLoadError}`
+          : ''),
+    );
+  }
+
+  async getItem(_k: string): Promise<any> {
+    return null;
+  }
+
+  async removeItem(_k: string): Promise<void> {}
+
+  async multiSet(_keyValuePairs: Array<[string, any]>): Promise<void> {}
+
+  async getAllKeys(): Promise<string[]> {
+    return [];
+  }
+}
+
+export default AsyncStorage ? AsyncStorageStore : MissingStore;

package/src/Streams.native.ts

@@ -0,0 +1,6 @@
+import { ReadableStream, WritableStream } from 'web-streams-polyfill';
+
+export const streamConstructors = {
+  ReadableStream: ReadableStream,
+  WritableStream: WritableStream,
+};

package/src/Streams.ts

@@ -0,0 +1,5 @@
+// RN may need a polyfill for streams, so we put those in Streams.native.ts
+export const streamConstructors = {
+  ReadableStream: ReadableStream,
+  WritableStream: WritableStream,
+};

package/src/__types__/typeUtils.ts

@@ -0,0 +1,39 @@
+// Type testing utils from
+// https://github.com/type-challenges/type-challenges/blob/main/utils/index.d.ts
+
+export type Expect<T extends true> = T;
+export type ExpectTrue<T extends true> = T;
+export type ExpectFalse<T extends false> = T;
+export type IsTrue<T extends true> = T;
+export type IsFalse<T extends false> = T;
+
+export type Equal<X, Y> =
+  (<T>() => T extends X ? 1 : 2) extends <T>() => T extends Y ? 1 : 2
+    ? true
+    : false;
+export type NotEqual<X, Y> = true extends Equal<X, Y> ? false : true;
+
+// https://stackoverflow.com/questions/49927523/disallow-call-with-any/49928360#49928360
+export type IsAny<T> = 0 extends 1 & T ? true : false;
+export type NotAny<T> = true extends IsAny<T> ? false : true;
+
+export type Debug<T> = { [K in keyof T]: T[K] };
+export type MergeInsertions<T> = T extends object
+  ? { [K in keyof T]: MergeInsertions<T[K]> }
+  : T;
+
+export type Alike<X, Y> = Equal<MergeInsertions<X>, MergeInsertions<Y>>;
+
+export type ExpectExtends<VALUE, EXPECTED> = EXPECTED extends VALUE
+  ? true
+  : false;
+export type ExpectValidArgs<
+  FUNC extends (...args: any[]) => any,
+  ARGS extends any[],
+> = ARGS extends Parameters<FUNC> ? true : false;
+
+export type UnionToIntersection<U> = (
+  U extends any ? (k: U) => void : never
+) extends (k: infer I) => void
+  ? I
+  : never;

package/src/__types__/typesTests.ts

@@ -0,0 +1,86 @@
+import type { Equal, Expect, IsAny, NotAny } from './typeUtils';
+import { i, init } from '../index';
+
+const schema = i.schema({
+  entities: {
+    tbl: i.entity({
+      d: i.date().indexed(),
+      dOptional: i.date().optional(),
+    }),
+  },
+});
+
+function _testUseDatesTest() {
+  const db = init({
+    schema,
+    appId: '123',
+    useDateObjects: true,
+  });
+
+  const { data } = db.useQuery({ tbl: {} });
+  const item = data?.tbl[0];
+  if (item) {
+    type t = typeof item.d;
+    type _cases = [Expect<NotAny<t>>, Expect<Equal<t, Date>>];
+
+    type tOpt = typeof item.dOptional;
+    type _cases_2 = [
+      Expect<NotAny<tOpt>>,
+      Expect<Equal<tOpt, Date | undefined>>,
+    ];
+  }
+}
+
+function _testUseDatesFalseTest() {
+  const db = init({
+    schema,
+    appId: '123',
+    useDateObjects: false,
+  });
+
+  const { data } = db.useQuery({ tbl: {} });
+  const item = data?.tbl[0];
+  if (item) {
+    type t = typeof item.d;
+    type _cases = [Expect<NotAny<t>>, Expect<Equal<t, string | number>>];
+
+    type tOpt = typeof item.dOptional;
+    type _cases_2 = [
+      Expect<NotAny<tOpt>>,
+      Expect<Equal<tOpt, string | number | undefined>>,
+    ];
+  }
+}
+
+function _testUseDatesUndefinedTest() {
+  const db = init({
+    schema,
+    appId: '123',
+  });
+
+  const { data } = db.useQuery({ tbl: {} });
+  const item = data?.tbl[0];
+  if (item) {
+    type t = typeof item.d;
+    type _cases = [Expect<NotAny<t>>, Expect<Equal<t, string | number>>];
+
+    type tOpt = typeof item.dOptional;
+    type _cases_2 = [
+      Expect<NotAny<tOpt>>,
+      Expect<Equal<tOpt, string | number | undefined>>,
+    ];
+  }
+}
+
+function _testDataNoSchema() {
+  const db = init({
+    appId: '123',
+  });
+
+  const { data } = db.useQuery({ tbl: {} });
+  const item = data?.tbl[0];
+  if (item) {
+    type t = typeof item.d;
+    type _cases = [Expect<IsAny<t>>, Expect<Equal<typeof item.id, string>>];
+  }
+}

package/src/cli.ts

@@ -0,0 +1 @@
+export * from '@fidscript/instant-sdk';