Best way to send data to persistent components like layouts and navbars?

I'm making an e-commerce store type website with react and inertia, and what I'm struggling with is sending data to actual components, like a layout or a navbar that wrap around {children} when rendering pages. Right now the way I have it setup is that I've made an API endpoint in my laravel backend and then I'm fetching the necessairy data - in my case categories and subcategories names and ids, using axios and then I populate the navbar. Issue with this is that the navbar does not appear straight away since it takes time to fetch the categories from the API and also it just doesn't feel right to me. Is there a better way to simply send the data from the backend to the component itself, rather than the page that's being rendered? Because the other option that I know of is sending the data to each page and then prop-drilling it on each page individually to the wrapping layout.