import { observable, action, toJS, values, decorate } from "mobx";
import { getTransactions } from "../Services/transactionsRequests";

class Transactions {
  constructor() {
    this.data = observable.map({});
    this.fetchData();
  }
  set(key, transaction) {
    this.data.set(key, transaction);
  }
  remove(key) {
    this.data.delete(key);
  }
  getSorted(property = "date", order = "ascending") {
    return toJS([...this.data.values()]).sort((a, b) => {
      return order === "ascending"
        ? a[property] - b[property]
        : b[property] - a[property];
    });
  }
  async fetchData() {
    console.log("fetch data");
    const transactions = await getTransactions();
    transactions.forEach(transaction => {
      this.data.set(transaction._id, transaction);
    });
  }
}

export default decorate(Transactions, {
  data: observable.shallow,
  set: action,
  remove: action,
  getSorted: action,
  fetchData: action
});