Sanity-plugin-computed-field NPM

sanity-plugin-computed-field

This plugin computes a field's value based on other fields or relationships with its document. In other words, this field memoizes a value in a document using GROQ to lookup and custom javascript to compute the value from those GROQ results. See this post for more info on the plugin.

Installation

For Sanity v2

Use sanity-plugin-computed-field version v1.*. See v1 docs for configuration of v1 computed field.

sanity install sanity-plugin-computed-field@^1.0.2

For Sanity v3

Use sanity-plugin-computed-field version 2 or above

sanity install sanity-plugin-computed-field@^2.0.0

Configure

Now you may use the computedNumber, computedText, computedString and computedBoolean types. These are just number, text, string, and boolean values under the hood respectively, but you have have them computed automatically via documentQuerySelection and reduceQueryResult.

documentQuerySelection is a groq query with respect to the current document being viewed in Sanity Studio.

  defineField({
    name: '...', //Give your sanity field a name, title, description
    title: '...',
    description: '...',
    type: 'computedNumber',
    readOnly: true or false // set to true to disable setting this value manually
    options: {
      buttonText: 'Refresh',
      documentQuerySelection: `
      "numberOfReferences": count(*[references(^._id)])
      `,
      reduceQueryResult: (result: {
        draft?: {numberOfReferences: number}
        published: {numberOfReferences: number}
      }) => {
        // When 'Refresh' button is pressed, this value will be set to result.published.numberOfReferences, from the documentQuerySelection above.
        return result.published.numberOfReferences
      },
    },
  }),

`options.documentQuerySelection` (required)

Defines the body of the query on the current document being edited. The result is fed into reduceQueryResult, containing both the draft and published versions of the document. draft may be undefined if no draft exists. This selection is made every time "Regenerate" is clicked.

`options.reduceQueryResult` (required)

Returns the value to populate computed field, based on the query result of 'documentQuerySelection'. This function is called every time "Regenerate" is clicked and the GROQ query successfully is made.

`options.buttonText` (default `"Regenerate"`)

What text should be in button user clicks to recompute the value.

A Comprehensive Example

See docs/v2/movies for full example.

This uses the movies sanity template for a new project (from sanity init), but adds some computed fields to synthesize if/when the next movie screenings are taking place.