<ThunderIDUser />

The ThunderIDUser component provides access to the authenticated user object via a scoped slot. It is auto-registered by the Nuxt module.

Usage

Basic Usage

pages/profile.vue

<template>
  <ThunderIDUser>
    <template #default="{ user }">
      <div v-if="user">
        <h1>Welcome, {{ user.displayName }}!</h1>
        <p>{{ user.email }}</p>
      </div>
    </template>
  </ThunderIDUser>
</template>

With a Fallback

Show alternative content when no user is signed in:

pages/profile.vue

<template>
  <ThunderIDUser>
    <template #default="{ user }">
      <h1>{{ user.displayName }}</h1>
    </template>
    <template #fallback>
      <p>Please sign in to view your profile.</p>
    </template>
  </ThunderIDUser>
</template>

Slots

Slot	Slot Props	Description
default	{ user: User | null }	Receives the authenticated user object
fallback	—	Rendered when no user is signed in

User Slot Prop

Property	Type	Description
sub	string	The user's unique subject identifier
displayName	string | null	The user's display name
email	string | null	The user's email address
firstName	string | null	The user's first name
lastName	string | null	The user's last name
profileUrl	string | null	URL to the user's profile picture