···345345 newTheme: CommunityTheme,
346346 overrides?: Partial<ThemeDefinition>,
347347) {
348348- // FIXME: only on prod, we have two style elements with the same id
349349- // we need to get rid of all of them except the one we want to update
350348 try {
349349+ // Only update the text content of existing style tags, don't remove them
350350+ // This prevents React hydration errors during navigation
351351 const allThemeStyles = document.querySelectorAll(
352352 "style[id='theme-styles']",
353353 );
354354- allThemeStyles.forEach((style, index) => {
355355- if (index === 0) {
356356- style.textContent = generateThemeStyles(newTheme, overrides);
357357- } else {
358358- style.remove();
359359- }
354354+ const newStyles = generateThemeStyles(newTheme, overrides);
355355+356356+ // Update all style elements with the same content
357357+ // This way React can manage the DOM without conflicts
358358+ allThemeStyles.forEach((style) => {
359359+ style.textContent = newStyles;
360360 });
361361 } catch (error) {
362362 console.error(error);