Dropdown menu doesn't work with fallback avatar

[bertbarabas]

Describe the bug
A dropdown menu with an Avatar as the trigger works only if the Avatar was given a proper image and the fallback was not used. If the fallback is used, the dropdown menu no longer responds to being clicked on.

To Reproduce
Steps to reproduce the behavior:

def extract_initials_from_email(email):
    name = email.split("@")[0]
    initials = "".join(c[0] for c in name.split(".") if c.isalpha())
    return initials[:2].upper()


def account_drop_down() -> rx.Component:
    email = "[email protected]"
    initials = extract_initials_from_email(email)
    g = Gravatar(email)
    img = g.get_image(default="404")
    avatar = rx.avatar(src=img, fallback=initials, radius="full")

    return rx.menu.root(
        rx.menu.trigger(avatar),
        rx.menu.content(
            rx.menu.separator(),
            rx.menu.item("Logout", color="red", on_click=rx.console_log(img)),
        ),
        position="fixed",
        right="1.5em",
        top="1.5em",
    )

Expected behavior
The dropdown should appear regardless if the avatar has an image or if it has the fallback text

Screenshots
Here you can see clicking on the avatar brings up the drop down menu:

And here you can see when clicked on the avatar with the fallback text does not show the drop down menu:

Specifics (please complete the following information):

• Python Version: 3.12.1
• Reflex Version: 0.4.3
• OS: OS: WSL on Windows 11 (Ubuntu 22.04.4 LTS (GNU/Linux 5.15.133.1-microsoft-standard-WSL2 x86_64)
• Browser (Optional):

Additional context
Add any other context about the problem here.

[boterop]

@bertbarabas till it is fixed, you can surround it with flex.

def extract_initials_from_email(email):
    name = email.split("@")[0]
    initials = "".join(c[0] for c in name.split(".") if c.isalpha())
    return initials[:2].upper()


def account_drop_down() -> rx.Component:
    email = "[email protected]"
    initials = extract_initials_from_email(email)
    g = Gravatar(email)
    img = g.get_image(default="404")
    avatar = rx.avatar(src=img, fallback=initials, radius="full")

    return rx.menu.root(
-       rx.menu.trigger(avatar),
+       rx.menu.trigger(rx.flex(avatar)),
        rx.menu.content(
            rx.menu.separator(),
            rx.menu.item("Logout", color="red", on_click=rx.console_log(img)),
        ),
        position="fixed",
        right="1.5em",
        top="1.5em",
    )