Search
This is the official documentation of the @forestadmin/agent
Node.js agent.
In Forest Admin, pages that show lists of records have a free-text search bar on top of them.

Search modes
2 search modes are supported: "normal" and "extended".
All searches start by being a "normal" search.
If the records users are looking for are not found, it is possible to trigger an "extended" search from the footer.

Default behavior
Natively, the search behavior is to seek value occurrences within columns of the Collection (in normal mode), and columns of the Collections of direct relations (in extended mode).
By default, Forest Admin will search only in specific columns, depending on their type:
Enum
Column is equal to the search string (case-insensitive).
Number
Column is equal to the search string (if the search string is numeric).
String
Column contains the search string (case-insensitive).
Uuid
Column is equal to the search string.
Other types
Column is ignored by the default search handler.
Customization
If you want to make a column searchable, you must define the right operator to allow the search to be performed. Please refer to the Operators to support table to know which operator to define.
Alternatively, you may want to change how the search behaves in your admin panel.
For instance:
search only on the columns that are relevant to your use case.
use full-text indexes (i.e. Postgres
tsquery
andtsvector
, Algolia, Elastic search, ...)
To customize the search behavior, you must define a handler that returns a ConditionTree
.
Extending the default search
The context received by the function replaceSearch
can have access to the default search behavior and extend it:
agent.customizeCollection('people', collection => {
collection.replaceSearch((searchString, extendedMode, context) => {
// This function in the context gives access to the default search behavior
// including the advanced search
return context.generateSearchFilter(searchString, {
// Include fields from the first level of relations when true
extended: extendedMode,
// Remove these fields from the default search fields
excludeFields: ['gender'],
// Add these fields to the default search field
includeFields: ['address:street'],
// Replace the list of default searched field by these fields
// onlyFields: [],
});
});
});
The condition tree returned by generateSearchFilter
can be combined with other custom conditions:
agent.customizeCollection('people', collection => {
collection.replaceSearch((searchString, extendedMode, context) => {
const defaultCondition = context.generateSearchFilter(searchString, {
extended: extendedMode,
});
return {
aggregator: 'Or',
conditions: [
defaultCondition,
{ field: 'address:street', operator: 'IContains', value: searchString },
],
};
});
});
Making the search case-sensitive by default
In this example, we use the searchExtended
condition to toggle between case-sensitive and insensitive searches.
agent.customizeCollection('people', collection => {
collection.replaceSearch((searchString, extendedMode) => {
const operator = extendedMode ? 'Contains' : 'IContains';
return {
aggregator: 'Or',
conditions: [
{ field: 'firstName', operator, value: searchString },
{ field: 'lastName', operator, value: searchString },
],
};
});
});
Changing searched columns
const productReferenceRegexp = /^[a-f]{16}$/i;
const barCodeRegexp = /^[0-9]{10}$/i;
agent.customizeCollection('products', collection => {
collection.replaceSearch(async (searchString, extendedMode, context) => {
// User is searching using a product reference.
if (productReferenceRegexp.test(searchString))
return context.generateSearchFilter(searchString, {
onlyFields: ['reference'],
});
// User is search a barcode
if (barCode.test(searchString))
return context.generateSearchFilter(searchString, {
onlyFields: ['barCode'],
});
// User is searching something else, let's search in the product name only
if (!extendedMode)
return context.generateSearchFilter(searchString, { onlyFields: ['name'] });
// In "extended" mode, we search on name, description and brand name
return context.generateSearchFilter(searchString, {
onlyFields: ['name', 'description', 'brand:name'],
});
});
});
Calling an external API
If your data is indexed using a SaaS, an external store, or a full-text index, you can call it in the search handler.
const algoliasearch = require('algoliasearch');
const client = algoliasearch('APPLICATION_ID', 'WRITE_API_KEY');
const index = client.initIndex('indexName');
agent.customizeCollection('products', collection =>
collection.replaceSearch(async (searchString, extendedMode, context) => {
const { hits } = index.search(searchString, {
attributesToRetrieve: ['id'],
hitsPerPage: 50,
});
return { field: 'id', operator: 'In', value: hits.map(h => h.id) };
});
);
Disable the search
By default, the search bar is displayed when at least one field supports the operator used for search based on its type (see this table).
You can remove the search bar by disabling the search on a collection:
agent.customizeCollection('Products', collection => {
collection.disableSearch();
});
Last updated
Was this helpful?