[BOT] Farabi/bot-1601/dbot bugs and improvements (deriv-com#15086)

* fix: notification visibility and qs form alignment * chore: update toast visibility handler * fix: summary and transactions view detail for different language * chore: removed download and view detail icon * fix: transaction panel profit alignment
vinu-deriv · May 28, 2024 · 01f90e3 · 01f90e3
1 parent a8072af
commit 01f90e3
Show file tree

Hide file tree

Showing 9 changed files with 29 additions and 14 deletions.
diff --git a/packages/bot-web-ui/src/components/bot-notification/bot-notification-utils.ts b/packages/bot-web-ui/src/components/bot-notification/bot-notification-utils.ts
@@ -1,6 +1,6 @@
 import { toast, ToastPosition, TypeOptions } from 'react-toastify';
-import { localize } from '@deriv/translations';
 import { isDbotRTL } from '@deriv/bot-skeleton/src/utils/workspace';
+import { localize } from '@deriv/translations';
 
 const getToastPosition = () => {
     const is_RTL = isDbotRTL();

diff --git a/packages/bot-web-ui/src/components/bot-notification/bot-notification.tsx b/packages/bot-web-ui/src/components/bot-notification/bot-notification.tsx
@@ -3,6 +3,20 @@ import { toast } from 'react-toastify';
 import { notification_style, TAction, TNotificationContent, TNotificationStyle } from './bot-notification-utils';
 
 export const NotificationContent: React.FC<TNotificationContent> = ({ message, primary_action, closeToast }) => {
+    React.useEffect(() => {
+        const handleToastVisibility = () => {
+            if (document.visibilityState === 'hidden') {
+                toast.dismiss();
+            }
+        };
+
+        document.addEventListener('visibilitychange', handleToastVisibility);
+
+        return () => {
+            document.removeEventListener('visibilitychange', handleToastVisibility);
+        };
+    }, []);
+
     return (
         <div className='notification-content'>
             <div>{message}</div>

diff --git a/packages/bot-web-ui/src/components/download/download.tsx b/packages/bot-web-ui/src/components/download/download.tsx
@@ -96,9 +96,6 @@ const Download = observer(({ tab }: TDownloadProps) => {
                 id='download-button'
                 is_disabled={disabled}
                 className='download__button'
-                icon={
-                    <Icon icon='IcDbotDownload' color={disabled ? 'disabled' : undefined} className='download__icon' />
-                }
                 text={localize('Download')}
                 onClick={clickFunction}
                 secondary

diff --git a/packages/bot-web-ui/src/components/run-panel/run-panel.scss b/packages/bot-web-ui/src/components/run-panel/run-panel.scss
@@ -102,6 +102,14 @@
         justify-content: space-between;
         flex-direction: column;
         overflow: hidden !important;
+
+        .dc-tabs {
+            &__item {
+                overflow: hidden;
+                text-overflow: ellipsis;
+                padding: 0 0.8rem;
+            }
+        }
     }
     &__buttons {
         display: inline-flex !important;

diff --git a/packages/bot-web-ui/src/components/transactions/transactions.scss b/packages/bot-web-ui/src/components/transactions/transactions.scss
@@ -77,7 +77,7 @@
                     text-align: start;
                 }
                 @if $item == 'profit' {
-                    text-align: end;
+                    text-align: start;
                 }
             }
         }

diff --git a/packages/bot-web-ui/src/components/transactions/transactions.tsx b/packages/bot-web-ui/src/components/transactions/transactions.tsx
@@ -115,7 +115,6 @@ const Transactions = observer(({ is_drawer_open }: TTransactions) => {
                         toggleTransactionDetailsModal(true);
                     }}
                     secondary
-                    icon={<Icon icon='IcDbotViewDetail' size={18} />}
                 />
             </div>
             <div className='transactions__header'>

diff --git a/packages/bot-web-ui/src/pages/bot-builder/quick-strategy/quick-strategy.scss b/packages/bot-web-ui/src/pages/bot-builder/quick-strategy/quick-strategy.scss
@@ -357,8 +357,8 @@
                 flex-direction: row-reverse;
 
                 @include mobile() {
-                    top: -2.8rem;
-                    right: 4rem;
+                    top: -2.6rem;
+                    right: 5rem;
                 }
 
                 .dc-text {
@@ -537,11 +537,11 @@
 
             &__trailing-icon {
                 @extend .seddle-actions;
-                right: 0.3rem;
+                right: 1rem;
                 color: var(--text-general);
 
                 @include mobile() {
-                    right: 0.2rem;
+                    right: 1.6rem;
                 }
 
                 &:hover {

diff --git a/packages/bot-web-ui/src/pages/bot-builder/toolbar/workspace-group.tsx b/packages/bot-web-ui/src/pages/bot-builder/toolbar/workspace-group.tsx
@@ -57,7 +57,7 @@ const WorkspaceGroup = observer(() => {
                 </DesktopWrapper>
                 <DesktopWrapper>
                     <ToolbarIcon
-                        popover_message={localize('Trading View Chart')}
+                        popover_message={localize('TradingView Chart')}
                         icon='IcTradingViewChart'
                         icon_id='db-toolbar__tradingview-button'
                         action={() => setTradingViewModalVisibility()}

diff --git a/packages/bot-web-ui/src/pages/dashboard/dashboard.scss b/packages/bot-web-ui/src/pages/dashboard/dashboard.scss
@@ -385,9 +385,6 @@
                         text-align: center;
                     }
                 }
-                &:nth-last-child(2) {
-                    padding-inline: 0;
-                }
             }
 
             &__images {