Sortable table component

app/pods/species/index/route.js

@@ -4,5 +4,14 @@ import AuthenticatedRouteMixin from 'simple-auth/mixins/authenticated-route-mixi
 export default Ember.Route.extend(AuthenticatedRouteMixin, {
   model: function() {
     return this.store.findAll('species');
-  }
+  },
+  setupController: function(controller, model) {
+    var tableAttrs = [
+      { name: 'Name', attr: 'speciesName' },
+      { name: 'Strains', attr: 'totalStrains' }
+    ];
+    controller.set('model', model);
+    controller.set('tableAttrs', tableAttrs);
+    controller.set('row', 'species-index-row');
+  },
 });

app/pods/species/index/template.hbs

@@ -8,30 +8,4 @@
   {{/link-to}}
 {{/if}}
 
-<table class="flakes-table">
-  <thead>
-    <tr>
-      <th {{action "setSortBy" "speciesName"}}>Name</th>
-      <th {{action "setSortBy" "totalStrains"}}>Strains</th>
-    </tr>
-  </thead>
-  <tbody>
-    {{#each species in controller}}
-      <tr>
-        <td>
-          {{#link-to 'species.show' species}}
-            {{species.speciesName}}
-          {{/link-to}}
-        </td>
-        <td>
-          {{#each species.strains as |strain index|}}
-            {{if index ","}}
-            {{#link-to 'strains.show' strain.id}}
-              {{strain.strainName}}
-            {{/link-to}}
-          {{/each}}
-        </td>
-      </tr>
-    {{/each}}
-  </tbody>
-</table>
+{{sortable-table content=model tableAttrs=tableAttrs row=row}}