Skip to content

Advanced Integrations

ReActive Record supports advanced integrations by allowing you to define hooks that wrap returned model and query instances. This is useful for scenarios where you want to automatically make models or query results reactive, proxied, or otherwise enhanced for your framework.

Runtime Configuration

How it Works

The wrapping of the instances occurs within the constructor of the reactive instance, to ensure that every single instance is wrapped correctly.

Danger Zone

If the wrapping function returns an unexpected result, the functionality of the library may break. Make sure that what ever you return is compatible with what is expected to return.

In your configuration, you can manipulate the returned reactive instances for ReactiveModels, ReactiveQueryCollections and ReactiveQueryResults.

typescript
const db = new ReactiveDatabase({
  // ...other config...
  hooks: {
    wrapReactiveModel: (model) => makeReactive(model),
    wrapReactiveQueryCollection: (collection) => makeReactive(collection),
    wrapReactiveQueryResult: (result) => makeReactive(result),
  }
})
  • wrapReactiveModel: Called for every ReactiveModel instance before it is returned to your code. Receives the original model instance and must return the (optionally wrapped) instance.
  • wrapReactiveQueryCollection: Called for every ReactiveQueryCollection instance before it is returned. Receives the original collection instance and must return the (optionally wrapped) instance.
  • wrapReactiveQueryResult: Called for every ReactiveQueryResult instance before it is returned. Receives the original result instance and must return the (optionally wrapped) instance.

Default Behavior

If you do not provide a hook, the default is an identity function (the original instance is returned unmodified).

Typescript Declaration Merging

In order to faciliate a smoother developer experience, ReActive Record provides a specific way to append new properties to ReactiveModels, ReactiveQueryCollections and ReactiveQueryResults via augmentation of the @nhtio/web-re-active-record/augmentable module.

@nhtio/web-re-active-record/augmentable provides 3 interfaces which can be augmented:

typescript
declare module '@nhtio/web-re-active-record/augmentable' {
    interface ReactiveModelAgumentations {
        myCustomProp?: string;
    }

    interface ReactiveQueryCollectionAgumentations {
        myCollectionFeature?: boolean;
    }

    interface ReactiveQueryResultAgumentations {
        myResultMeta?: unknown;
    }
}