Template doesn't automatically add new record saved to store

I've got a table of posts retrieved from the store. You can add a post by clicking on a button. How can I add the new post automatically to the template?

This is the controller including addPost action which is responsible for creating a new post.

import Ember from 'ember';

export default Ember.ArrayController.extend({
  actions: {
    addPost: function() {

      var self = this
      var store = this.store
      var post = store.createRecord('post', {
        title: "New Post",
        permalink: "permalink "
      })

      store.find('category', { permalink: "technology"}).then(function(category) {
        var cat = category.get('firstObject');
        post.set('category', cat);
        post.save()
      });
    }
  }

});

This is the route

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
     return this.store.find('post', { sort:'createdAt desc'});
  }
});

This is the template

<table>
  <tbody>
    <a {{ action 'addPost' }}class="button">Add Post</a>
    {{#each}}
    <tr>
      <td>{{ title }}</td>
      <td>{{ category.name }}</td>
      <td>{{time-format createdAt 'YYYY-MM-DD'}}</td>
    </tr>
    {{/each}}
  </tbody>
</table>