Add expenses from file

Allow to upload a JSON file containing a list of expense items

app/components/add-reimbursement/component.js

@@ -6,6 +6,7 @@ import { action } from '@ember/object';
 import { A } from '@ember/array';
 import { scheduleOnce } from '@ember/runloop';
 import isValidAmount from 'kredits-web/utils/is-valid-amount';
+import readFileContent from 'kredits-web/utils/read-file-content';
 import config from 'kredits-web/config/environment';
 
 export default class AddReimbursementComponent extends Component {
@@ -85,7 +86,22 @@ export default class AddReimbursementComponent extends Component {
   }
 
   @action
-  updateContributor(event) {
+  async addExpensesFromFile (evt) {
+    const content = await readFileContent(evt.target.files[0]);
+    const expenses = JSON.parse(content);
+
+    if (expenses instanceof Array) {
+      for (const item of expenses) {
+        this.addExpenseItem(item);
+      }
+    } else {
+      console.warn("Expenses in file must be a list of items:");
+      console.debug(content);
+    }
+  }
+
+  @action
+  updateContributor (event) {
     this.recipientId = event.target.value;
   }
 

app/components/add-reimbursement/template.hbs

@@ -87,3 +87,9 @@
     <AddExpenseItem @addExpenseItem={{fn this.addExpenseItem}} />
   {{/if}}
 </form>
+<form id="add-expenses-from-file">
+  <h3>Add expense items from file</h3>
+  <input type="file" multiple="false"
+         onchange={{fn this.addExpensesFromFile}}
+         accept="application/json" />
+</form>

app/utils/read-file-content.js

@@ -0,0 +1,8 @@
+export default function (file) {
+  const reader = new FileReader();
+  return new Promise((resolve, reject) => {
+    reader.onload = event => resolve(event.target.result)
+    reader.onerror = error => reject(error)
+    reader.readAsText(file)
+  })
+}