json

Helpers for loading JSON data asynchronously.

// access like this (preferred)
import {loadAllJSON} from "@liqvid/utils/json";

// or like this (legacy)
import {Utils} from "liqvid";
const {loadAllJSON} = Utils.json;

These can be inserted with the @json macro.

Usage

import {loadJSON, loadAllJSON, getJSON} from "@liqvid/utils/json";

/* let Typescript know what we're loading */
declare module "@liqvid/utils/json" {
  interface GetJSONMap {
    "recordings": {
      /* add types here */
    };
  }
}

/* Option 1: load all at once, then access synchronously */
loadAllJSON().then(() => {
  ReactDOM.createRoot(document.querySelector("main")).render(<MyVideo />);
});

function MyVideo() {
  const recordings = getJSON("recordings");
  // do stuff with recordings
}

/* Option 2: load asynchronously */
loadJSON("recordings").then(recordings => {
  // do stuff with recordings
});

GetJSONMap

TypeScript interface for typing the JSON data you load. This is empty, you extend it in your code as in the example above.

getJSON()

Access a preloaded JSON record synchronously.

getJSON<K extends keyof GetJSONMap>(key: K): GetJSONMap[K]

loadAllJSON()

Preload all JSON resources.

loadAllJSON(): Promise<void>

loadJSON()

Load a JSON record asynchronously.

loadJSON<K extends keyof GetJSONMap>(key: K): Promise<GetJSONMap[K]>