[BOT] Farabi/bot-2104/dont show notifications on theme change (#16461)

* fix: removed dashboard methods for changing top block colors * fix: summary panel dark theme color * fix: notifications for workspace change and block delete * chore: remove redundant setTimeout * fix: set reset button state to false after last blockly event
binary-com · Aug 27, 2024 · 1adce55 · 1adce55
1 parent 3a2ab81
commit 1adce55
Show file tree

Hide file tree

Showing 8 changed files with 25 additions and 83 deletions.
diff --git a/packages/bot-skeleton/src/scratch/blockly.js b/packages/bot-skeleton/src/scratch/blockly.js
@@ -26,7 +26,7 @@ const modifyBlocklyWorkSpaceContextMenu = () => {
     });
 };
 
-export const loadBlockly = async isDarkMode => {
+export const loadBlockly = async () => {
     const BlocklyModule = await import('blockly');
     window.Blockly = BlocklyModule.default;
     window.Blockly.Colours = {};
@@ -41,7 +41,7 @@ export const loadBlockly = async isDarkMode => {
         componentStyles: {},
     });
     modifyBlocklyWorkSpaceContextMenu();
-    setColors(isDarkMode);
+    setColors();
     await import('./hooks');
     await import('./blocks');
 };
diff --git a/packages/bot-skeleton/src/scratch/hooks/colours.js b/packages/bot-skeleton/src/scratch/hooks/colours.js
@@ -1,40 +1,3 @@
-const darkMode = () => {
-    const workspace = Blockly;
-    workspace.Colours.RootBlock = {
-        colour: '#183046',
-        colourSecondary: '#F2F3F5',
-        colourTertiary: '#151717',
-    };
-    workspace.Colours.Base = {
-        colour: '#C2C2C2',
-        colourSecondary: '#0e0e0e',
-        colourTertiary: '#0e0e0e',
-    };
-
-    workspace.Colours.Special1 = {
-        colour: '#C2C2C2',
-        colourSecondary: '#0e0e0e',
-        colourTertiary: '#6d7278',
-    };
-
-    workspace.Colours.Special2 = {
-        colour: '#C2C2C2',
-        colourSecondary: '#0e0e0e',
-        colourTertiary: '#D27954',
-    };
-
-    workspace.Colours.Special3 = {
-        colour: '#C2C2C2',
-        colourSecondary: '#0e0e0e',
-        colourTertiary: '#D27954',
-    };
-    workspace.Colours.Special4 = {
-        colour: '#000',
-        colourSecondary: '#ffffff',
-        colourTertiary: '#0e0e0e',
-    };
-};
-
 const lightMode = () => {
     const workspace = Blockly;
     workspace.Colours.RootBlock = {
@@ -73,4 +36,5 @@ const lightMode = () => {
         colourTertiary: '#0e0e0e',
     };
 };
-export const setColors = is_dark_mode => (is_dark_mode ? darkMode() : lightMode());
+
+export const setColors = () => lightMode();
diff --git a/packages/bot-web-ui/src/components/summary/summary.scss b/packages/bot-web-ui/src/components/summary/summary.scss
@@ -3,7 +3,7 @@
     align-items: center;
     flex-direction: column;
     justify-content: center;
-    background: linear-gradient(180deg, #f2f3f4 0%, rgba(242, 243, 244, 0) 80%);
+    background: linear-gradient(180deg, var(--general-section-2) 0%, rgba(242, 243, 244, 0) 80%);
     width: 100%;
 
     @include desktop-screen {

diff --git a/packages/bot-web-ui/src/pages/bot-builder/bot-builder.tsx b/packages/bot-web-ui/src/pages/bot-builder/bot-builder.tsx
@@ -29,8 +29,7 @@ const BotBuilder = observer(() => {
     const el_ref = React.useRef<HTMLInputElement | null>(null);
     const isMounted = useIsMounted();
     const { data: remote_config_data } = useRemoteConfig(isMounted());
-    let end_drag_id: null | string = null;
-    let selection_id: null | string = null;
+    let deleted_block_id: null | string = null;
 
     React.useEffect(() => {
         initDatadogLogs(remote_config_data.tracking_datadog);
@@ -61,7 +60,7 @@ const BotBuilder = observer(() => {
 
     const handleBlockChangeOnBotRun = (e: Event) => {
         const { is_reset_button_clicked } = toolbar;
-        if (e.type !== 'ui' && !is_reset_button_clicked) {
+        if (e.type !== 'selected' && !is_reset_button_clicked) {
             botNotification(notification_message.workspace_change);
             removeBlockChangeListener();
         } else if (is_reset_button_clicked) {
@@ -85,16 +84,20 @@ const BotBuilder = observer(() => {
     }, [is_loading]);
 
     const handleBlockDelete = (e: TBlocklyEvents) => {
-        if (e.isUiEvent && e.type === 'selected' && !e.group?.includes('dbot-')) {
-            selection_id = e.newElementId;
+        const { is_reset_button_clicked, setResetButtonState } = toolbar;
+        if (e.type === 'delete' && !is_reset_button_clicked) {
+            deleted_block_id = e.blockId;
         }
-
-        if (e.type === 'drag' && !e.isStart && !e.group?.includes('dbot-')) {
-            end_drag_id = e.group;
-        }
-        if (e.type === 'delete' && (end_drag_id === e.group || selection_id === e.blockId)) {
+        if (e.type === 'selected' && deleted_block_id === e.oldElementId) {
             handleBlockDeleteNotification();
-            end_drag_id = null;
+        }
+        if (
+            e.type === 'change' &&
+            e.name === 'AMOUNT_LIMITS' &&
+            e.newValue === '(min: 0.35 - max: 50000)' &&
+            is_reset_button_clicked
+        ) {
+            setResetButtonState(false);
         }
     };
 

diff --git a/packages/bot-web-ui/src/stores/dashboard-store.ts b/packages/bot-web-ui/src/stores/dashboard-store.ts
@@ -1,6 +1,5 @@
 import DOMPurify from 'dompurify';
-import { action, computed, makeObservable, observable, reaction } from 'mobx';
-import { setColors } from '@deriv/bot-skeleton';
+import { action, makeObservable, observable, reaction } from 'mobx';
 import { TStores } from '@deriv/stores/types';
 import { botNotification } from 'Components/bot-notification/bot-notification';
 import { notification_message, NOTIFICATION_TYPE } from 'Components/bot-notification/bot-notification-utils';
@@ -87,7 +86,6 @@ export default class DashboardStore implements IDashboardStore {
             is_preview_on_popup: observable,
             is_tour_dialog_visible: observable,
             is_web_socket_intialised: observable,
-            is_dark_mode: computed,
             tutorials_combined_content: observable,
             onCloseDialog: action.bound,
             onCloseTour: action.bound,
@@ -167,28 +165,6 @@ export default class DashboardStore implements IDashboardStore {
             ...getQuickStrategyContent,
         ];
 
-        const refreshBotBuilderTheme = () => {
-            Blockly.derivWorkspace.asyncClear();
-            Blockly.Xml.domToWorkspace(
-                Blockly.utils.xml.textToDom(Blockly.derivWorkspace.strategy_to_load),
-                Blockly.derivWorkspace
-            );
-        };
-
-        const setCurrentXML = () => {
-            const xml = Blockly?.Xml.workspaceToDom(Blockly?.derivWorkspace);
-            const current_xml = Blockly?.Xml.domToText(xml);
-            if (Blockly) Blockly.derivWorkspace.strategy_to_load = current_xml;
-        };
-
-        reaction(
-            () => this.is_dark_mode,
-            () => {
-                if (Blockly) setCurrentXML();
-                setColors(this.is_dark_mode);
-                refreshBotBuilderTheme();
-            }
-        );
         reaction(
             () => this.is_preview_on_popup,
             async is_preview_on_popup => {

diff --git a/packages/bot-web-ui/src/stores/load-modal-store.ts b/packages/bot-web-ui/src/stores/load-modal-store.ts
@@ -8,6 +8,7 @@ import {
     save_types,
     saveWorkspaceToRecent,
 } from '@deriv/bot-skeleton';
+import { inject_workspace_options, updateXmlValues } from '@deriv/bot-skeleton/src/scratch/utils';
 import { isDbotRTL } from '@deriv/bot-skeleton/src/utils/workspace';
 import { TStores } from '@deriv/stores/types';
 import { localize } from '@deriv/translations';
@@ -19,10 +20,8 @@ import {
     rudderStackSendUploadStrategyStartEvent,
 } from '../analytics/rudderstack-common-events';
 import { getStrategyType } from '../analytics/utils';
-
-import RootStore from './root-store';
 import { waitForDomElement } from '../utils/dom-observer';
-import { inject_workspace_options, updateXmlValues } from '@deriv/bot-skeleton/src/scratch/utils';
+import RootStore from './root-store';
 
 interface ILoadModalStore {
     active_index: number;

diff --git a/packages/bot-web-ui/src/stores/toolbar-store.ts b/packages/bot-web-ui/src/stores/toolbar-store.ts
@@ -87,7 +87,6 @@ export default class ToolbarStore implements IToolbarStore {
             showIncompatibleStrategyDialog: null,
         });
         workspace.strategy_to_load = workspace.cached_xml.main;
-        this.setResetButtonState(false);
     };
 
     onSortClick = () => {

diff --git a/packages/bot-web-ui/src/types/blockly.types.ts b/packages/bot-web-ui/src/types/blockly.types.ts
@@ -1,7 +1,8 @@
 export type TBlocklyEvents = {
     type: string;
-    element: string;
     group: string;
-    oldValue: string;
+    oldElementId: string;
     blockId: string;
+    name: string;
+    newValue: string;
 };