fix: wait for auth before showing profile invite section

The invite empty state briefly flashed on page load because the auth
session (server: false) hadn't resolved yet, making the "not own profile"
check pass incorrectly.

Closes #1781

Author: serhalp

app/pages/profile/[identity]/index.vue

@@ -23,7 +23,7 @@ if (!profile.value || profileError.value?.statusCode === 404) {
   })
 }
 
-const { user } = useAtproto()
+const { user, pending: userPending } = useAtproto()
 const isEditing = ref(false)
 const displayNameInput = ref()
 const descriptionInput = ref()
@@ -84,6 +84,7 @@ const showInviteSection = computed(() => {
     profile.value.recordExists === false &&
     status.value === 'success' &&
     !likes.value?.records?.length &&
+    !userPending.value &&
     user.value?.handle !== profile.value.handle
   )
 })

test/nuxt/components/ProfileInviteSection.spec.ts

@@ -0,0 +1,84 @@
+import { mockNuxtImport, mountSuspended, registerEndpoint } from '@nuxt/test-utils/runtime'
+import { describe, expect, it, vi, beforeEach } from 'vitest'
+
+const { mockUseAtproto, mockUseProfileLikes } = vi.hoisted(() => ({
+  mockUseAtproto: vi.fn(),
+  mockUseProfileLikes: vi.fn(),
+}))
+
+mockNuxtImport('useAtproto', () => mockUseAtproto)
+mockNuxtImport('useProfileLikes', () => mockUseProfileLikes)
+
+import ProfilePage from '~/pages/profile/[identity]/index.vue'
+
+registerEndpoint('/api/social/profile/test-handle', () => ({
+  displayName: 'Test User',
+  description: '',
+  website: '',
+  handle: 'test-handle',
+  recordExists: false,
+}))
+
+describe('Profile invite section', () => {
+  beforeEach(() => {
+    mockUseAtproto.mockReset()
+    mockUseProfileLikes.mockReset()
+  })
+
+  it('does not show invite section while auth is still loading', async () => {
+    mockUseAtproto.mockReturnValue({
+      user: ref(null),
+      pending: ref(true),
+      logout: vi.fn(),
+    })
+
+    mockUseProfileLikes.mockReturnValue({
+      data: ref({ records: [] }),
+      status: ref('success'),
+    })
+
+    const wrapper = await mountSuspended(ProfilePage, {
+      route: '/profile/test-handle',
+    })
+
+    expect(wrapper.text()).not.toContain("It doesn't look like they're using npmx yet")
+  })
+
+  it('shows invite section after auth resolves for non-owner', async () => {
+    mockUseAtproto.mockReturnValue({
+      user: ref({ handle: 'other-user' }),
+      pending: ref(false),
+      logout: vi.fn(),
+    })
+
+    mockUseProfileLikes.mockReturnValue({
+      data: ref({ records: [] }),
+      status: ref('success'),
+    })
+
+    const wrapper = await mountSuspended(ProfilePage, {
+      route: '/profile/test-handle',
+    })
+
+    expect(wrapper.text()).toContain("It doesn't look like they're using npmx yet")
+  })
+
+  it('does not show invite section for profile owner', async () => {
+    mockUseAtproto.mockReturnValue({
+      user: ref({ handle: 'test-handle' }),
+      pending: ref(false),
+      logout: vi.fn(),
+    })
+
+    mockUseProfileLikes.mockReturnValue({
+      data: ref({ records: [] }),
+      status: ref('success'),
+    })
+
+    const wrapper = await mountSuspended(ProfilePage, {
+      route: '/profile/test-handle',
+    })
+
+    expect(wrapper.text()).not.toContain("It doesn't look like they're using npmx yet")
+  })
+})