diff --git a/packages/bot-skeleton/src/scratch/blockly.js b/packages/bot-skeleton/src/scratch/blockly.js index 0c04d2213feb..0ea129a50de8 100644 --- 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 index efe52070d30a..f32d85d6030b 100644 --- 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 index 100ccd5657e2..e6e0f9f0ae39 100644 --- 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 index 4410cc0cba57..ae5491cb650e 100644 --- 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(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 index 176609c7aea0..0333cbd721a2 100644 --- 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 index 5166af785e15..9bf4f9ae7170 100644 --- 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 index 8c79d2c45deb..d29deb5e2d9f 100644 --- 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 index 4489c6b6ecd1..b8d0bfe70892 100644 --- 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; };