Why does the application freeze when using this component?

Question

JavaScript

Goodnight. Can you please tell me what can cause the application to hang in this code? UPDATE

not working :

export default function TopBar() {
    return (
        <Router>

            <SelectNavigation />

        </Router>
    )
}

function SelectNavigation() {

    // if (window.innerWidth > 900) {
    //
         return (
            <nav className='nav-computer'>
                <Navigation items={navigationItems}/>
                <div className="logo">
                    <Link to='/'>
                        <div className="first-child">{logo.firstChild}</div>
                        <div className="last-child">{logo.lastChild}</div>
                    </Link>
                </div>
            </nav>
        )
}

Answer 1

Because you're using arrow functions that don't bubble up, unlike function. If you swap functions or switch arrows to function, it will work.
Read about hoisting in js