New Twiddle

components.todo-item.js

import Ember from 'ember';

export default Ember.Component.extend({
  tagName: 'li',
  click() {
    this.toggleProperty('todo.done');
  }
});

components.todo-list.js

import Ember from 'ember';

export default Ember.Component.extend({
  store: Ember.inject.service(),

  todosOrder: ['done:asc', 'name:asc'],
  todosSorted: Ember.computed.sort('todos', 'todosOrder'),
  actions: {
    addTodo() {
      let newTodoText = this.get('newTodoText');
      this.get('store').createRecord('todo', {name: newTodoText, done: false})
      this.set('newTodoText', '');
    }
  }
});

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

models.todo.js

import Model from "ember-data/model";
import attr from "ember-data/attr";

export default Model.extend({
  name: attr('string'),
  done: attr('boolean')
});

routes.application.js

import Ember from 'ember';

export default Ember.Route.extend({
  beforeModel() {
  let todos = [
    { name: 'one', done: false},
    { name: 'two', done: true},
    { name: 'three', done: false}
  	]
  todos.forEach( todo => this.store.createRecord('todo', todo));
  },
  model() {
    return this.store.peekAll('todo');
  }
});

templates.application.hbs

<h1>Welcome to {{appName}}</h1>

{{todo-list  todos=model}}

{{outlet}}

templates.components.todo-item.hbs

{{#if todo.done}}
🐹
{{/if}}
{{todo.name}}

templates.components.todo-list.hbs

<h2> Todo List </h2>

{{input value=newTodoText enter=(action 'addTodo')}}

{{#each todosSorted as |todoElement|}}
  {{todo-item todo=todoElement }}
{{else}}
  <p>Yeay, you have done all!!! </p>
{{/each}}


{{todo}}

twiddle.json

{
  "version": "0.12.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.12.0",
    "ember-template-compiler": "2.12.0",
    "ember-testing": "2.12.0"
  },
  "addons": {
    "ember-data": "2.12.1"
  }
}