create generic sortObjects util function and use it for sorting budge…

…ts on the budgets list and update budget pages

src/app/budgets/components/BudgetsList.vue

@@ -49,6 +49,7 @@
import { mapState, mapActions } from 'vuex';

import { moment } from '../../../filters';
import { sortObjects } from '../../../utils';

export default {
  name: 'budgets-list',
@@ -73,13 +74,7 @@ export default {
    }),

    sortedBudgets () {
      let sortedKeys = Object.keys(this.budgets).sort((a, b) => {
        return this.budgets[b].month - this.budgets[a].month;
      });

      return sortedKeys.map((key) => {
        return this.budgets[key];
      });
      return sortObjects(this.budgets, 'month', true);
    }
  }
};

src/app/budgets/components/CreateUpdateBudget.vue

@@ -83,7 +83,7 @@
                @change="processDuplicateBudget($event.target.value)"
              >
                <option
                  v-for="value, key in budgets"
                  v-for="value, key in sortedBudgets"
                  :value="key"
                >
                  {{ value.month | moment }}
@@ -111,6 +111,7 @@ import Datepicker from 'vuejs-datepicker';
import CreateUpdateBudgetCategory from './CreateUpdateBudgetCategory';
import BudgetCategory from './BudgetCategory';
import { moment } from '../../../filters';
import { sortObjects } from '../../../utils';

export default {
  name: 'budget-create-edit-view',
@@ -144,7 +145,6 @@ export default {
        }
      });
    }
    this.lastBudget = this.getBudgetById('d0862d23-e433-bb30-6088-09f0e2f9f221');
  },

  methods: {
@@ -213,7 +213,7 @@ export default {
    },

    processDuplicateBudget (budgetId) {
      if (confirm('Are you sure you want to duplicate this budget? Doing this will overwrite all existing data for this month (transaction data will NOT be erased).')) {
      if (confirm('Are you sure you want to duplicate that budget? Doing this will overwrite all existing data for this month (transaction data will NOT be erased).')) {
        this.duplicateBudget({
          budget: this.selectedBudget,
          baseBudget: this.getBudgetById(budgetId)
@@ -232,7 +232,11 @@ export default {

    ...mapState({
      'budgets': state => state.budgets.budgets
    })
    }),

    sortedBudgets () {
      return sortObjects(this.budgets, 'month', true);
    }
  }
};
</script>

src/utils.js

@@ -18,3 +18,17 @@ export const processAPIData = function (data) {
  Object.keys(data).forEach((key) => { res[data[key].id] = data[key]; });
  return res;
};

export const sortObjects = (objects, key, reverse = false) => {
  /*
  Sorts a list of objects based on the value of their key property
   */
  let sortedKeys = Object.keys(objects).sort((a, b) => {
    if (reverse) return objects[b][key] - objects[a][key];
    return objects[a][key] - objects[b][key];
  });

  return sortedKeys.map((k) => {
    return objects[k];
  });
};