Skip to content

filter + filterParams Examples

The filter property allows you to limit which documents are shown in a list using a GROQ filter string or a function.

Basic Filtering

You can use filter alongside schemaType to show a subset of documents.

ts
{
  title: 'Active Authors',
  schemaType: 'author',
  filter: 'isActive == true',
}

Organized Sub-sections

Filters are commonly used within children to create organized views of the same document type.

ts
{
  title: 'Authors',
  children: [
    {
      title: 'Active',
      schemaType: 'author',
      filter: 'isActive == true',
    },
    {
      title: 'Inactive',
      schemaType: 'author',
      filter: 'isActive != true',
      hideAddButton: true,
    },
  ],
}

Using Filter Parameters

Use filterParams to pass dynamic values to your GROQ query.

ts
{
  title: 'Authors from GROQ',
  filter: '_type == $author',
  filterParams: {
    author: 'author',
  },
}

Multiple Document Types

You can create a mixed list of multiple document types by using a more complex GROQ filter.

ts
{
  title: 'Authors + Homepage from GROQ',
  filter: '_type == $author || _type == $homepage',
  filterParams: {
    author: 'author',
    homepage: 'homepage',
  },
}

Function-based Filtering

You can pass a function to both filter and filterParams to dynamically control the list based on the current user. The following two examples achieve the exact same result:

1. Using Dynamic Filter String

In this approach, you return the entire GROQ string from the filter function.

ts
{
  title: 'My Posts',
  schemaType: 'post',
  filter: ({ currentUser }) => `author == "${currentUser.id}"`,
}

2. Using Dynamic Filter Parameters

In this approach, you keep the filter string static and use a function for filterParams to pass the user ID.

ts
{
  title: 'My Posts',
  schemaType: 'post',
  filter: 'author == $userId',
  filterParams: ({ currentUser }) => ({
    userId: currentUser.id,
  }),
}

3. Combining Both

You can also combine both for more complex logic.

ts
{
  title: 'My Role-based Documents',
  schemaType: 'post',
  filter: ({ currentUser }) => currentUser.roles.includes('administrator')
    ? 'status == $status'
    : 'author == $userId && status == $status',
  filterParams: ({ currentUser }) => ({
    status: 'published',
    userId: currentUser.id,
  }),
}

Combined with Roles & Workspaces

Filters work seamlessly with other properties like roles and workspaces.

ts
{
  title: 'Internal Authors',
  schemaType: 'author',
  workspaces: ['admin-workspace'],
  roles: ['administrator'],
  filter: 'isInternal == true',
}

Released under the MIT License.