Onboarding deploy tooltip fix (#2490)

app/client/src/components/editorComponents/Onboarding/Tooltip.tsx

@@ -169,6 +169,10 @@ const OnboardingToolTip: React.FC<OnboardingToolTipProps> = (
             if (!nextOpenState && props.dismissOnOutsideClick) {
               dispatch(showTooltip(OnboardingStep.NONE));
             }
+
+            if (!nextOpenState && tooltipConfig.onClickOutside) {
+              dispatch(tooltipConfig.onClickOutside);
+            }
           }}
         >
           {props.children}

app/client/src/constants/OnboardingConstants.tsx

@@ -1,5 +1,6 @@
 import { ReduxAction, ReduxActionTypes } from "./ReduxActionConstants";
 import { EventName } from "../utils/AnalyticsUtil";
+import { showTooltip } from "actions/onboardingActions";
 
 export enum OnboardingStep {
   NONE = -1,
@@ -20,6 +21,7 @@ export type OnboardingTooltip = {
     label: string;
     action?: ReduxAction<OnboardingStep>;
   };
+  onClickOutside?: ReduxAction<any>;
   snippet?: string;
   isFinalStep?: boolean;
 };
@@ -113,16 +115,13 @@ export const OnboardingConfig: Record<OnboardingStep, OnboardingStepConfig> = {
   },
   [OnboardingStep.SUCCESSFUL_BINDING]: {
     setup: () => {
-      return [
+      return [];
-        {
-          type: ReduxActionTypes.LISTEN_FOR_WIDGET_UNSELECTION,
-        },
-      ];
     },
     tooltip: {
       title: "Your widget is now talking to your data 👌👏",
       description:
         "You can access widgets and actions as JS variables anywhere inside {{ }}",
+      onClickOutside: showTooltip(OnboardingStep.DEPLOY),
     },
     eventName: "ONBOARDING_SUCCESSFUL_BINDING",
   },

app/client/src/pages/Editor/EditorHeader.tsx

@@ -295,6 +295,7 @@ export const EditorHeader = (props: EditorHeaderProps) => {
             <OnboardingToolTip
               step={[OnboardingStep.DEPLOY]}
               position={Position.BOTTOM_RIGHT}
+              dismissOnOutsideClick={false}
             >
               <Indicator
                 step={OnboardingStep.SUCCESSFUL_BINDING}

app/client/src/sagas/OnboardingSagas.ts

@@ -243,26 +243,6 @@ function* listenForCreateAction() {
   yield put(showIndicator(OnboardingStep.RUN_QUERY_SUCCESS));
 }
 
-function* listenForWidgetUnselection() {
-  while (true) {
-    yield take();
-
-    // After any of these events we show the deploy tooltip
-    yield take([
-      ReduxActionTypes.HIDE_PROPERTY_PANE,
-      ReduxActionTypes.SET_WIDGET_RESIZING,
-    ]);
-    const currentStep = yield select(getCurrentStep);
-    const isinOnboarding = yield select(inOnboarding);
-
-    if (!isinOnboarding || currentStep !== OnboardingStep.DEPLOY) return;
-
-    yield delay(1000);
-    yield put(showTooltip(OnboardingStep.DEPLOY));
-    return;
-  }
-}
-
 function* listenForDeploySaga() {
   while (true) {
     yield take();
@@ -338,10 +318,6 @@ export default function* onboardingSagas() {
       ReduxActionTypes.LISTEN_FOR_TABLE_WIDGET_BINDING,
       listenForSuccessfullBinding,
     ),
-    takeEvery(
-      ReduxActionTypes.LISTEN_FOR_WIDGET_UNSELECTION,
-      listenForWidgetUnselection,
-    ),
     takeEvery(ReduxActionTypes.SET_CURRENT_STEP, setupOnboardingStep),
     takeEvery(ReduxActionTypes.LISTEN_FOR_DEPLOY, listenForDeploySaga),
   ]);