Move refresh logic into parent_bot store

src/components/ftbot/ReloadControl.vue

@@ -1,24 +1,26 @@
 <template>
-  <div class="container-fluid">
-    <div class="row">
-      <button class="m-1 btn btn-primary" @click="refreshAll(true)"><RefreshIcon /></button>
+  <div class="d-flex flex-align-center">
+    <b-button class="m-1 mr-3" variant="secondary" size="sm" @click="refreshAll(true)">
+      <RefreshIcon :size="16" />
+    </b-button>
 
-      <b-form-checkbox
-        v-model="autoRefreshLoc"
-        class="ml-auto float-right mr-2 my-auto"
-        title="AutoRefresh"
-        switch
-        >AutoRefresh</b-form-checkbox
-      >
-    </div>
+    <b-form-checkbox
+      v-model="autoRefreshLoc"
+      class="ml-auto float-right mr-2 my-auto"
+      title="AutoRefresh"
+      variant="secondary"
+      >AutoRefresh</b-form-checkbox
+    >
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Vue, Watch } from 'vue-property-decorator';
-import { Action, Getter, State } from 'vuex-class';
+import { Getter, State, namespace } from 'vuex-class';
 import RefreshIcon from 'vue-material-design-icons/Refresh.vue';
 
+const ftbot = namespace('ftbot');
+
 @Component({ components: { RefreshIcon } })
 export default class ReloadControl extends Vue {
   refreshInterval: number | null = null;
@@ -43,18 +45,18 @@ export default class ReloadControl extends Vue {
   // TODO-multi: This should be per bot!
   @Getter loggedIn;
 
-  @State autoRefresh!: boolean;
+  @ftbot.Getter autoRefresh!: boolean;
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  @Action setAutoRefresh!: (newValue: boolean) => void;
+  @ftbot.Action setAutoRefresh!: (newValue: boolean) => void;
 
-  @Action refreshSlow;
+  @ftbot.Action refreshSlow;
 
-  @Action refreshFrequent;
+  @ftbot.Action refreshFrequent;
 
-  @Action refreshAll;
+  @ftbot.Action refreshAll;
 
-  @Action refreshOnce;
+  @ftbot.Action refreshOnce;
 
   get autoRefreshLoc() {
     return this.autoRefresh;

src/store/index.ts

@@ -2,16 +2,13 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 
 import { getCurrentTheme, getTheme, storeCurrentTheme } from '@/shared/themes';
-import axios, { AxiosInstance } from 'axios';
+import axios from 'axios';
 import { UserService } from '@/shared/userService';
 import createBotStore from './modules/botStoreWrapper';
-import { BotStoreGetters } from './modules/ftbot';
 import alertsModule from './modules/alerts';
 import layoutModule from './modules/layout';
 import settingsModule from './modules/settings';
 
-const AUTO_REFRESH = 'ft_auto_refresh';
-
 Vue.use(Vuex);
 const initCurrentTheme = getCurrentTheme();
 
@@ -22,8 +19,6 @@ const store = new Vuex.Store({
     uiSettings: settingsModule,
   },
   state: {
-    refreshing: false,
-    autoRefresh: JSON.parse(localStorage.getItem(AUTO_REFRESH) || '{}'),
     currentTheme: initCurrentTheme,
     uiVersion: 'dev',
   },
@@ -46,13 +41,6 @@ const store = new Vuex.Store({
     },
   },
   mutations: {
-    setAutoRefresh(state, newRefreshValue: boolean) {
-      state.autoRefresh = newRefreshValue;
-    },
-    setRefreshing(state, refreshing: boolean) {
-      state.refreshing = refreshing;
-    },
-
     mutateCurrentTheme(state, newTheme: string) {
       storeCurrentTheme(newTheme);
       state.currentTheme = newTheme;
@@ -65,10 +53,7 @@ const store = new Vuex.Store({
     setCurrentTheme({ commit }, newTheme: string) {
       commit('mutateCurrentTheme', newTheme);
     },
-    setAutoRefresh({ commit }, newRefreshValue) {
-      commit('setAutoRefresh', newRefreshValue);
-      localStorage.setItem(AUTO_REFRESH, JSON.stringify(newRefreshValue));
-    },
+
     setLoggedIn({ commit }, loggedin: boolean) {
       commit('setLoggedIn', loggedin);
     },
@@ -76,12 +61,9 @@ const store = new Vuex.Store({
       commit('setIsBotOnline', isOnline);
       if (isOnline === false) {
         console.log('disabling autorun');
-        dispatch('setAutoRefresh', false);
+        dispatch('ftbot/setAutoRefresh', false);
       }
     },
-    refreshOnce({ dispatch }) {
-      dispatch('ftbot/getVersion');
-    },
     async loadUIVersion({ commit }) {
       if (process.env.NODE_ENV !== 'development') {
         try {
@@ -94,51 +76,6 @@ const store = new Vuex.Store({
         }
       }
     },
-    async refreshAll({ dispatch, state, commit }, forceUpdate = false) {
-      if (state.refreshing) {
-        return;
-      }
-      commit('setRefreshing', true);
-      try {
-        const updates: Promise<AxiosInstance>[] = [];
-        updates.push(dispatch('refreshFrequent', false));
-        updates.push(dispatch('refreshSlow', forceUpdate));
-        updates.push(dispatch('ftbot/getDaily'));
-        updates.push(dispatch('ftbot/getBalance'));
-
-        await Promise.all(updates);
-        console.log('refreshing_end');
-      } finally {
-        commit('setRefreshing', false);
-      }
-    },
-    async refreshSlow({ dispatch, getters, state }, forceUpdate = false) {
-      if (state.refreshing && !forceUpdate) {
-        return;
-      }
-      // Refresh data only when needed
-      if (forceUpdate || getters[`ftbot/${BotStoreGetters.refreshRequired}`]) {
-        const updates: Promise<AxiosInstance>[] = [];
-        updates.push(dispatch('ftbot/getPerformance'));
-        updates.push(dispatch('ftbot/getProfit'));
-        updates.push(dispatch('ftbot/getTrades'));
-        /* white/blacklist might be refreshed more often as they are not expensive on the backend */
-        updates.push(dispatch('ftbot/getWhitelist'));
-        updates.push(dispatch('ftbot/getBlacklist'));
-
-        await Promise.all(updates);
-        dispatch('ftbot/setRefreshRequired', false);
-      }
-    },
-    refreshFrequent({ dispatch }, slow = true) {
-      if (slow) {
-        dispatch('refreshSlow', false);
-      }
-      // Refresh data that's needed in near realtime
-      dispatch('ftbot/getOpenTrades');
-      dispatch('ftbot/getState');
-      dispatch('ftbot/getLocks');
-    },
   },
 });
 

src/store/modules/botStoreWrapper.ts

@@ -1,9 +1,14 @@
 import { BotDescriptor, BotDescriptors } from '@/types';
+import { AxiosInstance } from 'axios';
 import { BotStoreActions, BotStoreGetters, createBotSubStore } from './ftbot';
 
+const AUTO_REFRESH = 'ft_auto_refresh';
+
 interface FTMultiBotState {
   selectedBot: string;
   availableBots: BotDescriptors;
+  autoRefresh: boolean;
+  refreshing: boolean;
 }
 
 export enum MultiBotStoreGetters {
@@ -13,12 +18,15 @@ export enum MultiBotStoreGetters {
   allAvailableBotsList = 'allAvailableBotsList',
   allIsBotOnline = 'allIsBotOnline',
   nextBotId = 'nextBotId',
+  autoRefresh = 'autoRefresh',
 }
 
 export default function createBotStore(store) {
   const state: FTMultiBotState = {
     selectedBot: '',
     availableBots: {},
+    autoRefresh: JSON.parse(localStorage.getItem(AUTO_REFRESH) || '{}'),
+    refreshing: false,
   };
 
   // All getters working on all bots should be prefixed with all.
@@ -50,6 +58,9 @@ export default function createBotStore(store) {
       }
       return `ftbot.${botCount}`;
     },
+    [MultiBotStoreGetters.autoRefresh](state: FTMultiBotState): boolean {
+      return state.autoRefresh;
+    },
   };
   // Autocreate getters from botStores
   Object.keys(BotStoreGetters).forEach((e) => {
@@ -66,6 +77,12 @@ export default function createBotStore(store) {
         console.warn(`Botid ${botId} not available, but selected.`);
       }
     },
+    setAutoRefresh(state: FTMultiBotState, newRefreshValue: boolean) {
+      state.autoRefresh = newRefreshValue;
+    },
+    setRefreshing(state, refreshing: boolean) {
+      state.refreshing = refreshing;
+    },
     addBot(state: FTMultiBotState, bot: BotDescriptor) {
       state.availableBots[bot.botId] = bot;
     },
@@ -108,6 +125,58 @@ export default function createBotStore(store) {
     selectBot({ commit }, botId: string) {
       commit('selectBot', botId);
     },
+    setAutoRefresh({ commit }, newRefreshValue) {
+      commit('setAutoRefresh', newRefreshValue);
+      localStorage.setItem(AUTO_REFRESH, JSON.stringify(newRefreshValue));
+    },
+    async refreshAll({ dispatch, state, commit }, forceUpdate = false) {
+      if (state.refreshing) {
+        return;
+      }
+      commit('setRefreshing', true);
+      try {
+        const updates: Promise<AxiosInstance>[] = [];
+        updates.push(dispatch('refreshFrequent', false));
+        updates.push(dispatch('refreshSlow', forceUpdate));
+        updates.push(dispatch('getDaily'));
+        updates.push(dispatch('getBalance'));
+
+        await Promise.all(updates);
+        console.log('refreshing_end');
+      } finally {
+        commit('setRefreshing', false);
+      }
+    },
+    async refreshSlow({ dispatch, getters, state }, forceUpdate = false) {
+      if (state.refreshing && !forceUpdate) {
+        return;
+      }
+      // Refresh data only when needed
+      if (forceUpdate || getters[`${BotStoreGetters.refreshRequired}`]) {
+        const updates: Promise<AxiosInstance>[] = [];
+        updates.push(dispatch('getPerformance'));
+        updates.push(dispatch('getProfit'));
+        updates.push(dispatch('getTrades'));
+        /* white/blacklist might be refreshed more often as they are not expensive on the backend */
+        updates.push(dispatch('getWhitelist'));
+        updates.push(dispatch('getBlacklist'));
+
+        await Promise.all(updates);
+        dispatch('setRefreshRequired', false);
+      }
+    },
+    refreshFrequent({ dispatch }, slow = true) {
+      if (slow) {
+        dispatch('refreshSlow', false);
+      }
+      // Refresh data that's needed in near realtime
+      dispatch('getOpenTrades');
+      dispatch('getState');
+      dispatch('getLocks');
+    },
+    refreshOnce({ dispatch }) {
+      dispatch('getVersion');
+    },
     pingAll({ getters, dispatch }) {
       getters.allAvailableBotsList.forEach((e) => {
         dispatch(`${e}/ping`);