fix: defer loading accounts/tags until masto is initialised

pages/[[server]]/@[account]/[status].vue

@@ -13,9 +13,10 @@ const main = ref<ComponentPublicInstance | null>(null)
 let bottomSpace = $ref(0)
 const publishWidget = ref()
 
-const { data: status, pending, refresh: refreshStatus } = useAsyncData(`status:${id}`, async () => (
-  window.history.state?.status as Status | undefined)
-  ?? await fetchStatus(id),
+const { data: status, pending, refresh: refreshStatus } = useAsyncData(
+  `status:${id}`,
+  async () => (window.history.state?.status as Status | undefined) ?? await fetchStatus(id),
+  { watch: [isMastoInitialised], immediate: isMastoInitialised.value },
 )
 const masto = useMasto()
 const { data: context, pending: pendingContext, refresh: refreshContext } = useAsyncData(`context:${id}`, () => masto.statuses.fetchContext(id))

pages/[[server]]/@[account]/index.vue

@@ -8,7 +8,7 @@ const accountName = $(computedEager(() => toShortHandle(params.account as string
 
 const { t } = useI18n()
 
-const { data: account, refresh } = $(await useAsyncData(() => fetchAccountByHandle(accountName).catch(() => null)))
+const { data: account, pending, refresh } = $(await useAsyncData(() => fetchAccountByHandle(accountName).catch(() => null), { watch: [isMastoInitialised], immediate: isMastoInitialised.value }))
 const relationship = $computed(() => account ? useRelationship(account).value : undefined)
 
 onReactivated(() => {
@@ -24,7 +24,8 @@ onReactivated(() => {
       <span text-lg font-bold>{{ account ? getDisplayName(account) : t('nav_side.profile') }}</span>
     </template>
 
-    <template v-if="account">
+    <template v-if="pending" />
+    <template v-else-if="account">
       <AccountMoved v-if="account.moved" :account="account" />
       <AccountHeader :account="account" command border="b base" :class="{ 'op-50 grayscale-50': !!account.moved }" />
 

pages/[[server]]/tags/[tag].vue

@@ -3,7 +3,7 @@ const params = useRoute().params
 const tagName = $(computedEager(() => params.tag as string))
 
 const masto = useMasto()
-const { data: tag, refresh } = $(await useAsyncData(() => masto.tags.fetch(tagName)))
+const { data: tag, refresh } = $(await useAsyncData(() => masto.tags.fetch(tagName), { watch: [isMastoInitialised], immediate: isMastoInitialised.value }))
 
 const paginator = masto.timelines.iterateHashtag(tagName)
 const stream = await masto.stream.streamTagTimeline(tagName)