jennie/ghostguild-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(join): move flow overlay outside v-if so it survives auth flip

Browse source 
After createSubscription() calls checkMemberStatus(), isAuthenticated
flips to true and the <template v-else> branch unmounts, taking the
Teleport (and its overlay) with it. The authenticated 'You're already a
member' UI then showed for the 3-second pre-redirect delay, producing a
visible flash before navigateTo('/welcome') fired.

Teleport now lives at the root div alongside the v-if/v-else branches,
so the overlay stays mounted through the auth state transition and
covers the page continuously until the redirect.
This commit is contained in:
Jennie Robinson Faber 2026-04-19 12:53:50 +01:00
parent faa5bcbb3c
commit 968a127f96
1 changed files with 82 additions and 79 deletions
Download patch file Download diff file Expand all files Collapse all files

7
app/pages/join.vue
View file

@ -318,7 +318,11 @@
</div> </div>
</div> </div>
<!-- Flow overlay: covers the page from form submit through redirect --> </template>
<!-- Flow overlay: covers the page from form submit through redirect.
Lives outside v-if/v-else so it survives the auth state flip that
fires after checkMemberStatus() at the end of createSubscription. -->
<Teleport to="body"> <Teleport to="body">
<div v-if="flowState !== 'idle'" class="join-flow-overlay"> <div v-if="flowState !== 'idle'" class="join-flow-overlay">
<div class="join-flow-card"> <div class="join-flow-card">
@ -397,7 +401,6 @@
</div> </div>
</div> </div>
</Teleport> </Teleport>
</template>
</div> </div>
</template> </template>