Failing to load more if items dont fill the screen

[snewcomer]

[Techn1x]

A solution if anyone stumbles onto this like I did - if you hide the loader/viewport element while the loader task is running, the viewport element will be re-added into the template when the task finishes (is idle), if this is still in the viewport, it'll fire the on enter hook again - and it'll repeat until items fill the screen

@tracked items = []

@task
loadItems() { ... }

@action
loadMoreItems() { this.loadItems.perform() }

{{#each this.items as |item|}}
  {{item.name}}
{{/each}}
{{#if this.loadItems.isIdle}}
  <div {{in-viewport onEnter=this.loadMoreItems}} />
{{else if this.loadItems.isRunning}}
  loading spinner
{{/if}}