[REF-3375] useMemo on generateUUID props to maintain consistent value (#3708)

When using rx.vars.get_uuid_string_var, wrap the prop Var in `useMemo` so that
the value remains consistent across re-renders of the component.

Fix #3707
This commit is contained in:
Masen Furer 2024-07-26 17:10:08 -07:00 committed by GitHub
parent c4346c2624
commit a4e3f05601
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -2552,17 +2552,25 @@ class CallableVar(BaseVar):
def get_uuid_string_var() -> Var:
"""Return a var that generates UUIDs via .web/utils/state.js.
"""Return a Var that generates a single memoized UUID via .web/utils/state.js.
useMemo with an empty dependency array ensures that the generated UUID is
consistent across re-renders of the component.
Returns:
the var to generate UUIDs at runtime.
A Var that generates a UUID at runtime.
"""
from reflex.utils.imports import ImportVar
unique_uuid_var_data = VarData(
imports={f"/{constants.Dirs.STATE_PATH}": {ImportVar(tag="generateUUID")}} # type: ignore
imports={
f"/{constants.Dirs.STATE_PATH}": {ImportVar(tag="generateUUID")}, # type: ignore
"react": "useMemo",
}
)
return BaseVar(
_var_name="generateUUID()", _var_type=str, _var_data=unique_uuid_var_data
_var_name="useMemo(generateUUID, [])",
_var_type=str,
_var_data=unique_uuid_var_data,
)