Convert hex address to clusters name

Before you begin, install & setup the cluster imports at the top of your code.

Install the SDK

npm install @clustersxyz/sdk viem

Setup your imports

import { Clusters } from "@clustersxyz/sdk";
const clusters = new Clusters();

A single address

This single address call is great for getting the name of a user's connected wallet or the name of an address on a profile page.

// This will return "clusters/main"
const clusterWalletName = await clusters.getName('0x5755d1dcea21caa687339c305d143e6e78f96adf');

// This will give you "clusters"
const clusterName = clusterWalletName.split("/")[0]; 

  1. Profile Information

You can use the following helper functions to help display the info you need. We offer 2 functions:

  • A synchronous function to get the profile image url of a cluster name

  • A function to navigate the user to their official clusters profile page on clusters.xyz

You can use the following helper functions to help display the info you need

import { getImageUrl, getProfileUrl } from "@clustersxyz/sdk";

// https://cdn.clusters.xyz/profile/clusters
const profileImage = getImageUrl(clusterName);

// https://clusters.xyz/clusters
const profileUrl = getProfileUrl(clusterName);

Clusters are a multi-wallet username. Sometimes you will want to display the other wallets a cluster has. By passing in the cluster name, you'll be able to retrieve an array of wallets along with their type.

When people create a cluster, they can add multiple addresses to it. If you want to be able to display this information, you can call the following function.

const cluster = await clusters.getCluster('clusters/');

/*
{
  "name": "clusters/",
  "imageUrl": "https://cdn.clusters.xyz/profile/clusters",
  "profileUrl": "https://clusters.xyz/clusters",
  "wallets": [
    {
      "type": "evm",
      "address": "0x5755d1dcea21caa687339c305d143e6e78f96adf",
      "name": "clusters/main",
      "isVerified": true
    }
  ]
}
*/


Multiple addresses in one call

This is useful if you have 2 or more addresses on a page that you want to retrieve a cluster name for. You can get all the information you need in one call.

  1. Resolve multiple names

import { Clusters } from "@clustersxyz/sdk";
const clusters = new Clusters();

const clusterName = await clusters.getNames([
    '0x5755d1dcea21caa687339c305d143e6e78f96adf', 
    '0xccdead94e8cf17de32044d9701c4f5668ad0bef9'
]);

/*
[
  {
    "address": "0x5755d1dcea21caa687339c305d143e6e78f96adf",
    "name": "clusters/main"
  },
  {
    "address": "0xccdead94e8cf17de32044d9701c4f5668ad0bef9",
    "name": "layerzero/main"
  }
]
*/

Last updated