fix: variables initialization in logic editor preview (#4819)

Co-authored-by: pandeymangg <anshuman.pandey9999@gmail.com>

docs/api-reference/openapi.json

@@ -7725,7 +7725,7 @@
           }
         },
         "summary": "Health Check",
-        "tags": ["default"]
+        "tags": ["Health"]
       }
     }
   },

packages/surveys/src/components/general/survey.tsx

@@ -119,12 +119,22 @@ export function Survey({
   }, [apiHost, environmentId, getSetIsError, getSetIsResponseSendingFinished, surveyState]);
 
   const [localSurvey, setlocalSurvey] = useState<TJsEnvironmentStateSurvey>(survey);
+  const [currentVariables, setCurrentVariables] = useState<TResponseVariables>({});
 
   // Update localSurvey when the survey prop changes (it changes in case of survey editor)
   useEffect(() => {
     setlocalSurvey(survey);
   }, [survey]);
 
+  useEffect(() => {
+    setCurrentVariables(
+      survey.variables.reduce<TResponseVariables>((acc, variable) => {
+        acc[variable.id] = variable.value;
+        return acc;
+      }, {})
+    );
+  }, [survey.variables]);
+
   const autoFocusEnabled = autoFocus ?? window.self === window.top;
 
   const [questionId, setQuestionId] = useState(() => {
@@ -146,12 +156,6 @@ export function Survey({
   const [history, setHistory] = useState<string[]>([]);
   const [responseData, setResponseData] = useState<TResponseData>(hiddenFieldsRecord ?? {});
   const [_variableStack, setVariableStack] = useState<VariableStackEntry[]>([]);
-  const [currentVariables, setCurrentVariables] = useState<TResponseVariables>(() => {
-    return localSurvey.variables.reduce<TResponseVariables>((acc, variable) => {
-      acc[variable.id] = variable.value;
-      return acc;
-    }, {});
-  });
 
   const [ttc, setTtc] = useState<TResponseTtc>({});
   const cardArrangement = useMemo(() => {
@@ -162,9 +166,7 @@ export function Survey({
   }, [localSurvey.type, styling.cardArrangement?.linkSurveys, styling.cardArrangement?.appSurveys]);
 
   const currentQuestionIndex = localSurvey.questions.findIndex((q) => q.id === questionId);
-  const currentQuestion = useMemo(() => {
-    return localSurvey.questions.find((q) => q.id === questionId);
-  }, [questionId, localSurvey.questions]);
+  const currentQuestion = localSurvey.questions[currentQuestionIndex];
 
   const contentRef = useRef<HTMLDivElement | null>(null);
   const showProgressBar = !styling.hideProgressBar;