{
+ setNotificationTimer(0);
+ }}
+ onMouseLeave={() => {
+ setNotificationTimer(timeout);
+ }}
+ className={className ?? 'bot-snackbar'}
+ data-testid='bot-snackbar-notification-container'
+ >
+
+ {message && }
+
+
+
+ );
+};
+export default BotSnackbar;
diff --git a/packages/bot-web-ui/src/components/bot-snackbar/index.tsx b/packages/bot-web-ui/src/components/bot-snackbar/index.tsx
new file mode 100644
index 000000000000..28deeddded1e
--- /dev/null
+++ b/packages/bot-web-ui/src/components/bot-snackbar/index.tsx
@@ -0,0 +1,4 @@
+import BotSnackbar from './bot-snackbar';
+import './bot-snackbar.scss';
+
+export default BotSnackbar;
diff --git a/packages/bot-web-ui/src/components/dashboard/bot-builder/bot-builder.tsx b/packages/bot-web-ui/src/components/dashboard/bot-builder/bot-builder.tsx
index 3caffd8258e4..71ba996f978a 100644
--- a/packages/bot-web-ui/src/components/dashboard/bot-builder/bot-builder.tsx
+++ b/packages/bot-web-ui/src/components/dashboard/bot-builder/bot-builder.tsx
@@ -1,9 +1,10 @@
-import React from 'react';
+import React, { useRef, useState } from 'react';
import classNames from 'classnames';
import { observer } from '@deriv/stores';
import { useDBotStore } from '../../../stores/useDBotStore';
+import BotSnackbar from '../../bot-snackbar';
import LoadModal from '../../load-modal';
import SaveModal from '../dashboard-component/load-bot-preview/save-modal';
import BotBuilderTourHandler from '../dbot-tours/bot-builder-tour';
@@ -12,8 +13,11 @@ import QuickStrategy from '../quick-strategy';
import WorkspaceWrapper from './workspace-wrapper';
const BotBuilder = observer(() => {
- const { dashboard, app } = useDBotStore();
+ const { dashboard, app, run_panel } = useDBotStore();
const { active_tab, active_tour, is_preview_on_popup } = dashboard;
+ const { is_running } = run_panel;
+ const is_blockly_listener_registered = useRef(false);
+ const [show_snackbar, setShowSnackbar] = useState(false);
const { onMount, onUnmount } = app;
const el_ref = React.useRef