useRefractProfile()

While standard hooks like useAccount (from wagmi) provide the user’s wallet address, useRefractProfile gives you access to the rich social profile data managed by Refract Network. This is essential for creating personalized experiences and leveraging the social features of your dApp.

This hook returns the profile of the currently connected user, including their unique Refract ID and any linked social media information.

Usage

import { useAccount } from 'wagmi';
import { useRefractProfile } from '@refract-network/securesign-sdk/react'; // ::TODO: confirm package

export function ProfileDisplay() {
  // Standard wagmi hook to get wallet address
  const { address, isConnected } = useAccount();
  
  // Refract hook to get rich social profile
  const { profile, isLoading } = useRefractProfile();

  if (!isConnected) {
    return <p>Please connect your wallet.</p>;
  }

  if (isLoading) {
    return <p>Loading profile...</p>;
  }

  return (
    <div>
      <h2>Wallet Information</h2>
      <p>Address: {address}</p>
      
      {profile && (
        <>
          <h2>Refract Profile</h2>
          <img src={profile.profilePhotoUrl} alt="User avatar" width="80" />
          <p>Display Name: {profile.displayName}</p>
          <p>Refract User ID: {profile.userId}</p>
          {profile.username && <p>Username: @{profile.username}</p>}
          {profile.bio && <p>Bio: {profile.bio}</p>}
        </>
      )}
    </div>
  );
}

Return Value

The hook returns an object with the following properties:

{
  profile: RefractProfile | null;
  isLoading: boolean;
  error: Error | null;
}

RefractProfile Object

The profile object contains the following fields:

FieldTypeDescription
userIdstringThe unique, stable identifier for the user across the Refract Network.
displayNamestringThe user’s display name, typically from their primary social profile.
profilePhotoUrlstringA URL for the user’s avatar.
usernamestringThe user’s handle (e.g., from TikTok or Telegram), if available.
biostringThe user’s bio from their social profile, if available.
linkedSocialsobjectAn object containing platform-specific IDs, like tiktokId or telegramId.
::TODO: Add other relevant fields from the data model.