v7.2.0

Introducing Parameterized Queries!

This release introduces parameterized queries to TinyQL - finally!

These allow you to define queries using named 'params' that you can then easily update to change the query's results - without redefining the whole query each time.

Let's take a look with a simple example:

import {createStore, createQueries} from 'tinybase';

const store = createStore().setTable('pets', {
  fido: {age: 2, species: 'dog'},
  felix: {age: 1, species: 'cat'},
  cujo: {age: 3, species: 'dog'},
});

const queries = createQueries(store).setQueryDefinition(
  'petsBySpecies',
  'pets',
  ({select, where, param}) => {
    select('age');
    where('species', param('species'));
  },
  {species: 'dog'}, // Initial param value
);

console.log(queries.getResultTable('petsBySpecies'));
// -> {fido: {age: 2}, cujo: {age: 3}}

// Update the 'species' param to 'cat' to change the results:
queries.setParamValue('petsBySpecies', 'species', 'cat');
console.log(queries.getResultTable('petsBySpecies'));
// -> {felix: {age: 1}}

You can of course have multiple params in a query definition, and use them in any part of the query definition that you would like. Listeners also work as expected - if you are listening to a query's results, and you change a param that affects those results, your listener will be called accordingly.

This is TinyBase so you should not be too surprised... but params themselves are reactive! You can get and listen to their values with the getParamValue method and addParamValueListener method, for example.

For React users, we also shipped a bunch of new hooks that cover params in exactly the way you would expect, including the useSetParamValueCallback hook and the useSetParamValuesCallback hook, which let you easily update param values from, say, an event handler in your application.

We know this has been a long-awaited feature, so we hope you enjoy it! See the TinyQL guide for more details, and please let us know how it goes!

Demos

We have updated the Movie Database demo to use parameterized queries, and as a result is more efficient and easier to (we think) understand. See the yearGenreMovies, directedMovies, and appearedMovies queries to see params in action.

We have also updated the Car Analysis demo to use just one single parameterized query for the whole app!

Full API additions

This release includes the following new Queries interface methods:

• getParamValues method
• getParamValue method
• setParamValues method
• setParamValue method
• addParamValuesListener method
• addParamValueListener method

It also includes the following new React hooks:

• useParamValues hook
• useParamValue hook
• useSetParamValuesCallback hook
• useSetParamValueCallback hook
• useParamValuesListener hook
• useParamValueListener hook

Check out the API docs for each. They should seem very familiar.

Please check out this new release and let us know what you think!