@frak-labs/react-sdk/src/hook/helper/useReferralInteraction.ts

React SDK of the Frak wallet, low level library to interact directly with the frak ecosystem.

import {
    type ProcessReferralOptions,
    processReferral,
} from "@frak-labs/core-sdk/actions";
import { ClientNotFound } from "@frak-labs/frame-connector";
import { useQuery } from "@tanstack/react-query";
import { useMemo } from "react";
import { useFrakClient } from "../useFrakClient";
import { useWalletStatus } from "../useWalletStatus";
import { useFrakContext } from "../utils/useFrakContext";

/**
 * Helper hook to automatically submit a referral interaction when detected
 *
 * @group hooks
 *
 * @param args
 * @param args.options - Some options for the referral interaction
 *
 * @returns  The resulting referral state, or a potential error
 *
 * @description This function will automatically handle the referral interaction process
 *
 * @see {@link @frak-labs/core-sdk!actions.processReferral | `processReferral()`} for more details on the automatic referral handling process
 */
export function useReferralInteraction({
    options,
}: {
    options?: ProcessReferralOptions;
} = {}) {
    // Get the frak client
    const client = useFrakClient();

    // Get the current frak context
    const { frakContext } = useFrakContext();

    // Get the wallet status
    const { data: walletStatus } = useWalletStatus();

    // Setup the query that will transmit the referral interaction
    const {
        data: referralState,
        error,
        status,
    } = useQuery({
        gcTime: 0,
        staleTime: 0,
        queryKey: [
            "frak-sdk",
            "auto-referral-interaction",
            frakContext?.r ?? "no-referrer",
            walletStatus?.key ?? "no-wallet-status",
        ],
        queryFn: () => {
            if (!client) {
                throw new ClientNotFound();
            }

            return processReferral(client, {
                walletStatus,
                frakContext,
                options,
            });
        },
        enabled: !!walletStatus,
    });

    return useMemo(() => {
        if (status === "pending") return "processing";
        if (status === "error") return error;
        return referralState || "idle";
    }, [referralState, status, error]);
}