todo-item-component

component.ts

// src/ui/components/todo-item/component.ts

import Component from '@glimmer/component';

export default class TodoItem extends Component {

  delete() {
    let item = this.args.item;
    this.args.deleteItem(item);
  }

  toggle() {
    let item = this.args.item;
    this.args.toggleItem(item);
  }

};

you could bypass this by doing either:

<todo-item
    @item={{item}}
    @deleteItem={{action deleteItem item}}
    @toggleItem={{action toggleItem item}}
    />

+

  <button onclick={{action @deleteItem}}>

or

  <button onclick={{action delete @item}}>

@locks, oh! That's actually even nicer! :)