2.3 The User object

Say hi to your users

Whenever your application needs to show eg. user’s name (a must for a good UX!) or to know the roles the user has, we can do something like this:

import React, { useEffect, useState } from 'react'
import { CustomerDTO, fetchMe } from './vyou/vyou-core'
import { useVYouSession } from './vyou/vyou-react'
import { MyLoadingComponent } from './widget/MyLoadingComponent'

export const HomeScreen = () => {
  const [me, setMe] = useState<CustomerDTO>()
  const [session] = useVYouSession()

  useEffect(() => {
    fetchMe().then(res => {
      if (res.error) {
        return
      }
      setMe(res.data)
    })
  }, [])

  return (
    <div>
      {(me === undefined || !session.signedIn) && <MyLoadingComponent />}
      {me !== undefined && session.signedIn && (
        <>
          <p>Hi, {me.mandatory_fields.name}!</p>
          <p>
            Your user roles are: {session.customerTenantData.tenant_role.join('')}
          </p>
        </>
      )}
    </div>
  )
}
Scroll to Top