/ packages / react-hooks / useRelayEndpoint.ts
useRelayEndpoint.ts
 1  import { getLogger } from "@logtape/logtape";
 2  import { discoverRelay } from "@massmarket/client";
 3  import { useQuery } from "@tanstack/react-query";
 4  import { useMassMarketContext } from "./useMassMarketContext.ts";
 5  import type { MassMarketConfig } from "./MassMarketContext.ts";
 6  
 7  const logger = getLogger(["mass-market", "frontend", "useRelayEndpoint"]);
 8  
 9  /*
10   * This hook is used to get the relay endpoint from the context or discover it.
11   */
12  export function useRelayEndpoint(params?: { config?: MassMarketConfig }) {
13    const config = params?.config ?? useMassMarketContext().config;
14    const q = useQuery(
15      {
16        queryKey: ["relayEndpoint"],
17        queryFn: async () => {
18          if (
19            config.relayEndpoint && config.relayTokenId
20          ) {
21            const re = {
22              url: new URL(config.relayEndpoint),
23              tokenId: config.relayTokenId as `0x${string}`,
24            };
25            logger.debug(
26              `using environment variables for relay endpoint ${re.url}`,
27            );
28            return re;
29          } else {
30            const discovered = await discoverRelay("ws://localhost:4444/v4");
31            if (!discovered.url) throw new Error("Relay endpoint URL not set");
32            if (!discovered.tokenId) {
33              throw new Error("Relay endpoint tokenId not set");
34            }
35            logger.debug(`using testing relay endpoint ${discovered.url}`);
36            return discovered;
37          }
38        },
39      },
40    );
41  
42    return { relayEndpoint: q.data, ...q };
43  }