Add quick filter for contribution kind

app/components/contribution-list/component.js

@@ -9,6 +9,11 @@ export default Component.extend({
   tagName: 'div',
   classNames: ['contributions'],
 
+  showQuickFilter: false,
+  hideSmallContributions: false,
+  contributorId: null,
+  contributionKind: null,
+
   kredits: service(),
 
   contributorsSorting: Object.freeze(['name:asc']),
@@ -23,11 +28,11 @@ export default Component.extend({
     });
   }),
 
-  showQuickFilter: false,
-  hideSmallContributions: false,
-  contributorId: null,
+  contributionKinds: computed('contributions.[]', function() {
+    return this.contributions.mapBy('kind').uniq();
+  }),
 
-  contributionsFiltered: computed('contributions.[]', 'hideSmallContributions', 'contributorId', function() {
+  contributionsFiltered: computed('contributions.[]', 'hideSmallContributions', 'contributorId', 'contributionKind', function() {
     return this.contributions.filter(c => {
       let included = true;
 
@@ -35,7 +40,10 @@ export default Component.extend({
           c.amount <= 500) { included = false; }
 
       if (isPresent(this.contributorId) &&
-          (c.contributorId.toString() !== this.contributorId.toString())) { included = false; }
+          c.contributorId.toString() !== this.contributorId.toString()) { included = false; }
+
+      if (isPresent(this.contributionKind) &&
+          c.kind !== this.contributionKind) { included = false; }
 
       return included;
     });

app/components/contribution-list/template.hbs

@@ -11,6 +11,16 @@
         </select>
       </label>
 
+      <label class="filter-contribution-kind">
+        Kind:
+        <select onchange={{action (mut contributionKind) value="target.value"}}>
+          <option value="" selected>all</option>
+          {{#each contributionKinds as |kind|}}
+            <option value={{kind}} selected={{eq contributionKind kind}}>{{capitalize-string kind}}</option>
+          {{/each}}
+        </select>
+      </label>
+
       <label class="filter-contribution-size">
         {{input type="checkbox" checked=hideSmallContributions}}
         Hide small contributions

app/helpers/capitalize-string.js

@@ -0,0 +1,7 @@
+import Helper from '@ember/component/helper';
+
+export default Helper.extend({
+  compute([string]) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  }
+});

tests/fixtures/contributions.js

@@ -3,15 +3,15 @@ import Model from 'kredits-web/models/contribution';
 const items = [];
 
 const data = [
-  { id: 1, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500 },
-  { id: 2, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 5000 },
-  { id: 3, contributorId: 2, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500 },
-  { id: 4, contributorId: 2, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500 },
-  { id: 5, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 5000 },
-  { id: 6, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: true, amount: 500 },
-  { id: 7, contributorId: 3, confirmedAtBlock: 2000, claimed: false, vetoed: false, amount: 5000 },
-  { id: 8, contributorId: 1, confirmedAtBlock: 2000, claimed: false, vetoed: false, amount: 1500 },
-  { id: 9, contributorId: 3, confirmedAtBlock: 2000, claimed: false, vetoed: true, amount: 1500 },
+  { id: 1, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500, kind: 'dev' },
+  { id: 2, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 5000, kind: 'ops' },
+  { id: 3, contributorId: 2, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500, kind: 'ops' },
+  { id: 4, contributorId: 2, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 1500, kind: 'docs' },
+  { id: 5, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: false, amount: 5000, kind: 'design' },
+  { id: 6, contributorId: 1, confirmedAtBlock: 1000, claimed: false, vetoed: true, amount: 500, kind: 'dev' },
+  { id: 7, contributorId: 3, confirmedAtBlock: 2000, claimed: false, vetoed: false, amount: 5000, kind: 'dev' },
+  { id: 8, contributorId: 1, confirmedAtBlock: 2000, claimed: false, vetoed: false, amount: 1500, kind: 'community' },
+  { id: 9, contributorId: 3, confirmedAtBlock: 2000, claimed: false, vetoed: true, amount: 1500, kind: 'docs' },
 ];
 
 data.forEach(attrs => items.push(Model.create(attrs)));

tests/integration/components/contribution-list/component-test.js

@@ -27,5 +27,8 @@ module('Integration | Component | contribution-list', function(hooks) {
 
     await click('.filter-contribution-size input');
     assert.equal(this.element.querySelectorAll('li').length, 4, 'hide small contributions');
+
+    await fillIn('.filter-contribution-kind select', 'dev');
+    assert.equal(this.element.querySelectorAll('li').length, 1, 'select kind');
   });
 });