{
'load-strategy__recent-item--selected': selected_strategy_id === workspace.id,
})}
key={workspace.id}
- onClick={selected_strategy_id === workspace.id ? undefined : () => previewRecentStrategy(workspace.id)}
+ onClick={onRecentWorkspaceClick}
data-testid='dt_recent_workspace_item'
>
diff --git a/packages/bot-web-ui/src/constants/load-modal.ts b/packages/bot-web-ui/src/constants/load-modal.ts
index f0ca5ca37efd..2df51945123b 100644
--- a/packages/bot-web-ui/src/constants/load-modal.ts
+++ b/packages/bot-web-ui/src/constants/load-modal.ts
@@ -3,9 +3,3 @@ export const tabs_title = Object.freeze({
TAB_GOOGLE: 'google_tab',
TAB_RECENT: 'recent_tab',
});
-
-export const clearInjectionDiv = (el_ref?: HTMLElement) => {
- if (el_ref && el_ref.getElementsByClassName('injectionDiv').length > 1) {
- el_ref.removeChild(el_ref.getElementsByClassName('injectionDiv')[0]);
- }
-};
diff --git a/packages/bot-web-ui/src/stores/dashboard-store.ts b/packages/bot-web-ui/src/stores/dashboard-store.ts
index c0c65c21ffa5..176609c7aea0 100644
--- a/packages/bot-web-ui/src/stores/dashboard-store.ts
+++ b/packages/bot-web-ui/src/stores/dashboard-store.ts
@@ -4,7 +4,6 @@ import { setColors } from '@deriv/bot-skeleton';
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';
-import { clearInjectionDiv } from 'Constants/load-modal';
import * as strategy_description from '../constants/quick-strategies';
import { TDescriptionItem } from '../pages/bot-builder/quick-strategy/types';
import {
@@ -168,10 +167,6 @@ export default class DashboardStore implements IDashboardStore {
...getQuickStrategyContent,
];
- const {
- load_modal: { previewRecentStrategy, current_workspace_id },
- } = this.root_store;
-
const refreshBotBuilderTheme = () => {
Blockly.derivWorkspace.asyncClear();
Blockly.Xml.domToWorkspace(
@@ -191,12 +186,7 @@ export default class DashboardStore implements IDashboardStore {
() => {
if (Blockly) setCurrentXML();
setColors(this.is_dark_mode);
- if (this.active_tab === 1) {
- refreshBotBuilderTheme();
- } else {
- refreshBotBuilderTheme();
- previewRecentStrategy(current_workspace_id);
- }
+ refreshBotBuilderTheme();
}
);
reaction(
@@ -360,9 +350,7 @@ export default class DashboardStore implements IDashboardStore {
if (!el_ref) {
// eslint-disable-next-line no-console
console.warn('Could not find preview workspace element.');
- return;
}
- clearInjectionDiv(el_ref);
};
onCloseDialog = (): void => {
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 a4c308e599b4..5166af785e15 100644
--- a/packages/bot-web-ui/src/stores/load-modal-store.ts
+++ b/packages/bot-web-ui/src/stores/load-modal-store.ts
@@ -1,11 +1,17 @@
import React from 'react';
import { action, computed, makeObservable, observable, reaction } from 'mobx';
import { v4 as uuidv4 } from 'uuid';
-import { config, getSavedWorkspaces, load, removeExistingWorkspace, save_types, setColors } from '@deriv/bot-skeleton';
+import {
+ getSavedWorkspaces,
+ load,
+ removeExistingWorkspace,
+ save_types,
+ saveWorkspaceToRecent,
+} from '@deriv/bot-skeleton';
import { isDbotRTL } from '@deriv/bot-skeleton/src/utils/workspace';
import { TStores } from '@deriv/stores/types';
import { localize } from '@deriv/translations';
-import { clearInjectionDiv, tabs_title } from 'Constants/load-modal';
+import { tabs_title } from 'Constants/load-modal';
import { TStrategy } from 'Types';
import {
rudderStackSendUploadStrategyCompletedEvent,
@@ -13,7 +19,10 @@ 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';
interface ILoadModalStore {
active_index: number;
@@ -27,6 +36,7 @@ interface ILoadModalStore {
selected_strategy_id: string | undefined;
is_strategy_removed: boolean;
is_delete_modal_open: boolean;
+ is_open_button_disabled: boolean;
current_workspace_id: string;
preview_workspace: Blockly.WorkspaceSvg | null;
selected_strategy: TStrategy;
@@ -41,6 +51,7 @@ interface ILoadModalStore {
is_body: boolean
) => boolean;
loadFileFromLocal: () => void;
+ loadStrategyOnBotBuilder: () => void;
onActiveIndexChange: () => void;
onDriveConnect: () => void;
onDriveOpen: () => void;
@@ -61,6 +72,7 @@ interface ILoadModalStore {
updateListStrategies: (workspaces: Array) => void;
getRecentFileIcon: (save_type: { [key: string]: string } | string) => string;
getSaveType: (save_type: { [key: string]: string } | string) => string;
+ setOpenButtonDisabled: (is_open_button_disabled: boolean) => void;
}
export default class LoadModalStore implements ILoadModalStore {
@@ -75,7 +87,6 @@ export default class LoadModalStore implements ILoadModalStore {
previewed_strategy_id: observable,
is_load_modal_open: observable,
is_explanation_expand: observable,
- is_open_button_loading: observable,
is_strategy_loaded: observable,
is_delete_modal_open: observable,
is_strategy_removed: observable,
@@ -88,6 +99,8 @@ export default class LoadModalStore implements ILoadModalStore {
preview_workspace: computed,
selected_strategy: computed,
tab_name: computed,
+ is_open_button_disabled: observable,
+ setOpenButtonDisabled: action.bound,
setPreviewedStrategyId: action.bound,
getSelectedStrategyID: action.bound,
refreshStrategies: action.bound,
@@ -103,7 +116,6 @@ export default class LoadModalStore implements ILoadModalStore {
onEntered: action.bound,
onLoadModalClose: action.bound,
onZoomInOutClick: action.bound,
- previewRecentStrategy: action.bound,
setActiveTabIndex: action.bound,
setLoadedLocalFile: action.bound,
setRecentStrategies: action.bound,
@@ -116,6 +128,10 @@ export default class LoadModalStore implements ILoadModalStore {
setDashboardStrategies: action.bound,
updateListStrategies: action.bound,
onToggleDeleteDialog: action,
+ loadStrategyOnModalRecentPreview: action,
+ loadStrategyOnBotBuilder: action,
+ saveStrategyToLocalStorage: action,
+ updateXmlValuesOnStrategySelection: action,
});
this.root_store = root_store;
@@ -129,7 +145,12 @@ export default class LoadModalStore implements ILoadModalStore {
() => this.is_load_modal_open,
async is_load_modal_open => {
if (is_load_modal_open) {
- this.setRecentStrategies((await getSavedWorkspaces()) || []);
+ const saved_workspaces = await getSavedWorkspaces();
+ if (!saved_workspaces) return;
+ this.setRecentStrategies(saved_workspaces);
+ if (saved_workspaces.length > 0 && !this.selected_strategy_id) {
+ this.setSelectedStrategyId(saved_workspaces[0].id);
+ }
} else {
this.onLoadModalClose();
}
@@ -145,6 +166,7 @@ export default class LoadModalStore implements ILoadModalStore {
is_load_modal_open = false;
is_explanation_expand = false;
is_open_button_loading = false;
+ is_open_button_disabled = false;
loaded_local_file: File | null = null;
recent_strategies: Array = [];
dashboard_strategies: Array | [] = [];
@@ -179,6 +201,10 @@ export default class LoadModalStore implements ILoadModalStore {
return '';
}
+ setOpenButtonDisabled = (is_open_button_disabled: boolean) => {
+ this.is_open_button_disabled = is_open_button_disabled;
+ };
+
setPreviewedStrategyId = (clicked_id: string) => {
this.previewed_strategy_id = clicked_id;
};
@@ -199,35 +225,146 @@ export default class LoadModalStore implements ILoadModalStore {
this.dashboard_strategies = recent_strategies;
};
- handleFileChange = (
- event: React.MouseEvent | React.FormEvent | DragEvent,
- is_body = true
- ): boolean => {
- this.imported_strategy_type = 'pending';
- this.upload_id = uuidv4();
- let files;
- if (event.type === 'drop') {
- event.stopPropagation();
- event.preventDefault();
+ onDriveConnect = (): void => {
+ const { google_drive } = this.root_store;
- ({ files } = event.dataTransfer);
+ if (google_drive.is_authorised) {
+ google_drive.signOut();
} else {
- ({ files } = event.target);
+ google_drive.signIn();
}
+ };
- const [file] = files;
+ onDriveOpen = async () => {
+ const { google_drive } = this.root_store;
+ const { verifyGoogleDriveAccessToken } = google_drive;
+ const result = await verifyGoogleDriveAccessToken();
+ if (result === 'not_verified') return;
- if (!is_body) {
- if (file.name.includes('xml')) {
- this.setLoadedLocalFile(file);
- this.getDashboardStrategies();
- } else {
- return false;
- }
+ if (google_drive) {
+ google_drive.upload_id = uuidv4();
}
- this.readFile(!is_body, event, file);
- event.target.value = '';
- return true;
+
+ rudderStackSendUploadStrategyStartEvent({
+ upload_provider: 'google_drive',
+ upload_id: google_drive.upload_id,
+ });
+
+ const { loadFile } = this.root_store.google_drive;
+ const load_file = await loadFile();
+ if (!load_file) return;
+ const xml_doc = load_file?.xml_doc;
+ const file_name = load_file?.file_name;
+ await load({
+ block_string: xml_doc,
+ file_name,
+ workspace: window.Blockly.derivWorkspace,
+ from: save_types.GOOGLE_DRIVE,
+ drop_event: null,
+ strategy_id: null,
+ showIncompatibleStrategyDialog: null,
+ });
+
+ const { active_tab } = this.root_store.dashboard;
+ if (active_tab === 1) this.toggleLoadModal();
+
+ this.root_store.dashboard.is_dialog_open = false;
+ };
+
+ onEntered = (): void => {
+ if (this.recent_strategies.length === 0 || this.tab_name !== tabs_title.TAB_RECENT) return;
+ this.setOpenButtonDisabled(true);
+ const { blockly_store } = this.root_store;
+ const { setLoading } = blockly_store;
+ setLoading(true);
+ this.loadStrategyOnModalRecentPreview(this.selected_strategy_id);
+ this.updateXmlValuesOnStrategySelection();
+ this.setOpenButtonDisabled(false);
+ };
+
+ onLoadModalClose = (): void => {
+ if (this.local_workspace) {
+ this.local_workspace = null;
+ }
+ this.setActiveTabIndex(0); // Reset to first tab.
+ this.setLoadedLocalFile(null);
+ };
+
+ onZoomInOutClick = (is_zoom_in: string): void => {
+ if (this.preview_workspace) {
+ this.preview_workspace.zoomCenter(is_zoom_in ? 1 : -1);
+ }
+ };
+
+ setActiveTabIndex = (index: number): void => {
+ this.active_index = index;
+ };
+
+ setLoadedLocalFile = (loaded_local_file: File | null): void => {
+ this.loaded_local_file = loaded_local_file;
+ };
+
+ setRecentStrategies = (recent_strategies: TStrategy[]): void => {
+ this.recent_strategies = recent_strategies;
+ };
+
+ refreshStrategies = (): void => {
+ this.setRecentStrategies(this.recent_strategies);
+ };
+
+ setSelectedStrategyId = (selected_strategy_id: string): void => {
+ this.selected_strategy_id = selected_strategy_id;
+ };
+
+ toggleExplanationExpand = (): void => {
+ this.is_explanation_expand = !this.is_explanation_expand;
+ };
+
+ toggleLoadModal = (): void => {
+ this.is_load_modal_open = !this.is_load_modal_open;
+ this.recent_workspace?.dispose();
+ this.recent_workspace = null;
+ this.setLoadedLocalFile(null);
+ };
+
+ toggleTourLoadModal = (toggle = !this.is_load_modal_open) => {
+ this.is_load_modal_open = toggle;
+ };
+
+ updateListStrategies = (workspaces: Array): void => {
+ if (workspaces) {
+ (this.dashboard_strategies as Array) = workspaces;
+ }
+ };
+
+ getRecentFileIcon = (save_type: { [key: string]: string } | string): string => {
+ switch (save_type) {
+ case save_types.UNSAVED:
+ return 'IcReports';
+ case save_types.LOCAL:
+ return 'IcMyComputer';
+ case save_types.GOOGLE_DRIVE:
+ return 'IcGoogleDrive';
+ default:
+ return 'IcReports';
+ }
+ };
+
+ getSaveType = (save_type: { [key: string]: string } | string): string => {
+ switch (save_type) {
+ case save_types.UNSAVED:
+ return localize('Unsaved');
+ case save_types.LOCAL:
+ return localize('Local');
+ case save_types.GOOGLE_DRIVE:
+ return localize('Google Drive');
+ default:
+ return localize('Unsaved');
+ }
+ };
+
+ onToggleDeleteDialog = (is_delete_modal_open: boolean): void => {
+ this.is_delete_modal_open = is_delete_modal_open;
};
resetBotBuilderStrategy = () => {
@@ -309,8 +446,10 @@ export default class LoadModalStore implements ILoadModalStore {
};
onActiveIndexChange = (): void => {
+ this.setOpenButtonDisabled(true);
if (this.tab_name === tabs_title.TAB_RECENT) {
- this.previewRecentStrategy(this.selected_strategy_id);
+ this.loadStrategyOnModalRecentPreview(this.selected_strategy_id);
+ this.updateXmlValuesOnStrategySelection();
} else if (this.recent_workspace) {
setTimeout(() => {
// Dispose of recent workspace when switching away from Recent tab.
@@ -343,194 +482,45 @@ export default class LoadModalStore implements ILoadModalStore {
if (this.tab_name !== tabs_title.TAB_LOCAL && this.drop_zone) {
this.drop_zone.removeEventListener('drop', event => this.handleFileChange(event, false));
}
+ this.setOpenButtonDisabled(false);
};
- onDriveConnect = (): void => {
- const { google_drive } = this.root_store;
-
- if (google_drive.is_authorised) {
- google_drive.signOut();
+ handleFileChange = (
+ event: React.MouseEvent | React.FormEvent | DragEvent,
+ is_body = true
+ ): boolean => {
+ this.imported_strategy_type = 'pending';
+ this.upload_id = uuidv4();
+ let files;
+ if (event.type === 'drop') {
+ event.stopPropagation();
+ event.preventDefault();
+ ({ files } = event.dataTransfer as DragEvent);
} else {
- google_drive.signIn();
- }
- };
-
- onDriveOpen = async () => {
- const { google_drive } = this.root_store;
- const { verifyGoogleDriveAccessToken } = google_drive;
- const result = await verifyGoogleDriveAccessToken();
- if (result === 'not_verified') return;
-
- if (google_drive) {
- google_drive.upload_id = uuidv4();
- }
- rudderStackSendUploadStrategyStartEvent({ upload_provider: 'google_drive', upload_id: google_drive.upload_id });
- const { loadFile } = this.root_store.google_drive;
- const load_file = await loadFile();
- if (!load_file) return;
- const xml_doc = load_file?.xml_doc;
- const file_name = load_file?.file_name;
- await load({
- block_string: xml_doc,
- file_name,
- workspace: window.Blockly.derivWorkspace,
- from: save_types.GOOGLE_DRIVE,
- drop_event: null,
- strategy_id: null,
- showIncompatibleStrategyDialog: null,
- });
-
- const { active_tab } = this.root_store.dashboard;
- if (active_tab === 1) this.toggleLoadModal();
-
- this.root_store.dashboard.is_dialog_open = false;
- };
-
- onEntered = (): void => {
- this.previewRecentStrategy(this.selected_strategy_id);
- };
-
- onLoadModalClose = (): void => {
- if (this.recent_workspace) {
- this.recent_workspace = null;
- }
- if (this.local_workspace) {
- this.local_workspace = null;
- }
-
- this.setActiveTabIndex(0, true); // Reset to first tab.
- this.setLoadedLocalFile(null);
- };
-
- onZoomInOutClick = (is_zoom_in: string): void => {
- if (this.preview_workspace) {
- this.preview_workspace.zoomCenter(is_zoom_in ? 1 : -1);
- }
- };
-
- previewRecentStrategy = (workspace_id: string): void => {
- if (!workspace_id) this.setSelectedStrategyId(this.current_workspace_id);
- else this.setSelectedStrategyId(workspace_id);
- if (!this.selected_strategy) {
- return;
- }
- const {
- dashboard: { active_tab },
- } = this.root_store;
- //removed the dispose here so on switch of tab it does not
- //throw xml error
- if (active_tab === 1 && !this.is_load_modal_open) {
- this.recent_workspace = null;
- this.setLoadedLocalFile(null);
- }
-
- const dark_mode = document.body.classList.contains('theme--dark');
- setColors(dark_mode);
-
- //to load the bot on first load
- const ref = document.getElementById('load-strategy__blockly-container');
- if (!ref) {
- // eslint-disable-next-line no-console
- console.warn('Could not find preview workspace element.');
- return;
- }
- if (this.tab_name !== tabs_title.TAB_LOCAL && this.recent_workspace) {
- clearInjectionDiv(ref);
- this.recent_workspace.dispose();
- this.recent_workspace = null;
- }
- if (!this.recent_workspace?.rendered) {
- this.recent_workspace = window.Blockly.inject(ref, {
- media: `${__webpack_public_path__}media/`,
- zoom: {
- wheel: true,
- startScale: config.workspaces.previewWorkspaceStartScale,
- },
- readOnly: true,
- scrollbars: true,
- renderer: 'zelos',
- theme: window?.Blockly?.Themes?.zelos_renderer,
- });
- }
- this.refreshStrategiesTheme();
- };
-
- setActiveTabIndex = (index: number): void => {
- this.active_index = index;
- };
-
- setLoadedLocalFile = (loaded_local_file: File | null): void => {
- this.loaded_local_file = loaded_local_file;
- };
-
- setRecentStrategies = (recent_strategies: TStrategy[]): void => {
- this.recent_strategies = recent_strategies;
- };
-
- refreshStrategies = (): void => {
- this.setRecentStrategies(this.recent_strategies);
- };
-
- setSelectedStrategyId = (selected_strategy_id: string): void => {
- this.selected_strategy_id = selected_strategy_id;
- };
-
- toggleExplanationExpand = (): void => {
- this.is_explanation_expand = !this.is_explanation_expand;
- };
-
- toggleLoadModal = (): void => {
- this.is_load_modal_open = !this.is_load_modal_open;
- if (this.selected_strategy_id) this.previewRecentStrategy(this.selected_strategy_id);
- this.setLoadedLocalFile(null);
- };
-
- toggleTourLoadModal = (toggle = !this.is_load_modal_open) => {
- this.is_load_modal_open = toggle;
- };
-
- updateListStrategies = (workspaces: Array): void => {
- if (workspaces) {
- (this.dashboard_strategies as Array) = workspaces;
+ ({ files } = event.target);
}
- };
- getRecentFileIcon = (save_type: { [key: string]: string } | string): string => {
- switch (save_type) {
- case save_types.UNSAVED:
- return 'IcReports';
- case save_types.LOCAL:
- return 'IcMyComputer';
- case save_types.GOOGLE_DRIVE:
- return 'IcGoogleDrive';
- default:
- return 'IcReports';
- }
- };
+ const [file] = files;
- getSaveType = (save_type: { [key: string]: string } | string): string => {
- switch (save_type) {
- case save_types.UNSAVED:
- return localize('Unsaved');
- case save_types.LOCAL:
- return localize('Local');
- case save_types.GOOGLE_DRIVE:
- return localize('Google Drive');
- default:
- return localize('Unsaved');
+ if (!is_body) {
+ if (file.name.includes('xml')) {
+ this.setLoadedLocalFile(file);
+ this.getDashboardStrategies();
+ } else {
+ return false;
+ }
}
- };
-
- onToggleDeleteDialog = (is_delete_modal_open: boolean): void => {
- this.is_delete_modal_open = is_delete_modal_open;
+ this.readFile(!is_body, event as DragEvent, file);
+ (event.target as HTMLInputElement).value = '';
+ return true;
};
readFile = (is_preview: boolean, drop_event: DragEvent, file: File): void => {
if (this.upload_id && is_preview) {
rudderStackSendUploadStrategyStartEvent({ upload_provider: 'my_computer', upload_id: this.upload_id });
}
- const file_name = file?.name.replace(/\.[^/.]+$/, '');
const reader = new FileReader();
+ const file_name = file?.name.replace(/\.[^/.]+$/, '') || '';
reader.onload = action(async e => {
const load_options = {
@@ -538,35 +528,14 @@ export default class LoadModalStore implements ILoadModalStore {
drop_event,
from: save_types.LOCAL,
workspace: null as Blockly.WorkspaceSvg | null,
- file_name: '',
+ file_name,
strategy_id: '',
showIncompatibleStrategyDialog: false,
};
- const ref = document?.getElementById('load-strategy__blockly-container');
const upload_type = getStrategyType(load_options?.block_string ?? '');
- if (is_preview && ref) {
- this.local_workspace = Blockly.inject(ref, {
- media: `${__webpack_public_path__}media/`, // eslint-disable-line
- zoom: {
- wheel: false,
- startScale: config.workspaces.previewWorkspaceStartScale,
- },
- readOnly: true,
- scrollbars: true,
- renderer: 'zelos',
- theme: window?.Blockly?.Themes?.zelos_renderer,
- });
- load_options.workspace = this.local_workspace;
- if (load_options.workspace) {
- (load_options.workspace as any).RTL = isDbotRTL();
- }
- this.imported_strategy_type = upload_type;
- } else {
- load_options.workspace = window.Blockly.derivWorkspace;
- load_options.file_name = file_name;
- }
const result = await load(load_options);
+ this.loadStrategyOnModalLocalPreview(load_options);
if (!is_preview && !result?.error) {
rudderStackSendUploadStrategyCompletedEvent({
upload_provider: 'my_computer',
@@ -586,4 +555,76 @@ export default class LoadModalStore implements ILoadModalStore {
reader.readAsText(file);
};
+
+ saveStrategyToLocalStorage = async () => {
+ const { save_modal } = this.root_store;
+ const { updateBotName } = save_modal;
+ const { convertedDom, from, file_name } = window.Blockly.xmlValues;
+ updateBotName(file_name);
+ await saveWorkspaceToRecent(convertedDom, from);
+ const recent_files = await getSavedWorkspaces();
+ if (recent_files?.length > 0) this.setSelectedStrategyId(recent_files[0]?.id);
+ };
+
+ loadStrategyOnBotBuilder = async () => {
+ const { strategy_id = window.Blockly.utils.idGenerator.genUid(), convertedDom } = window.Blockly.xmlValues;
+ const derivWorkspace = window.Blockly.derivWorkspace;
+
+ window.Blockly.Xml.clearWorkspaceAndLoadFromXml(convertedDom, derivWorkspace);
+ derivWorkspace.cleanUp();
+ derivWorkspace.clearUndo();
+ derivWorkspace.current_strategy_id = strategy_id;
+ };
+
+ updateXmlValuesOnStrategySelection = () => {
+ if (this.recent_strategies.length === 0) return;
+ updateXmlValues({
+ strategy_id: this.selected_strategy_id,
+ convertedDom: window?.Blockly?.utils?.xml?.textToDom(this.selected_strategy?.xml),
+ file_name: this.selected_strategy?.name,
+ from: this.selected_strategy?.save_type || save_types.UNSAVED,
+ });
+ };
+
+ loadStrategyOnModalRecentPreview = async workspace_id => {
+ this.setOpenButtonDisabled(true);
+ if (this.recent_strategies.length === 0 || this.tab_name !== tabs_title.TAB_RECENT) return;
+
+ const { blockly_store } = this.root_store;
+ const { setLoading } = blockly_store;
+
+ const inject_options = { ...inject_workspace_options, theme: window?.Blockly?.Themes?.zelos_renderer };
+
+ this.setLoadedLocalFile(null);
+ this.setSelectedStrategyId(workspace_id);
+
+ await waitForDomElement('#load-strategy__blockly-container');
+ const ref_preview = document?.getElementById('load-strategy__blockly-container');
+
+ if (!this.recent_workspace) this.recent_workspace = window.Blockly.inject(ref_preview, inject_options);
+ (this.recent_workspace as any).RTL = isDbotRTL();
+
+ const convertedDom = window.Blockly?.utils?.xml?.textToDom(this.selected_strategy?.xml);
+ const mainWorkspace = window.Blockly?.getMainWorkspace();
+
+ window.Blockly?.Xml?.clearWorkspaceAndLoadFromXml(convertedDom, mainWorkspace);
+
+ setLoading(false);
+ this.setOpenButtonDisabled(false);
+ };
+
+ loadStrategyOnModalLocalPreview = async load_options => {
+ this.setOpenButtonDisabled(true);
+ const injectWorkspace = { ...inject_workspace_options, theme: window?.Blockly?.Themes?.zelos_renderer };
+ const ref = document?.getElementById('load-strategy__blockly-container');
+
+ this.local_workspace = window.Blockly.inject(ref, injectWorkspace);
+ load_options.workspace = this.local_workspace;
+
+ if (load_options.workspace) {
+ (load_options.workspace as any).RTL = isDbotRTL();
+ }
+
+ await load(load_options);
+ };
}