Add lookup methods to controller pkg (#1106)

* Add lookup methods to controller pkg

* fix warning

* use workspace

examples/next/.env.development

@@ -2,3 +2,4 @@ NEXT_PUBLIC_RPC_MAINNET="http://localhost:8001/x/starknet/mainnet"
 NEXT_PUBLIC_RPC_SEPOLIA="http://localhost:8001/x/starknet/sepolia"
 NEXT_PUBLIC_KEYCHAIN_FRAME_URL="http://localhost:3001"
 NEXT_PUBLIC_PROFILE_FRAME_URL="http://localhost:3003"
+NEXT_PUBLIC_CARTRIDGE_API_URL="http://localhost:8000"

examples/next/.env.production

@@ -2,4 +2,5 @@ NEXT_PUBLIC_RPC_MAINNET="https://api.cartridge.gg/x/starknet/mainnet"
 NEXT_PUBLIC_RPC_SEPOLIA="https://api.cartridge.gg/x/starknet/sepolia"
 NEXT_PUBLIC_KEYCHAIN_FRAME_URL="https://x.cartridge.gg"
 NEXT_PUBLIC_PROFILE_FRAME_URL="https://profile.cartridge.gg"
+NEXT_PUBLIC_CARTRIDGE_API_URL="https://api.cartridge.gg"
 NEXT_PUBLIC_NAMESPACE="namespace"

examples/next/package.json

@@ -13,8 +13,8 @@
     "format:check": "prettier --check ./src"
   },
   "dependencies": {
-    "@cartridge/connector": "0.5.1",
-    "@cartridge/controller": "0.5.1",
+    "@cartridge/connector": "workspace:^",
+    "@cartridge/controller": "workspace:^",
     "@cartridge/ui-next": "workspace:^",
     "@starknet-react/chains": "^0.1.3",
     "@starknet-react/core": "^3.0.2",

examples/next/src/app/page.tsx

@@ -7,7 +7,7 @@ import { DelegateAccount } from "components/DelegateAccount";
 import { ColorModeToggle } from "components/ColorModeToggle";
 import { Profile } from "components/Profile";
 import { Settings } from "components/Settings";
-import { FetchControllers } from "components/FetchControllers";
+import { LookupControllers } from "components/LookupControllers";
 
 export default function Home() {
   return (
@@ -26,7 +26,7 @@ export default function Home() {
       <DelegateAccount />
       <InvalidTxn />
       <SignMessage />
-      <FetchControllers />
+      <LookupControllers />
     </div>
   );
 }

examples/next/src/components/LookupControllers.tsx

@@ -0,0 +1,59 @@
+"use client";
+
+import { useAccount } from "@starknet-react/core";
+import { useCallback, useState } from "react";
+import ControllerConnector from "@cartridge/connector/controller";
+import { lookupAddresses, lookupUsernames } from "@cartridge/controller";
+import { Button } from "@cartridge/ui-next";
+
+export function LookupControllers() {
+  const { address, connector } = useAccount();
+  const [error, setError] = useState<Error>();
+  const [addressToUsername, setAddressToUsername] =
+    useState<Map<string, string>>();
+  const [usernameToAddress, setUsernameToAddress] =
+    useState<Map<string, string>>();
+  const cartridgeConnector = connector as never as ControllerConnector;
+
+  const onClick = useCallback(async () => {
+    if (!address) return;
+
+    setError(undefined);
+    try {
+      const username = await cartridgeConnector.username()!;
+      const [addressResults, usernameResults] = await Promise.all([
+        lookupAddresses([address]),
+        lookupUsernames([username]),
+      ]);
+
+      setAddressToUsername(addressResults);
+      setUsernameToAddress(usernameResults);
+    } catch (e) {
+      setError(e as Error);
+    }
+  }, [address, cartridgeConnector]);
+
+  if (!address) return null;
+
+  return (
+    <div>
+      <h2>Lookup Controllers</h2>
+      <h3>Address to Username</h3>
+      {addressToUsername &&
+        [...addressToUsername].map(([addr, username]) => (
+          <p key={addr}>
+            {addr}: {username}
+          </p>
+        ))}
+      <h3>Username to Address</h3>
+      {usernameToAddress &&
+        [...usernameToAddress].map(([username, addr]) => (
+          <p key={username}>
+            {username}: {addr}
+          </p>
+        ))}
+      {error && <p className="error">{error.message}</p>}
+      <Button onClick={onClick}>Lookup Controllers</Button>
+    </div>
+  );
+}

packages/controller/src/constants.ts

@@ -1,2 +1,3 @@
 export const KEYCHAIN_URL = "https://x.cartridge.gg";
 export const PROFILE_URL = "https://profile.cartridge.gg";
+export const API_URL = "https://api.cartridge.gg";

packages/controller/src/index.ts

@@ -1,5 +1,7 @@
 export { default } from "./controller";
 export * from "./errors";
 export * from "./types";
+export * from "./lookup";
+
 export { toWasmPolicies, toSessionPolicies, toArray } from "./utils";
 export * from "@cartridge/presets";

packages/controller/src/lookup.ts

@@ -0,0 +1,68 @@
+import { LookupRequest, LookupResponse } from "./types";
+import { num } from "starknet";
+import { API_URL } from "./constants";
+
+const cache = new Map<string, string>();
+
+async function lookup(request: LookupRequest): Promise<LookupResponse> {
+  if (!request.addresses?.length && !request.usernames?.length) {
+    return { results: [] };
+  }
+
+  const response = await fetch(`${API_URL}/lookup`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: JSON.stringify(request),
+  });
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.status}`);
+  }
+
+  return response.json();
+}
+
+export async function lookupUsernames(
+  usernames: string[],
+): Promise<Map<string, string>> {
+  const uncachedUsernames = usernames.filter((name) => !cache.has(name));
+
+  if (uncachedUsernames.length > 0) {
+    const response = await lookup({ usernames: uncachedUsernames });
+
+    response.results.forEach((result) => {
+      cache.set(result.username, result.addresses[0]); // TODO: handle multiple controller addresses
+    });
+  }
+
+  return new Map(
+    usernames
+      .map((name) => [name, cache.get(name)] as [string, string])
+      .filter((entry): entry is [string, string] => entry[1] !== undefined),
+  );
+}
+
+export async function lookupAddresses(
+  addresses: string[],
+): Promise<Map<string, string>> {
+  addresses = addresses.map(num.toHex);
+  const uncachedAddresses = addresses.filter((addr) => !cache.has(addr));
+
+  if (uncachedAddresses.length > 0) {
+    const response = await lookup({
+      addresses: uncachedAddresses,
+    });
+
+    response.results.forEach((result) => {
+      cache.set(result.addresses[0], result.username); // TODO: handle multiple controller addresses
+    });
+  }
+
+  return new Map(
+    addresses
+      .map((addr) => [addr, cache.get(addr)] as [string, string])
+      .filter((entry): entry is [string, string] => entry[1] !== undefined),
+  );
+}

packages/controller/src/types.ts

@@ -78,6 +78,20 @@ export type IFrames = {
   profile?: ProfileIFrame;
 };
 
+export interface LookupRequest {
+  usernames?: string[];
+  addresses?: string[];
+}
+
+export interface LookupResult {
+  username: string;
+  addresses: string[];
+}
+
+export interface LookupResponse {
+  results: LookupResult[];
+}
+
 type ContractAddress = string;
 type CartridgeID = string;
 export type ControllerAccounts = Record<ContractAddress, CartridgeID>;