TinyBase logoTinyBase β

useCreateMetrics

The useCreateMetrics primitive is used to create a Metrics object within a Solid application with convenient memoization.

useCreateMetrics(
  store: MaybeAccessor<undefined | Store>,
  create: (store: Store) => Metrics,
): Accessor<Metrics | undefined>
TypeDescription
storeMaybeAccessor<undefined | Store>

A reference to the Store for which to create a new Metrics object.

create(store: Store) => Metrics

A function for performing the creation steps of the Metrics object for the Store, plus any additional steps such as adding definitions or listeners, and returning it.

returnsAccessor<Metrics | undefined>

A reference to the Metrics object.

It is possible to create a Metrics object outside of the Solid app with the regular createMetrics function and pass it in, but you may prefer to create it within the app, perhaps inside the top-level component. To prevent a new Metrics object being created every time the app renders or updates, since v5.0 this primitive performs the creation in an effect. As a result it will return undefined on the brief first render (or if the Store is not yet defined), which you should defend against.

This primitive ensures the Metrics object is destroyed whenever a new one is created or the component is unmounted.

Example

This example creates the TinyBase objects needed by the Solid primitive or component and calls it from within a reactive root.

import {createRoot} from 'solid-js';
import {
  createCheckpoints,
  createIndexes,
  createMetrics,
  createQueries,
  createRelationships,
  createStore,
} from 'tinybase';
import {useCreateMetrics} from 'tinybase/ui-solid';

createRoot((dispose) => {
  const store = createStore()
    .setTables({
      pets: {
        fido: {species: 'dog', color: 'brown', next: 'felix'},
        felix: {species: 'cat', color: 'black'},
      },
      species: {dog: {price: 5}, cat: {price: 4}},
    })
    .setValues({open: true});
  const metrics = createMetrics(store).setMetricDefinition(
    'highestPrice',
    'species',
    'max',
    'price',
  );
  const indexes = createIndexes(store).setIndexDefinition(
    'bySpecies',
    'pets',
    'species',
  );
  const relationships = createRelationships(store)
    .setRelationshipDefinition('petSpecies', 'pets', 'species', 'species')
    .setRelationshipDefinition('nextPet', 'pets', 'pets', 'next');
  const queries = createQueries(store).setQueryDefinition(
    'petColors',
    'pets',
    ({select, where, param}) => {
      select('color');
      where((getCell) => getCell('species') == param('species'));
    },
    {species: 'dog'},
  );
  const checkpoints = createCheckpoints(store);
  store.setCell('pets', 'fido', 'color', 'walnut');
  checkpoints.setCheckpoint('updated color');
  metrics.getMetric('highestPrice');
  indexes.getSliceIds('bySpecies');
  relationships.getRemoteRowId('petSpecies', 'fido');
  queries.getResultRowIds('petColors');
  useCreateMetrics(store, (store) => createMetrics(store));
  dispose();
});

Since

v8.3.0