fix: credits loading skeleton in user popover (#7347)

Show skeleton loader while credits are being fetched instead of briefly
displaying '0 credits'.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7347-Fix-credits-loading-skeleton-in-user-popover-2c66d73d36508103ae65d82e9bceb97d)
by [Unito](https://www.unito.io)

src/components/topbar/CurrentUserPopover.vue

@@ -26,7 +26,13 @@
     <!-- Credits Section -->
     <div v-if="isActiveSubscription" class="flex items-center gap-2 px-4 py-2">
       <i class="icon-[lucide--component] text-amber-400 text-sm" />
-      <span class="text-base font-normal text-base-foreground flex-1">{{
+      <Skeleton
+        v-if="authStore.isFetchingBalance"
+        width="4rem"
+        height="1.25rem"
+        class="flex-1"
+      />
+      <span v-else class="text-base font-normal text-base-foreground flex-1">{{
         formattedBalance
       }}</span>
       <Button
@@ -122,6 +128,7 @@
 <script setup lang="ts">
 import Button from 'primevue/button'
 import Divider from 'primevue/divider'
+import Skeleton from 'primevue/skeleton'
 import { computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'