useSetCheckpointCallback
The useSetCheckpointCallback primitive returns a parameterized callback that can be used to record a checkpoint of a Store into a Checkpoints object that can be reverted to in the future.
useSetCheckpointCallback<Parameter>(
getCheckpoint?: (parameter: Parameter) => string,
checkpointsOrCheckpointsId?: MaybeAccessor<undefined | CheckpointsOrCheckpointsId>,
then?: (checkpointId: MaybeAccessor<string>, checkpoints: Checkpoints, label?: string) => void,
): ParameterizedCallback<Parameter>| Type | Description | |
|---|---|---|
getCheckpoint? | (parameter: Parameter) => string | An optional function which returns a string that will be used to describe the actions leading up to this checkpoint, based on the parameter the callback will receive (and which is most likely a DOM event). |
checkpointsOrCheckpointsId? | MaybeAccessor<undefined | CheckpointsOrCheckpointsId> | The |
then? | (checkpointId: MaybeAccessor<string>, checkpoints: Checkpoints, label?: string) => void | A function which is called after the checkpoint is set, with the new checkpoint |
| returns | ParameterizedCallback<Parameter> | A parameterized callback for subsequent use. |
This primitive is useful, for example, when creating an event handler that will set the checkpoint. In this case, the parameter will likely be the event, so that you can use data from it as the checkpoint label.
The optional first parameter is a function which will produce the label that will then be used to name the checkpoint.
For convenience, you can optionally provide a then function which will be called just after the checkpoint has been set.
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 {useSetCheckpointCallback} 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');
useSetCheckpointCallback(() => 'saved', checkpoints)();
dispose();
});
Since
v8.3.0