Help: How to use App.vue and wait for store to be ready through the app

[nosizejosh]

Environment

• Operating System: Windows_NT
• Node Version: v16.17.1
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: yarn@1.22.19
• Builder: vite
• User Config: runtimeConfig, postcss, css, modules
• Runtime Modules: @formkit/nuxt@1.0.0-beta.9-f64c966, @vueuse/nuxt@9.6.0, @pinia/nuxt@0.4.5, @nuxtjs/supabase@0.3.0, @nuxtjs/tailwindcss@6.1.3
• Build Modules: -

Reproduction

![image](https://user-i

mages.githubusercontent.com/392227/204125472-48a9e7d2-8c8e-43d6-a2ae-1ded2e9ed844.png)

Describe the bug

Hello All, and @danielroe @aldarund from reading your guides and documentation, app.vue is the entry point of the nuxt 3 app and so if I stored some profile information in a store and loaded it in app.vue, then it should be readily accessible from other pages right? I am facing a race condition where some pages are loaded before app.vue or their call to this store variable happens before app.vue and so their value is null at that point.

1. How do I makes sure this variable which is from an external server is ready for all pages and not just app.vue
2. If app.vue is the entry point, why do some pages run before it, leading to the variable being null at that point?

this is how my app.vue looks like

and a console log

that shows clearly store variable userWithProfile is called in ticketTable where it returns null before the console.log in app.vue where it is properly set and returns a value.

3. How can I ensure the variables in app are properly set before the rest of the app runs as they are required for proper function of the app?

Please help

Additional context

Noticed that if another route is visited and then returned to this tickets page, then the userWithProfile is now properly set on the page, but it was set from the start on app.vue.