Save transactions in store and allow setting and getting a single user from store

src/plugins/balance/store/balance.ts

@@ -16,6 +16,7 @@ export interface UserBalance extends BalanceResponse {
 export interface BalanceInterface {
   balances: Map<string, UserBalance>;
   shortcuts: Array<number>;
+  transactions: Array<FG.Transaction>;
   loading: number;
 }
 
@@ -26,6 +27,7 @@ export interface StateInterfaceBalance extends StateInterface {
 const state: BalanceInterface = {
   balances: new Map<string, UserBalance>(),
   shortcuts: [],
+  transactions: [],
   loading: 0
 };
 
@@ -53,6 +55,15 @@ const mutations: MutationTree<BalanceInterface> = {
   },
   setShortcuts(state, data: Array<number>) {
     state.shortcuts.splice(0, state.shortcuts.length, ...data);
+  },
+  addTransaction(state, data: FG.Transaction) {
+    state.transactions.push(data);
+  },
+  reverseTransaction(state, data: { transaction: FG.Transaction; reversal: FG.Transaction }) {
+    const idx = state.transactions.findIndex(value => value.id === data.transaction.id);
+    data.transaction.reversal = data.reversal;
+    if (idx > -1) state.transactions[idx] = data.transaction;
+    else state.transactions.push(data.transaction);
   }
 };
 
@@ -111,8 +122,11 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
       })
       .finally(() => commit('setLoading', false));
   },
-  revert({ dispatch }, transaction: FG.Transaction) {
-    return axios.delete(`/balance/${transaction.id}`).then(() => {
+  revert({ dispatch, commit }, transaction: FG.Transaction) {
+    return axios
+      .delete(`/balance/${transaction.id}`)
+      .then((response: AxiosResponse<FG.Transaction>) => {
+        commit('reverseTransaction', { transaction: transaction, reversal: response.data });
         dispatch('getBalance').catch(err => console.warn(err));
       });
   },
@@ -121,6 +135,9 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
     return axios
       .put(`/users/${data.user}/balance`, data)
       .then((response: AxiosResponse<FG.Transaction>) => {
+        const transaction = response.data;
+        transaction.time = new Date(transaction.time);
+        commit('addTransaction', transaction);
         commit(state.balances.has(data.user) ? 'changeBalance' : 'setBalance', {
           userid: data.user,
           amount: data.amount
@@ -130,12 +147,12 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
             userid: data.sender,
             amount: -1 * data.amount
           });
-        return response.data;
+        return transaction;
       })
       .catch(err => {
+        console.debug(err);
         // Maybe Balance changed
-        dispatch('getBalance').catch(err => console.warn(err));
-        console.warn(err);
+        return dispatch('getBalance', data.sender ? data.sender : data.user);
       })
       .finally(() => commit('setLoading', false));
   }

src/plugins/user/store/user.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-call */
 import { Module, MutationTree, ActionTree, GetterTree } from 'vuex';
 import { StateInterface } from 'src/store';
 import { axios } from 'boot/axios';
@@ -48,6 +49,11 @@ const mutations: MutationTree<UserStateInterface> = {
   setUsers(state, data: FG.User[]) {
     state.users = data;
   },
+  setUser(state, data: FG.User) {
+    const index = state.users.findIndex(x => x.userid === data.userid);
+    if (index > -1) state.users[index] = data;
+    else state.users.push(data);
+  },
   setRoles(state, data: FG.Role[]) {
     state.roles = data;
   },
@@ -221,10 +227,26 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
         commit('setPermissions', response.data);
       })
       .finally(() => commit('setLoading', false));
+  },
+  getUser({ commit, getters }, data: { userid: string; force?: boolean }) {
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+    const user = <FG.User | undefined>getters['getUser'](data.userid);
+    if (user === undefined || data.force === true) {
+      return axios.get(`/users/${data.userid}`).then((response: AxiosResponse<FG.User>) => {
+        commit('setUser', response.data);
+        return response.data;
+      });
+    } else {
+      return Promise.resolve(user);
+    }
   }
 };
 
 const getters: GetterTree<UserStateInterface, StateInterface> = {
+  getUser: state => (userid: string) => {
+    const user = state.users.filter(usr => usr.userid === userid);
+    return user.length > 0 ? user[0] : undefined;
+  },
   currentUser({ currentUser }) {
     return currentUser;
   },