Allow to veto reimbursements

app/components/reimbursement-list/component.js

@@ -1,7 +1,18 @@
 import Component from '@glimmer/component';
 import { sort } from '@ember/object/computed';
+import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
 
 export default class ReimbursementListComponent extends Component {
+  @service kredits;
+
   itemSorting = Object.freeze(['pendingStatus:asc', 'id:desc']);
   @sort('args.items', 'itemSorting') itemsSorted;
+
+  @action
+  veto (id) {
+    this.kredits.vetoReimbursement(id).then(transaction => {
+      console.debug('[controllers:budget] Veto submitted to chain: '+transaction.hash);
+    });
+  }
 }

app/components/reimbursement-list/template.hbs

@@ -3,8 +3,12 @@
     <li data-reimbursement-id={{reimbursement.id}}
         class="{{item-status reimbursement}}">
       <p class="meta">
-        <span class="recipient"><UserAvatar @contributor={{reimbursement.contributor}} /></span>
-        <span class="title">Expenses covered by {{reimbursement.contributor.name}}</span>
+        <span class="title">
+          Expenses covered by {{reimbursement.contributor.name}}
+        </span>
+        <span class="recipient">
+          <UserAvatar @contributor={{reimbursement.contributor}} />
+        </span>
       </p>
       <p class="token-amount">
         <span class="amount">
@@ -26,6 +30,13 @@
           </li>
         {{/each}}
       </ul>
+      {{#if this.kredits.currentUserIsCore}}
+        <p>
+          <button {{on "click" (fn this.veto reimbursement.id)}}
+                  disabled={{reimbursement.vetoed}}
+                  class="button small danger">veto</button>
+        </p>
+      {{/if}}
     </li>
   {{/each}}
 </ul>