Dash username element 'object provided as children' error

Dash Python
1

I have a simple Dash navbar which displays username when user is logged in

However, when I click the username, it displays a fleeting error (disappears itself in <1 second, so fast it’s hard to read the error message) an object was provided as children instead of a component, string, or number (or list of those). After displaying the error, when clicking the username again, it redirects correctly to the page.

I have an identical mechanism for the login page callback which works just fine. I can’t understand what’s causing this fleeting error, and why it still navigates to the page on a 2nd try.

What could be going wrong and how do I fix it?

header = dbc.Navbar(
    dbc.Container(
        [
            dbc.Nav(
                [
                    dbc.NavItem(dbc.NavLink('user-name',id='user-name',href='Profile')), #displays the error when clicked
                    dbc.NavItem(dbc.NavLink('login', id='user-action', href='Login')),
                ]
            )
        ],
    ),
)

#broken callback
@app.callback(
    [Output('user-name', 'children'),
     Output('user-name', 'href'),
     ],
    [Input('page-content', 'children')])
def profile_link(content):
    if current_user.is_authenticated:
        return str(current_user.first),'/profile'
    else:
        return '',''

working callback:

@app.callback(
    [Output('user-action', 'children'),
     Output('user-action', 'href'),
     ],
    [Input('page-content', 'children')])
def user_logout(input1):
    if current_user.is_authenticated:
        return 'logout', '/logout'
    else:
        return 'login', '/login'