Integrate a Welcome message in header in functions.php

in my wordpress site https://suonareaorecchio.com I have a login/logout button in the header, created with this code in functions.php

add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2);
    function add_login_logout_link($items, $args) {
    ob_start();
    if ( is_user_logged_in() ) {
    wp_loginout('index.php');
    } else {
    wp_loginout( get_permalink( get_page_by_title( 'La mia pagina' ) ) );
    }
    $loginoutlink = ob_get_contents();
    ob_end_clean();
    $items .= '<li>'. $loginoutlink .'</li>';
return $items;
}
add_filter( 'login_url', 'my_login_page', 10, 2 );
    function my_login_page( $login_url, $redirect ) {
    $url = get_permalink( get_page_by_title( 'Login' ) );
    return $url . '?redirect_to=' . $redirect;
}

That creates correctly this Login/Logout button in the top right header.

I want to integrate a welcome message that says Hi user! (with link to a specific /profile/ page) and a sub menu with the logout link (with home page redirect).

To JUST create the welcome message I found this, but it creates a message in the page, not header.

add_action( 'loop_start', 'personal_message_when_logged_in' );
    function personal_message_when_logged_in() {
    if ( is_user_logged_in() ) : 
    $current_user = wp_get_current_user();
echo 'Ciao ' . $current_user->user_login . '!';
else :
    echo 'Non personalize message (No clue what to put!)';
endif;
}

Basically the result I’d like to recreate would be this:

Do you know how can I integrate the two codes to have something like the second image? If you’re kind may I have the final code to copy and paste since unfortunately I’m a noob?

Thanks so much for helping.