I am developing a website using nextJs. While implementing GTM and Google analytics, I ran into a problem where GA4 is not reading user_id property from Google tags manager..
My code is pushing the event and firing the tag:

The Tag is reading correct value.

and here are the following datalayer variables.

When I check the GA4 debug view, I cannot see the user_id being set. The User Properties tab stays empty and nothing is coming in that fills it up..
I have tried using first party cookies to set user_id which actually worked, but the issue I faced then is when logging the user out and clearing said cookies, GA4 still managed to keep the user_id saved and not clear it from future events.
Can someone point me in the right direction please?