feat: format addresses to common format across app (#113)

* feat: format addresses to common format across app

Ethereum checksummed addresses and Starknet padded addresses will
be used across app.

* fix: format addresses when using Stamp

Stamp doesn't normalize addresses itself so we have to make sure we are passing
normalized IDs.

* fix: handle address format when querying starknet names

* fix: make getNames inputs/outputs stable

Now output object will use the same addresses as passed in inptus.
This means you can pass non-formatted address and then read that same
address from output.

* fix: format voter address

apps/api/src/writer.ts

@@ -1,4 +1,5 @@
 import { validateAndParseAddress } from 'starknet';
+import { getAddress } from '@ethersproject/address';
 import { CheckpointWriter } from '@snapshot-labs/checkpoint';
 import { Space, Vote, User, Proposal } from '../.checkpoint/models';
 import { handleProposalMetadata, handleSpaceMetadata } from './ipfs';
@@ -476,11 +477,17 @@ export const handleVote: CheckpointWriter = async ({ block, tx, rawEvent, event
 
   const spaceId = validateAndParseAddress(rawEvent.from_address);
   const proposalId = parseInt(event.proposal_id);
-  const voter = findVariant(event.voter).value;
+  const voterVariant = findVariant(event.voter);
   const choice = getVoteValue(findVariant(event.choice).key);
   const vp = BigInt(event.voting_power);
 
   const created = block?.timestamp ?? getCurrentTimestamp();
+  const voter =
+    voterVariant.key === 'Starknet'
+      ? validateAndParseAddress(voterVariant.value)
+      : voterVariant.key === 'Ethereum'
+        ? getAddress(voterVariant.value)
+        : voterVariant.value;
 
   const vote = new Vote(`${spaceId}/${proposalId}/${voter}`);
   vote.space = spaceId;

apps/ui/src/helpers/stamp.ts

@@ -1,17 +1,22 @@
+import { formatAddress } from './utils';
+
 export async function getNames(addresses: string[]): Promise<Record<string, string>> {
   try {
+    const inputMapping = Object.fromEntries(
+      addresses.map(address => [address, formatAddress(address)])
+    );
+
     const res = await fetch('https://stamp.fyi', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json'
       },
-      body: JSON.stringify({ method: 'lookup_addresses', params: addresses })
+      body: JSON.stringify({ method: 'lookup_addresses', params: Object.values(inputMapping) })
     });
     const data = (await res.json()).result;
 
-    const dataToLc = Object.fromEntries(Object.entries(data).map(([k, v]) => [k.toLowerCase(), v]));
-    const entries: any = addresses
-      .map(address => [address, dataToLc[address.toLowerCase()] || null])
+    const entries: any = Object.entries(inputMapping)
+      .map(([address, formatted]) => [address, data[formatted] || null])
       .filter(([, name]) => name);
 
     return Object.fromEntries(entries);

apps/ui/src/helpers/utils.ts

@@ -4,6 +4,7 @@ import updateLocale from 'dayjs/plugin/updateLocale';
 import duration from 'dayjs/plugin/duration';
 import sha3 from 'js-sha3';
 import { sanitizeUrl as baseSanitizeUrl } from '@braintree/sanitize-url';
+import { getAddress } from '@ethersproject/address';
 import { validateAndParseAddress } from 'starknet';
 import networks from '@/helpers/networks.json';
 import pkg from '@/../package.json';
@@ -80,7 +81,9 @@ export function sanitizeUrl(url: string): string | null {
 }
 
 export function shortenAddress(str = '') {
-  return `${str.slice(0, 6)}...${str.slice(str.length - 4)}`;
+  const formatted = formatAddress(str);
+
+  return `${formatted.slice(0, 6)}...${formatted.slice(formatted.length - 4)}`;
 }
 
 export function shorten(str: string, key?: number | 'symbol' | 'name' | 'choice'): string {
@@ -94,6 +97,15 @@ export function shorten(str: string, key?: number | 'symbol' | 'name' | 'choice'
   return shortenAddress(str);
 }
 
+export function formatAddress(address: string) {
+  if (address.length === 42) return getAddress(address);
+  try {
+    return validateAndParseAddress(address);
+  } catch {
+    return address;
+  }
+}
+
 export function explorerUrl(network, str: string, type = 'address'): string {
   if (network === 'starknet') type = 'contract';
   return `${networks[network].explorer}/${type}/${str}`;
@@ -363,7 +375,11 @@ export function getStampUrl(
 
   const cacheParam = hash ? `&cb=${hash}` : '';
 
-  return `https://cdn.stamp.fyi/${type}/${id}${sizeParam}${cacheParam}`;
+  const formattedId = ['avatar', 'space-sx', 'space-cover-sx'].includes(type)
+    ? formatAddress(id)
+    : id;
+
+  return `https://cdn.stamp.fyi/${type}/${formattedId}${sizeParam}${cacheParam}`;
 }
 
 export async function imageUpload(file: File) {