Add notification settings

src/shared/notifications.ts

@@ -0,0 +1,29 @@
+import { showAlert } from '@/stores/alerts';
+import { useSettingsStore } from '@/stores/settings';
+import { FTWsMessage, FtWsMessageTypes } from '@/types/wsMessageTypes';
+
+export function showNotification(msg: FTWsMessage) {
+  const settingsStore = useSettingsStore();
+  if (settingsStore.notifications && settingsStore.notifications[msg.type]) {
+    switch (msg.type) {
+      case FtWsMessageTypes.entryFill:
+        console.log('entryFill', msg);
+        showAlert(`Entry fill for ${msg.pair} at ${msg.open_rate}`, 'success');
+        break;
+      case FtWsMessageTypes.exitFill:
+        console.log('exitFill', msg);
+        showAlert(`Exit fill for ${msg.pair} at ${msg.open_rate}`, 'success');
+        break;
+      case FtWsMessageTypes.exitCancel:
+        console.log('exitCancel', msg);
+        showAlert(`Exit order cancelled for ${msg.pair} due to ${msg.reason}`, 'warning');
+        break;
+      case FtWsMessageTypes.entryCancel:
+        console.log('entryCancel', msg);
+        showAlert(`Entry order cancelled for ${msg.pair} due to ${msg.reason}`, 'warning');
+        break;
+    }
+  } else {
+    console.log(`Message ${msg.type} not shown.`);
+  }
+}

src/stores/ftbot.ts

@@ -40,6 +40,7 @@ import { defineStore } from 'pinia';
 import { showAlert } from './alerts';
 import { useWebSocket } from '@vueuse/core';
 import { FTWsMessage, FtWsMessageTypes } from '@/types/wsMessageTypes';
+import { showNotification } from '@/shared/notifications';
 
 export function createBotSubStore(botId: string, botName: string) {
   const userService = useUserService(botId);
@@ -817,12 +818,10 @@ export function createBotSubStore(botId: string, botName: string) {
             this.whitelist = msg.data;
             break;
           case FtWsMessageTypes.entryFill:
-            console.log('entryFill', msg);
-            showAlert(`Entry fill for ${msg.pair} at ${msg.open_rate}`, 'success');
-            break;
           case FtWsMessageTypes.exitFill:
-            console.log('exitFill', msg);
+          case FtWsMessageTypes.exitCancel:
-            showAlert(`Exit fill for ${msg.pair} at ${msg.open_rate}`, 'success');
+          case FtWsMessageTypes.entryCancel:
+            showNotification(msg);
             break;
           case FtWsMessageTypes.newCandle:
             console.log('exitFill', msg);
@@ -833,14 +832,7 @@ export function createBotSubStore(botId: string, botName: string) {
               this.getPairCandles({ pair, timeframe, limit: 500 });
             }
             break;
-          case FtWsMessageTypes.exitCancel:
+
-            console.log('exitCancel', msg);
-            showAlert(`Exit order cancelled for ${msg.pair} due to ${msg.reason}`, 'warning');
-            break;
-          case FtWsMessageTypes.entryCancel:
-            console.log('entryCancel', msg);
-            showAlert(`Entry order cancelled for ${msg.pair} due to ${msg.reason}`, 'warning');
-            break;
           default:
             // Unhandled events ...
             console.log(`Received event ${(msg as any).type}`);

src/stores/settings.ts

@@ -3,6 +3,7 @@ import { defineStore } from 'pinia';
 import { getCurrentTheme, getTheme } from '@/shared/themes';
 import axios from 'axios';
 import { UiVersion } from '@/types';
+import { FtWsMessageTypes } from '@/types/wsMessageTypes';
 
 const STORE_UI_SETTINGS = 'ftUISettings';
 
@@ -12,6 +13,13 @@ export enum OpenTradeVizOptions {
   noOpenTrades = 'noOpenTrades',
 }
 
+const notificationDefaults = {
+  [FtWsMessageTypes.entryFill]: true,
+  [FtWsMessageTypes.exitFill]: true,
+  [FtWsMessageTypes.entryCancel]: true,
+  [FtWsMessageTypes.exitCancel]: true,
+};
+
 export const useSettingsStore = defineStore('uiSettings', {
   // other options...
   state: () => {
@@ -22,6 +30,7 @@ export const useSettingsStore = defineStore('uiSettings', {
       currentTheme: getCurrentTheme(),
       uiVersion: 'dev',
       useHeikinAshiCandles: false,
+      notifications: notificationDefaults,
     };
   },
   getters: {

src/views/Settings.vue

@@ -37,45 +37,47 @@
             >Use Heikin Ashi candles.</b-form-checkbox
           >
         </b-form-group>
+        <b-form-group description="Notifications">
+          <b-form-checkbox v-model="settingsStore.notifications[FtWsMessageTypes.entryFill]"
+            >Entry notifications</b-form-checkbox
+          >
+          <b-form-checkbox v-model="settingsStore.notifications[FtWsMessageTypes.exitFill]"
+            >Exit notifications</b-form-checkbox
+          >
+          <b-form-checkbox v-model="settingsStore.notifications[FtWsMessageTypes.entryCancel]"
+            >Entry Cancel notifications</b-form-checkbox
+          >
+          <b-form-checkbox v-model="settingsStore.notifications[FtWsMessageTypes.exitCancel]"
+            >Exit Cancel notifications</b-form-checkbox
+          >
+        </b-form-group>
       </div>
     </b-card>
   </div>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
-import { defineComponent } from 'vue';
 import { OpenTradeVizOptions, useSettingsStore } from '@/stores/settings';
 import { useLayoutStore } from '@/stores/layout';
 import { showAlert } from '@/stores/alerts';
+import { FtWsMessageTypes } from '@/types/wsMessageTypes';
 
-export default defineComponent({
+const settingsStore = useSettingsStore();
-  name: 'Settings',
+const layoutStore = useLayoutStore();
-  setup() {
-    const settingsStore = useSettingsStore();
-    const layoutStore = useLayoutStore();
 
-    const timezoneOptions = ['UTC', Intl.DateTimeFormat().resolvedOptions().timeZone];
+const timezoneOptions = ['UTC', Intl.DateTimeFormat().resolvedOptions().timeZone];
-    const openTradesOptions = [
+const openTradesOptions = [
-      { value: OpenTradeVizOptions.showPill, text: 'Show pill in icon' },
+  { value: OpenTradeVizOptions.showPill, text: 'Show pill in icon' },
-      { value: OpenTradeVizOptions.asTitle, text: 'Show in title' },
+  { value: OpenTradeVizOptions.asTitle, text: 'Show in title' },
-      { value: OpenTradeVizOptions.noOpenTrades, text: "Don't show open trades in header" },
+  { value: OpenTradeVizOptions.noOpenTrades, text: "Don't show open trades in header" },
-    ];
+];
 
-    //
+//
-    const resetDynamicLayout = () => {
+const resetDynamicLayout = () => {
-      layoutStore.resetTradingLayout();
+  layoutStore.resetTradingLayout();
-      layoutStore.resetDashboardLayout();
+  layoutStore.resetDashboardLayout();
-      showAlert('Layouts have been reset.');
+  showAlert('Layouts have been reset.');
-    };
+};
-    return {
-      resetDynamicLayout,
-      settingsStore,
-      layoutStore,
-      timezoneOptions,
-      openTradesOptions,
-    };
-  },
-});
 </script>
 
 <style scoped></style>