Merge pull request #102 from shafin-deriv/shafin/BOT-2328/chore-journ…

…al-log-on-account-switch

chore: show journal logs based on selected account

package.json

@@ -100,6 +100,7 @@
         "@types/react-router-dom": "^5.3.3",
         "@types/react-transition-group": "^4.4.10",
         "@types/react-virtualized": "^9.21.30",
+        "@types/uuid": "^10.0.0",
         "@typescript-eslint/eslint-plugin": "^6.21.0",
         "@typescript-eslint/parser": "^6.0.0",
         "babel-core": "^7.0.0-bridge.0",

src/components/contract-card-loading/contract-card-loading.scss

@@ -0,0 +1,5 @@
+.db-contract-card-running-loader {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+}

src/components/contract-card-loading/contract-card-running-bot.tsx

@@ -1,11 +1,12 @@
 import Text from '@/components/shared_ui/text';
 import { LabelPairedLoaderMdBoldIcon } from '@deriv/quill-icons/LabelPaired';
 import { localize } from '@deriv-com/translations';
+import './contract-card-loading.scss';
 
 export const message_running_bot = localize('Your bot is running and waiting for a signal to buy a contract.');
 
 const ContractCardRunningBot = () => (
-    <>
+    <div className='db-contract-card-running-loader'>
         <LabelPairedLoaderMdBoldIcon id='rotate-icon' fontSize={16} fill='var(--text-general)' />
         <Text
             color='less-prominent'
@@ -17,7 +18,7 @@ const ContractCardRunningBot = () => (
         >
             {message_running_bot}
         </Text>
-    </>
+    </div>
 );
 
 export default ContractCardRunningBot;

src/components/layout/header/header.scss

@@ -127,6 +127,9 @@
 }
 
 .auth-actions {
+    display: flex;
+    padding-block: 8px;
+
     button {
         font-weight: 400;
         margin-right: 1.6rem;

src/components/shared_ui/contract-card/contract-card.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { getTotalProfit } from '@/components/shared/utils/contract';
+import ContractCardLoader from '@/components/contract-card-loading';
+import { getTotalProfit, TContractInfo } from '@/components/shared/utils/contract';
 import DesktopWrapper from '../desktop-wrapper';
 import { TGetCardLables, TGetContractPath } from '../types';
 import ContractCardBody from './contract-card-items/contract-card-body';
@@ -8,7 +9,6 @@ import ContractCardHeader from './contract-card-items/contract-card-header';
 import ContractCardSell from './contract-card-items/contract-card-sell';
 import ContractTypeCell from './contract-card-items/contract-type-cell';
 import MultiplierCloseActions from './contract-card-items/multiplier-close-actions';
-import ContractCardLoader from './contract-card-loader';
 import ResultOverlay from './result-overlay';
 
 type TContractCardProps = {

src/stores/client-store.ts

@@ -9,7 +9,7 @@ import {
     useWebsiteStatus,
 } from '@deriv-com/api-hooks';
 
-type TAccountList = NonNullable<ReturnType<typeof useAccountList>['data']>;
+export type TAccountList = NonNullable<ReturnType<typeof useAccountList>['data']>;
 
 type GetAccountStatusResult = NonNullable<ReturnType<typeof useGetAccountStatus>['data']>;
 

src/stores/journal-store.ts

@@ -3,11 +3,11 @@ import { v4 as uuidv4 } from 'uuid';
 import { formatDate } from '@/components/shared';
 import { LogTypes, MessageTypes } from '@/external/bot-skeleton';
 import { config } from '@/external/bot-skeleton/constants/config';
-import { TStores } from '@deriv/stores/types';
 import { localize } from '@deriv-com/translations';
 import { isCustomJournalMessage } from '../utils/journal-notifications';
 import { getStoredItemsByKey, getStoredItemsByUser, setStoredItemsByKey } from '../utils/session-storage';
 import { getSetting, storeSetting } from '../utils/settings';
+import { TAccountList } from './client-store';
 import RootStore from './root-store';
 
 type TExtra = {
@@ -62,9 +62,9 @@ export interface IJournalStore {
 
 export default class JournalStore {
     root_store: RootStore;
-    core: TStores;
+    core: RootStore['core'];
     disposeReactionsFn: () => void;
-    constructor(root_store: RootStore, core: TStores) {
+    constructor(root_store: RootStore, core: RootStore['core']) {
         makeObservable(this, {
             is_filter_dialog_visible: observable,
             journal_filters: observable.shallow,
@@ -104,7 +104,8 @@ export default class JournalStore {
     unfiltered_messages: TMessageItem[] = [];
 
     restoreStoredJournals() {
-        const { loginid } = this.core?.client ?? {};
+        const client = this.core.client as RootStore['client'];
+        const { loginid } = client;
         this.journal_filters = getSetting('journal_filter') || this.filters.map(filter => filter.id);
         this.unfiltered_messages = getStoredItemsByUser(this.JOURNAL_CACHE, loginid, []);
     }
@@ -160,11 +161,11 @@ export default class JournalStore {
         extra: { current_currency?: string; currency?: string } = {}
     ) {
         const { client } = this.core;
-        const { loginid, account_list } = client;
+        const { loginid, account_list } = client as RootStore['client'];
 
         if (loginid) {
             const current_account = account_list?.find(account => account?.loginid === loginid);
-            extra.current_currency = current_account?.is_virtual ? 'Demo' : current_account?.title;
+            extra.current_currency = current_account?.is_virtual ? 'Demo' : current_account?.currency;
         } else if (message === LogTypes.WELCOME) {
             return;
         }
@@ -208,7 +209,7 @@ export default class JournalStore {
     }
 
     registerReactions() {
-        const { client } = this.core;
+        const client = this.core.client as RootStore['client'];
 
         // Write journal messages to session storage on each change in unfiltered messages.
         const disposeWriteJournalMessageListener = reaction(
@@ -225,7 +226,9 @@ export default class JournalStore {
             () => client?.loginid,
             async loginid => {
                 await when(() => {
-                    const has_account = client.account_list?.find(account => account.loginid === loginid)?.title;
+                    const has_account = client.account_list?.find(
+                        (account: TAccountList[number]) => account.loginid === loginid
+                    );
                     return !!has_account;
                 });
                 this.unfiltered_messages = getStoredItemsByUser(this.JOURNAL_CACHE, loginid, []);

src/stores/summary-card-store.ts

@@ -240,15 +240,21 @@ export default class SummaryCardStore {
         const limit_order = this.getLimitOrder();
 
         if (this.contract_info?.contract_id) {
-            api_base.api.contractUpdate(this.contract_info?.contract_id, limit_order).then(response => {
-                if (response.error) {
-                    this.root_store.run_panel.showContractUpdateErrorDialog(response.error.message);
-                    return;
-                }
-
-                // Update contract store
-                this.populateContractUpdateConfig(response);
-            });
+            if (this.contract_info?.contract_id) {
+                api_base.api
+                    ?.send({
+                        contract_update: 1,
+                        contract_id: this.contract_info?.contract_id,
+                        limit_order,
+                    })
+                    .then(response => {
+                        // Update contract store
+                        this.populateContractUpdateConfig(response);
+                    })
+                    .catch((error: { error: Error }) => {
+                        this.root_store.run_panel.showContractUpdateErrorDialog(error?.error?.message);
+                    });
+            }
         }
     }