Skip to content

Commit 93245ef

Browse files
authored
[ENG-4255] Code blocks lead to redefined const in web page (#4598)
Instead of potentially defining `_LANGUAGE` constant twice in a component, simply pass the language prop directly to the hook generator function. If no language is passed, then it defaults to `_LANGUAGE`, which continues to work for markdown component_map use case.
1 parent 5f169bc commit 93245ef

File tree

1 file changed

+13
-9
lines changed
  • reflex/components/datadisplay

1 file changed

+13
-9
lines changed

reflex/components/datadisplay/code.py

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -502,8 +502,8 @@ def _render(self):
502502

503503
theme = self.theme
504504

505-
out.add_props(style=theme).remove_props("theme", "code", "language").add_props(
506-
children=self.code, language=_LANGUAGE
505+
out.add_props(style=theme).remove_props("theme", "code").add_props(
506+
children=self.code,
507507
)
508508

509509
return out
@@ -512,20 +512,25 @@ def _exclude_props(self) -> list[str]:
512512
return ["can_copy", "copy_button"]
513513

514514
@classmethod
515-
def _get_language_registration_hook(cls) -> str:
515+
def _get_language_registration_hook(cls, language_var: Var = _LANGUAGE) -> str:
516516
"""Get the hook to register the language.
517517
518+
Args:
519+
language_var: The const/literal Var of the language module to import.
520+
For markdown, uses the default placeholder _LANGUAGE. For direct use,
521+
a LiteralStringVar should be passed via the language prop.
522+
518523
Returns:
519524
The hook to register the language.
520525
"""
521526
return f"""
522-
if ({_LANGUAGE!s}) {{
527+
if ({language_var!s}) {{
523528
(async () => {{
524529
try {{
525-
const module = await import(`react-syntax-highlighter/dist/cjs/languages/prism/${{{_LANGUAGE!s}}}`);
526-
SyntaxHighlighter.registerLanguage({_LANGUAGE!s}, module.default);
530+
const module = await import(`react-syntax-highlighter/dist/cjs/languages/prism/${{{language_var!s}}}`);
531+
SyntaxHighlighter.registerLanguage({language_var!s}, module.default);
527532
}} catch (error) {{
528-
console.error(`Error importing language module for ${{{_LANGUAGE!s}}}:`, error);
533+
console.error(`Error importing language module for ${{{language_var!s}}}:`, error);
529534
}}
530535
}})();
531536
}}
@@ -547,8 +552,7 @@ def add_hooks(self) -> list[str | Var]:
547552
The hooks for the component.
548553
"""
549554
return [
550-
f"const {_LANGUAGE!s} = {self.language!s}",
551-
self._get_language_registration_hook(),
555+
self._get_language_registration_hook(language_var=self.language),
552556
]
553557

554558

0 commit comments

Comments
 (0)