[BOT] [Server Side Bot]maryia/bot 1913/Test link bug fixing and impro…

…vements (#15719) * fix: integrate a toggle button which will switch to stop if the bot is running * feat: make available bot subscription after reloading the page
deriv-com · Jun 24, 2024 · d2ed98d · d2ed98d
1 parent cd3c5ef
commit d2ed98d
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 27 deletions.
diff --git a/packages/bot-web-ui/src/pages/server-bot/server-bot-list.tsx b/packages/bot-web-ui/src/pages/server-bot/server-bot-list.tsx
@@ -40,8 +40,26 @@ const ServerBotList = () => {
     const { is_mobile } = ui;
     const DBotStores = useDBotStore();
     const {
-        server_bot: { bot_list, removeBot, startBot, stopBot },
+        server_bot: { bot_list, removeBot, startBot, stopBot, notifyBot },
     } = DBotStores;
+    const is_bot_filled_list = !!bot_list[0];
+
+    React.useEffect(() => {
+        if (is_bot_filled_list) {
+            subscribeToBot();
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [is_bot_filled_list]);
+
+    const subscribeToBot = () => {
+        if (bot_list && bot_list.length > 0) {
+            bot_list.forEach((bot: TBotListItem) => {
+                if (bot.status === 'running') {
+                    notifyBot(bot.bot_id, false);
+                }
+            });
+        }
+    };
 
     return (
         <div className='bot-list__wrapper'>
@@ -75,13 +93,15 @@ const ServerBotList = () => {
                                 <p>{localize('[ Strategy parameters ]')}</p>
                             </div>
                             <div className='bot-list-contract__actions'>
-                                <Button green onClick={() => startBot(bot_id)}>
-                                    {localize('Start')}
-                                </Button>
-                                <Button primary onClick={() => stopBot(bot_id)}>
-                                    {localize('Stop')}
-                                </Button>
-                                <Button className='bot-list-btn--disabled' disabled>{localize('Pause')}</Button>
+                                {status === 'started' || status === 'running' ? (
+                                    <Button primary onClick={() => stopBot(bot_id)}>
+                                        {localize('Stop')}
+                                    </Button>
+                                ) : (
+                                    <Button green onClick={() => startBot(bot_id)}>
+                                        {localize('Start')}
+                                    </Button>
+                                )}
                                 <Button primary onClick={() => removeBot(bot_id)}>
                                     {localize('Remove')}
                                 </Button>

diff --git a/packages/bot-web-ui/src/pages/server-bot/server-bot.scss b/packages/bot-web-ui/src/pages/server-bot/server-bot.scss
@@ -88,9 +88,4 @@
         display: flex;
         gap: 2rem;
     }
-
 }
-        .bot-list-btn--disabled {
-            pointer-events: none !important;
-            cursor: none !important;
-        }
diff --git a/packages/bot-web-ui/src/pages/server-bot/server-bot.tsx b/packages/bot-web-ui/src/pages/server-bot/server-bot.tsx
@@ -13,25 +13,20 @@ import { api_base } from '@deriv/bot-skeleton';
 const ServerBot = observer(() => {
     const DBotStores = useDBotStore();
     const {
-        server_bot: { getBotList, bot_list, createBot, notifications, setNotifications },
+        server_bot: { getBotList, bot_list, createBot, notifications, setNotifications, setStatusBot },
     } = DBotStores;
 
     const [add_btn_active, setAddBtnActive] = useState(false);
     const { client } = useStore();
     const { is_virtual } = client;
 
-    React.useEffect(() => {
-        setTimeout(() => getBotList(), 2000);
-
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [is_virtual]);
-
     React.useEffect(() => {
         if (!bot_list[0]) {
-            getBotList();
+            setTimeout(() => getBotList(), 2000);
         }
+
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, [is_virtual]);
 
     const handleMessage = ({ data }) => {
         if (data?.msg_type === 'bot_notification' && !data?.error) {
@@ -64,6 +59,7 @@ const ServerBot = observer(() => {
                 );
             }
             if (data.bot_notification.msg_type === 'stop') {
+                setStatusBot('stopped', data.echo_req.bot_id);
                 setNotifications(`msg_type: ${data.bot_notification.msg_type} reason: ${bot_notification_msg.reason}`);
             }
         }

diff --git a/packages/bot-web-ui/src/stores/server-bot-store.ts b/packages/bot-web-ui/src/stores/server-bot-store.ts
@@ -8,6 +8,7 @@ interface IServerBotStore {
     notifications: Array<string>;
     setNotifications: (notifications: string) => void;
     getBotList: () => void;
+    notifyBot: (bot_id: string, should_change_status: boolean) => void;
     createBot: () => void;
     removeBot: (bot_id: string) => void;
     startBot: (bot_id: string) => void;
@@ -16,6 +17,7 @@ interface IServerBotStore {
     setValueServerBot: (form_data: any) => void;
     makeRequest: (req_schema: TRequestSchema) => Promise<TBotResponse>;
     setFormValues: (currency: string) => void;
+    setStatusBot: (status: string, bot_id: string) => void;
 }
 
 type TBotListResponse = {
@@ -64,11 +66,13 @@ export default class ServerBotStore implements IServerBotStore {
             setNotifications: action.bound,
             setValue: action.bound,
             getBotList: action.bound,
+            notifyBot: action.bound,
             createBot: action.bound,
             removeBot: action.bound,
             startBot: action.bound,
             stopBot: action.bound,
             setFormValues: action.bound,
+            setStatusBot: action.bound,
         });
     }
 
@@ -131,7 +135,7 @@ export default class ServerBotStore implements IServerBotStore {
                 })
                 .catch((error: Error) => {
                     /* eslint-disable no-console */
-                    this.setNotifications(error?.error?.message)
+                    this.setNotifications(error?.error?.message);
                 });
         }, 2000);
     };
@@ -150,7 +154,7 @@ export default class ServerBotStore implements IServerBotStore {
             .catch((error: Error) => {
                 /* eslint-disable no-console */
                 console.error(error);
-                this.setNotifications(error?.error?.message)
+                this.setNotifications(error?.error?.message);
             })
             .then(() => this.getBotList());
     };
@@ -203,14 +207,17 @@ export default class ServerBotStore implements IServerBotStore {
             .then(() => this.getBotList());
     };
 
-    notifyBot = (bot_id: string) => {
+    notifyBot = (bot_id: string, should_change_status = true) => {
+        if (should_change_status) {
+            this.setStatusBot('started', bot_id);
+        }
         this.makeRequest({
             bot_notification: 1,
             subscribe: 1,
             bot_id,
         })
             .then(data => {
-                this.setNotifications(data?.bot_notification?.message)
+                this.setNotifications(data?.bot_notification?.message);
                 return data;
             })
             .catch((error: Error) => {
@@ -222,5 +229,9 @@ export default class ServerBotStore implements IServerBotStore {
 
     setNotifications = (notifications: string) => {
         this.notifications.push(notifications);
-    }
+    };
+
+    setStatusBot = (status: string, bot_id: string) => {
+        this.bot_list = this.bot_list.map(bot => (bot.bot_id === bot_id ? { ...bot, status } : bot));
+    };
 }