Custom Suggestors¶
Key to the Attribute Condition editor is the ability to provide value suggestions for the Attribute as a user types.
Molten provides several built-in Suggestors for Imagine based Attributes that provide values for a given Attribute valueType. For instance, the StringAttributeValueSuggestor provides auto-suggest results based on the existing values for the Attribute among existing devices filtered by the user's text input. The UnitAttributeValueSuggestor provides suggestions for all of the available unit types for a particular unit (e.g. temperature Attributes are given suggestions for C, F, K, and R unit types).
When registering a custom Attribute, it is necessary to also register a custom Suggestor to provide possible values for the user to select from. A Suggestor is simple an instance of a class that provides a suggest
method which takes a single argument, the value that the user has entered. Take for example the Full Name Attribute example from the previous section. An implementation of a suggestor for that Attribute might look like this:
import { Attributes } from '@leverege/ui-attributes'
import { GlobalState } from '@leverege/ui-redux'
export default class MakeModelYearValueSuggestor {
constructor( type, opts = {} ) {
this.attribute = opts.attribute
this.actions = opts.actions
this.relationship = opts.relationship
this.objectType = opts.objectType
this.firtNameAttribute = Attributes.getAttribute( 'person.firstName', 'person' )
this.lastNameAttribute = Attributes.getAttribute( 'person.lastName', 'person' )
}
async suggest( value ) {
const [ firstName, lastName ] = ( value || '' ).split( ' ' )
const filters = []
if ( firstName ) {
filters.push( {
type : 'expression',
value : `*${firstName}*`,
field : this.firstNameAttribute.blueprint.field,
kind : 'queryString',
analyzeWildcard : true
} )
}
if ( lastName ) {
filters.push( {
type : 'expression',
value : `*${lastName}*`,
field : this.lastNameAttribute.blueprint.field,
kind : 'queryString',
analyzeWildcard : true
} )
}
const results = await GlobalState.dispatch(
this.actions.search( {
filter : {
type : 'logical',
operator : 'or',
conditions : filters
},
queryName : 'search.FullNameValueSuggestor'
} )
)
const suggestions = results.items.map( ( item ) => {
return `${this.firstNameAttribute.get( item )} ${this.lastNameAttribute.get( item )}`
} )
if ( suggestions && suggestions.length > 0 ) {
return suggestions
}
return []
}
}