API Endpoints

Request Types

// UserUpdateRequest (from user.ts)
interface UserUpdateRequest {
  id?: string;           // User ID (optional, defaults to current)
  displayName?: string;  // Display name
  fullName?: string;     // Full name
  description?: string;  // Bio/description
  email?: string;        // Email address
  website?: string;      // Personal website
  facebook?: string;     // Facebook handle
  instagram?: string;    // Instagram handle
  twitter?: string;      // Twitter handle
  discord?: string;      // Discord handle
  tags?: Array<{ value: string }>;  // User tags
  contentUrl?: string;   // Avatar URL (base64 thumb for preview)
}

Update Profile Data

import { updateUser } from "newgraph-signals/actions/user";
import { execProgressiveHandler } from "newgraph-signals";

// Update profile fields
await execProgressiveHandler(updateUser(), {
  userData: {
    displayName: "New Display Name",
    description: "Updated bio text",
    twitter: "myhandle",
    instagram: "myinsta",
    tags: [{ value: "developer" }, { value: "newcoin" }],
  },
  profilePicture: null, // No avatar change
});

Avatar Upload Flow

// From user.ts updateUser() function
import { newgraphClient, _current } from "newgraph-signals";
import { resizeImage } from "newgraph-signals/utils/resizeImage";

// 1. Prepare avatar (resize and get base64 thumbnail)
const base64thumb = await resizeImage(profilePicture.originFileObj);

// 2. Update user with thumbnail for immediate preview
await newgraphClient.api.user.userUpdate({
  id: _current.value.id,
  contentUrl: base64thumb, // Shows while uploading
});

// 3. Get signed upload URL
const uploadInfo = await newgraphClient.api.user.userUploadAvatarCreate({
  filename: profilePicture.name,
  contentType: profilePicture.type,
  id: userId,
});

// 4. Upload to signed URL
await fetch(uploadInfo.data.url, {
  method: "PUT",
  body: profilePicture.originFileObj,
});

Complete Example

// Full profile update with avatar (from user.ts)
import { updateUser, _current, cacheUsers } from "newgraph-signals/actions/user";
import { newgraphClient } from "newgraph-signals";
import { resizeImage } from "newgraph-signals/utils/resizeImage";

export const updateProfile = async (
  userData: UserUpdateRequest,
  profilePicture?: File
) => {
  const hasAvatar = profilePicture?.originFileObj;
  
  // Generate thumbnail for immediate preview
  const thumbUrl = hasAvatar 
    ? await resizeImage(profilePicture.originFileObj)
    : "";

  // Cache optimistically for instant UI update
  await cacheUsers([{
    ...userData,
    id: _current.value.id,
    contentUrl: thumbUrl || _current.value.contentUrl,
    uploadState: thumbUrl ? {
      thumbUrl,
      oldContentUrl: _current.value.contentUrl,
    } : undefined,
  }], { force: true });

  // Send profile update
  await newgraphClient.api.user.userUpdate({
    ...userData,
    id: _current.value.id,
    contentUrl: thumbUrl,
  });

  // Upload avatar if provided
  if (hasAvatar) {
    const uploadInfo = await newgraphClient.api.user.userUploadAvatarCreate({
      filename: profilePicture.name,
      contentType: profilePicture.type,
      id: _current.value.id,
    });

    await fetch(uploadInfo.data.url, {
      method: "PUT",
      body: profilePicture.originFileObj,
    });
  }

  // Update local state
  _current.value = {
    ..._current.value,
    ...userData,
    contentUrl: thumbUrl || _current.value.contentUrl,
  };
};

Edge Cases

🧪 Quick Test

Related Skills