[REF-1999] on_mount does not work properly with custom EventChain Vars

[masenf]

Describe the bug
When trying to use custom JS code in an EventChain var: rx.Var.create("console.log('foo')").to(rx.EventChain), the generated code is incorrect and does not actually get triggered, just defined.

To Reproduce

import reflex as rx
from reflex.utils.imports import ImportDict


class Custom(rx.Fragment):
    def _get_custom_code(self) -> str | None:
        return """
const custom_function = (msg) => {console.log(msg)}
"""

    def _get_imports(self):
        return rx.utils.imports.merge_imports(
            super()._get_imports(),
            {
                "react": {rx.utils.imports.ImportVar(tag="useEffect")},
            },
        )

    def _get_hooks(self) -> str | None:
        return """
useEffect(() => {
    custom_function("Hello, custom useEffect!");
}, [])
"""


def trigger_custom_function(msg):
    """Trigger the custom function."""
    return rx.Var.create(
        f"""() => custom_function("{msg}")""",
        _var_is_local=False,
        _var_is_string=False,
    ).to(rx.EventChain)


def index() -> rx.Component:
    return rx.center(
        Custom.create(),
        rx.button("Trigger Custom Function", on_click=trigger_custom_function("Hello, World!")),
        rx.box("Hello, Box", on_mount=trigger_custom_function("Hello, Box!")),
    )


app = rx.App()
app.add_page(index)

Expected behavior
I expect to see "Hello, custom useEffect!" and "Hello, Box!" printed to the browser console when the page loads (twice in dev mode).

Only the "Hello, custom useEffect!" shows up because the code generated for the on_mount looks like:

useEffect(() => {
    (() => {{() => custom_function("Hello, Box!")}})()
    return () => {
        
    }
}, []);

Maybe on_mount just can't handle the event chain being defined function? Event though this works just fine for normal event triggers like on_click, which produce the following code:

export function Button_95f3aab6c7331358232ec1df6d69b7ed() {
  const [addEvents, connectError] = useContext(EventLoopContext);

  const on_click_435a5d9ce8d8c70b098b0125a7486eb2 = useCallback(
    () => custom_function("Hello, World!"),
    [addEvents, Event],
  );

  return (
    <RadixThemesButton onClick={on_click_435a5d9ce8d8c70b098b0125a7486eb2}>
      {`Trigger Custom Function`}
    </RadixThemesButton>
  );
}

Specifics (please complete the following information):

• Python Version: 3.11
• Reflex Version: 0.4.0
• OS: macOS
• Browser (Optional):

Additional context
Need to reconcile the difference between how event chains are handled with memoized and non-memoized contexts. Specifically the user shouldn't have to treat their EventChain Var differently based on where it will be used, and it should work in both contexts seamlessly.

_REF-1999