Initial plan

The "Required" label in surveys was not being translated because
the language was changed in useEffect, which runs after the first
render. This caused components to render with English (fallback)
before the language was updated.

Now the language is set synchronously before rendering, ensuring
all child components get the correct translations immediately.

packages/surveys/src/components/i18n/provider.tsx

@@ -4,8 +4,17 @@ import { I18nextProvider } from "react-i18next";
 import i18n from "../../lib/i18n.config";
 
 export const I18nProvider = ({ language, children }: { language: string; children?: ComponentChildren }) => {
-  useEffect(() => {
+  // Set language synchronously on initial render so children get the correct translations immediately.
+  // This is safe because all translations are pre-loaded (bundled) in i18n.config.ts.
+  if (i18n.language !== language) {
     i18n.changeLanguage(language);
+  }
+
+  // Handle language prop changes after initial render
+  useEffect(() => {
+    if (i18n.language !== language) {
+      i18n.changeLanguage(language);
+    }
   }, [language]);
 
   // work around for react-i18next not supporting preact