EmberJS 2.7 - infinity-model add-on inside a component - how to 'bubble up' the infinityLoad action

I am using the awesome plugin infinity-loader. It works great, providing I use it on the template of the route it is bound to.

But like a lot of people, now I decided to try and use it on a component. Oh dear. I understand how to bubble/send actions like this fiddle shows and this question explains.

Sadly this, this and this did not help.

What is strange is that after the first page, the Infinity add-on fires the action infinityLoad - if I remove my handler in my component, then I see the error 'nothing handled' the action in the console, so I know that the action is firing when I scroll to the end of the list.

But when my component 'bubbles it up' it just seems to get swallowed in the route and does not cause the add-on to fire its own internal handler.

/components/employee-list.hbs

/templates/components/employee.hbs

<div class="list-group">
    
      <...display some employee stuff ...>
    
</div>

/routes/employees/index.js

import Ember from 'ember';
import InfinityRoute from "ember-infinity/mixins/route";

    export default Ember.Route.extend(InfinityRoute, {
        totalPagesParam: "meta.total",

        model() {
            return this.infinityModel("employee", { perPage: 10, startingPage: 1 });
        }
    });

/components/employee-list.js import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    infinityLoad() {
      this.sendAction('sendThisAction');
    }
  }
});