fix: welcome card text inputs not saving due to shared firstRender state (Backport) (#6780)

apps/web/lib/constants.ts

@@ -19,8 +19,7 @@ export const ENCRYPTION_KEY = env.ENCRYPTION_KEY;
 // Other
 export const CRON_SECRET = env.CRON_SECRET;
 export const DEFAULT_BRAND_COLOR = "#64748b";
-export const FB_LOGO_URL =
-  "https://s3.eu-central-1.amazonaws.com/listmonk-formbricks/Formbricks-Light-transparent.png";
+export const FB_LOGO_URL = `${WEBAPP_URL}/logo-transparent.png`;
 
 export const PRIVACY_URL = env.PRIVACY_URL;
 export const TERMS_URL = env.TERMS_URL;

apps/web/modules/survey/editor/components/edit-welcome-card.tsx

@@ -3,7 +3,6 @@
 import * as Collapsible from "@radix-ui/react-collapsible";
 import { Hand } from "lucide-react";
 import { usePathname } from "next/navigation";
-import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { TSurvey, TSurveyQuestionId, TSurveyWelcomeCard } from "@formbricks/types/surveys/types";
 import { TUserLocale } from "@formbricks/types/user";
@@ -38,8 +37,6 @@ export const EditWelcomeCard = ({
 }: EditWelcomeCardProps) => {
   const { t } = useTranslation();
 
-  const [firstRender, setFirstRender] = useState(true);
-
   const path = usePathname();
   const environmentId = path?.split("/environments/")[1]?.split("/")[0];
 
@@ -138,8 +135,6 @@ export const EditWelcomeCard = ({
                 setSelectedLanguageCode={setSelectedLanguageCode}
                 locale={locale}
                 isStorageConfigured={isStorageConfigured}
-                firstRender={firstRender}
-                setFirstRender={setFirstRender}
               />
             </div>
             <div className="mt-3">
@@ -155,8 +150,6 @@ export const EditWelcomeCard = ({
                 setSelectedLanguageCode={setSelectedLanguageCode}
                 locale={locale}
                 isStorageConfigured={isStorageConfigured}
-                firstRender={firstRender}
-                setFirstRender={setFirstRender}
               />
             </div>
 
@@ -177,8 +170,6 @@ export const EditWelcomeCard = ({
                     label={t("environments.surveys.edit.next_button_label")}
                     locale={locale}
                     isStorageConfigured={isStorageConfigured}
-                    firstRender={firstRender}
-                    setFirstRender={setFirstRender}
                   />
                 </div>
               </div>

apps/web/modules/ui/components/editor/components/toolbar-plugin.tsx

@@ -262,22 +262,27 @@ export const ToolbarPlugin = (
         const root = $getRoot();
         root.clear();
         root.append(...nodes);
-
-        editor.registerUpdateListener(({ editorState }) => {
-          editorState.read(() => {
-            const textInHtml = $generateHtmlFromNodes(editor)
-              .replace(/&lt;/g, "<")
-              .replace(/&gt;/g, ">")
-              .replace(/white-space:\s*pre-wrap;?/g, "");
-            setText.current(textInHtml);
-          });
-        });
       });
     }
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  // Register text-saving update listener - always active for each editor instance
+  useEffect(() => {
+    const unregister = editor.registerUpdateListener(({ editorState }) => {
+      editorState.read(() => {
+        const textInHtml = $generateHtmlFromNodes(editor)
+          .replace(/&lt;/g, "<")
+          .replace(/&gt;/g, ">")
+          .replace(/white-space:\s*pre-wrap;?/g, "");
+        setText.current(textInHtml);
+      });
+    });
+
+    return unregister;
+  }, [editor]);
+
   useEffect(() => {
     return mergeRegister(
       editor.registerUpdateListener(({ editorState }) => {