signals

asyncComputed

Creates a computed signal where the computation is asynchronous.

let signal = asyncComputed(async () => {
  let input = this.input()
  return await getData(input)
})

Or with initial value:

let signal = asyncComputed(async () => {
  let input = this.input()
  return await getData(input)
}, {
  initialValue: []
})

memorizedSignal

Create a signal where the value is stored in localStorage. Thus, the value of the signal is memorized across sessions.

let signal = memorizedSignal({
  key: 'demo.showFields',
  initialValue: true
})

Memorized signals are tied to a profile in the MemoryProfileService. The micro-radiant uses this to memorize different settings for each project.

If you wish to disable this and have a single memorized value across all profiles, use the global option:

let signal = memorizedSignal({
  key: 'demo.showFields',
  initialValue: true,
  global: true
})

filter

Filter an array based on a search string provided by a filter field component.

let filteredList = filter(this.list)

Use the glint-field-field component to provide a search input field.

<glint-panel>
  <div *glintPanelHeader>
    <glint-filter-field/>
  </div>
  @for(item of filteredList(); track item) {
    <div>{{item}}</div>
  } @empty {
    <div>No items match</div>
  }
</glint-panel>

Or set the search string with a custom component:

class MyFilterInputComponent {
  private filterProvider = inject(FILTER)
  
  setFilter(query: string) {
    this.filterProvider.search = query
  }
  
}

FILTER provider

This mechanism requires a provide for the FILTER injection token which should be provided by one of the enclosing components. This provides must implement the FilterProvider interface. The micro-radiant plugins provide a filter implementation with the ModelFilterProvider class.