I built a custom NavBar as a component because I wanted to add badges (unread message notifications, shopping cart items, etc.). I'm having an issue where the badge counter only updates AFTER i click somewhere on the page and I'm thinking I may be in a potential race situation.
Right now i have a "on page load" action to query supabase and return a list of messages where unread = true with a returned action output of "messageCount". I then set a "component parameter" as an integer on the navbar component and pass the messageCount action output to the navbar component and the badge displays the count if items in the returned list.
All of that works and the badges are displayed properly EXCEPT that i have to click somewhere on the page for the navbar to update itself and show the appropriate badge. When i navigate to a new page in the app, the badge disappears and then i have to click on the page again and the badge correctly appears.
Any thoughts on what I can do differently to make this work correctly where the badges get passed to the navbar and updated when the page loads and NOT after some sort of page click?