@frak-labs/react-sdk 0.2.1 → 1.0.0-beta.7f085fb7

package/dist/index.js

@@ -1 +1 @@
-import{displayModal as e,getMerchantInformation as t,openSso as n,prepareSso as r,processReferral as i,sendTransaction as a,siweAuthenticate as o,watchWalletStatus as s}from"@frak-labs/core-sdk/actions";import{ClientNotFound as c,FrakRpcError as l,RpcErrorCodes as u}from"@frak-labs/frame-connector";import{useMutation as d,useQuery as f,useQueryClient as p}from"@tanstack/react-query";import{Fragment as m,createContext as h,createElement as g,useCallback as _,useContext as v,useEffect as y,useMemo as b,useState as x}from"react";import{FrakContextManager as S,baseIframeProps as C,createIFrameFrakClient as w}from"@frak-labs/core-sdk";const T=h(void 0);function E(e){let{children:t,config:n}=e;return g(T.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const D=h(void 0);function O({style:e,children:t}){let n=I(),[r,i]=x(void 0);return g(m,null,g(`iframe`,{...C,src:`${n.walletUrl}/listener`,style:e??C.style,ref:e=>{!e||r||i(w({iframe:e,config:n}))}}),g(D.Provider,{value:r},t))}function k(){return v(D)}function A(){let e=p(),t=k(),n=_(t=>{e.setQueryData([`frak-sdk`,`wallet-status-listener`],t)},[e]);return f({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!t)throw new c;return s(t,n)},enabled:!!t})}function j(){let[e,t]=x(!1);return y(()=>{t(!0)},[]),e}function M(){let e=j(),[t,n]=x(e?window.location:void 0);return y(()=>{if(!e)return;function r(){n(window.location)}return t||r(),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`popstate`,r)}},[e,t]),{location:t,href:b(()=>t?.href,[t?.href])}}function N(){let{location:e}=M();return{frakContext:b(()=>e?.href?S.parse({url:e.href}):null,[e?.href]),updateContext:_(t=>{console.log(`Updating context`,{newContext:t}),S.replaceUrl({url:e?.href,context:t})},[e?.href])}}function P({options:e}={}){let t=k(),{frakContext:n}=N(),{data:r}=A(),{data:a,error:o,status:s}=f({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`auto-referral-interaction`,n?.r??`no-referrer`,r?.key??`no-wallet-status`],queryFn:()=>{if(!t)throw new c;return i(t,{walletStatus:r,frakContext:n,options:e})},enabled:!!r});return b(()=>s===`pending`?`processing`:s===`error`?o:a||`idle`,[a,s,o])}function F({mutations:t}={}){let n=k();return d({...t,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async t=>{if(!n)throw new c;return e(n,t)}})}function I(){let e=v(T);if(!e)throw new l(u.configError,`Frak config not found`);return e}function L({query:e}={}){let n=k();return f({...e,queryKey:[`frak-sdk`,`get-merchant-information`],queryFn:async()=>{if(!n)throw new c;return t(n)}})}function R({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async e=>{if(!t)throw new c;return n(t,e)}})}function z(e){let t=k();return f({queryKey:[`frak-sdk`,`prepare-sso`,e],queryFn:async()=>{if(!t)throw new c;return r(t,e)}})}function B({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async e=>{if(!t)throw new c;return a(t,e)}})}function V({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`siwe-authenticate`,t?.config.domain??`no-domain`],mutationFn:async e=>{if(!t)throw new c;return o(t,e)}})}export{T as FrakConfigContext,E as FrakConfigProvider,D as FrakIFrameClientContext,O as FrakIFrameClientProvider,F as useDisplayModal,k as useFrakClient,I as useFrakConfig,L as useGetMerchantInformation,R as useOpenSso,z as usePrepareSso,P as useReferralInteraction,B as useSendTransactionAction,V as useSiweAuthenticate,A as useWalletStatus};
+import{displayModal as e,displaySharingPage as t,getMerchantInformation as n,getMergeToken as r,getUserReferralStatus as i,openSso as a,prepareSso as o,referralInteraction as s,sendTransaction as c,setupReferral as l,siweAuthenticate as u,watchWalletStatus as d}from"@frak-labs/core-sdk/actions";import{ClientNotFound as f,FrakRpcError as p,RpcErrorCodes as m}from"@frak-labs/frame-connector";import{useMutation as h,useQuery as g,useQueryClient as _}from"@tanstack/react-query";import{Fragment as v,createContext as y,createElement as b,useCallback as x,useContext as S,useMemo as C,useState as w}from"react";import{baseIframeProps as T,createIFrameFrakClient as E}from"@frak-labs/core-sdk";const D=y(void 0);function O(e){let{children:t,config:n}=e;return b(D.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const k=y(void 0);function A({style:e,children:t}){let n=F(),[r,i]=w(void 0);return b(v,null,b(`iframe`,{...T,src:`${n.walletUrl}/listener`,style:e??T.style,ref:e=>{!e||r||i(E({iframe:e,config:n}))}}),b(k.Provider,{value:r},t))}function j(){return S(k)}function M({options:e}={}){let t=j(),{data:n,error:r,status:i}=g({queryKey:[`frak-sdk`,`auto-referral-interaction`],queryFn:async()=>{if(!t)throw new f;return s(t,{options:e})},enabled:!!t,staleTime:1/0});return C(()=>i===`pending`?`processing`:i===`error`?r:n||`idle`,[n,i,r])}function N({mutations:t}={}){let n=j();return h({...t,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async({placement:t,...r})=>{if(!n)throw new f;return e(n,r,t)}})}function P({mutations:e}={}){let n=j();return h({...e,mutationKey:[`frak-sdk`,`display-sharing-page`],mutationFn:async({placement:e,...r})=>{if(!n)throw new f;return t(n,r,e)}})}function F(){let e=S(D);if(!e)throw new p(m.configError,`Frak config not found`);return e}function I({query:e,cacheTime:t}={}){let r=j();return g({...e,queryKey:[`frak-sdk`,`get-merchant-information`],queryFn:async()=>{if(!r)throw new f;return n(r,{cacheTime:t})}})}function L({query:e,cacheTime:t}={}){let n=j();return g({...e,queryKey:[`frak-sdk`,`get-merge-token`],queryFn:async()=>{if(!n)throw new f;return r(n,{cacheTime:t})}})}function R({query:e,cacheTime:t}={}){let n=j();return g({...e,queryKey:[`frak-sdk`,`get-user-referral-status`],queryFn:async()=>{if(!n)throw new f;return i(n,{cacheTime:t})}})}function z({mutations:e}={}){let t=j();return h({...e,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async e=>{if(!t)throw new f;return a(t,e)}})}function B(e){let t=j();return g({queryKey:[`frak-sdk`,`prepare-sso`,e],queryFn:async()=>{if(!t)throw new f;return o(t,e)}})}function V({mutations:e}={}){let t=j();return h({...e,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async e=>{if(!t)throw new f;return c(t,e)}})}function H(){let e=j();return g({queryKey:[`frak-sdk`,`setup-referral`],queryFn:async()=>{if(!e)throw new f;return await l(e),null},enabled:!!e,staleTime:1/0})}function U({mutations:e}={}){let t=j();return h({...e,mutationKey:[`frak-sdk`,`siwe-authenticate`,t?.config.domain??`no-domain`],mutationFn:async e=>{if(!t)throw new f;return u(t,e)}})}function W(){let e=_(),t=j(),n=x(t=>{e.setQueryData([`frak-sdk`,`wallet-status-listener`],t)},[e]);return g({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!t)throw new f;return d(t,n)},enabled:!!t})}export{D as FrakConfigContext,O as FrakConfigProvider,k as FrakIFrameClientContext,A as FrakIFrameClientProvider,N as useDisplayModal,P as useDisplaySharingPage,j as useFrakClient,F as useFrakConfig,I as useGetMerchantInformation,L as useGetMergeToken,R as useGetUserReferralStatus,z as useOpenSso,B as usePrepareSso,M as useReferralInteraction,V as useSendTransactionAction,H as useSetupReferral,U as useSiweAuthenticate,W as useWalletStatus};

package/package.json

@@ -11,7 +11,7 @@
       "url": "https://twitter.com/QNivelais"
     }
   ],
-  "version": "0.2.1",
+  "version": "1.0.0-beta.7f085fb7",
   "description": "React SDK of the Frak wallet, low level library to interact directly with the frak ecosystem.",
   "repository": {
     "url": "https://github.com/frak-id/wallet",
@@ -67,8 +67,8 @@
     "publish": "echo 'Publishing react...'"
   },
   "dependencies": {
-    "@frak-labs/frame-connector": "0.2.0",
-    "@frak-labs/core-sdk": "0.2.1"
+    "@frak-labs/core-sdk": "1.0.0-beta.7f085fb7",
+    "@frak-labs/frame-connector": "0.2.0-beta.7f085fb7"
   },
   "peerDependencies": {
     "viem": "^2.x",
@@ -77,24 +77,23 @@
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.2",
-    "@frak-labs/dev-tooling": "0.0.0",
     "@frak-labs/test-foundation": "0.1.0",
-    "@frak-labs/wallet-shared": "0.0.3",
+    "@frak-labs/wallet-shared": "0.0.4",
     "@tanstack/react-query": "^5.90.20",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^14.6.1",
-    "@types/jsdom": "^27.0.0",
-    "@types/node": "^24.10.13",
+    "@types/jsdom": "^28.0.0",
+    "@types/node": "^25.6.0",
     "@types/react": "19.2.13",
-    "@vitest/coverage-v8": "^4.0.18",
-    "@vitest/ui": "^4.0.18",
-    "jsdom": "^28.0.0",
+    "@vitest/coverage-v8": "^4.1.0",
+    "@vitest/ui": "^4.1.0",
+    "jsdom": "^29.0.0",
     "react": "^19.2.4",
-    "tsdown": "^0.20.3",
-    "typescript": "^5",
-    "viem": "^2.39.0",
-    "vitest": "^4.0.18"
+    "tsdown": "^0.21.8",
+    "typescript": "^6.0.2",
+    "viem": "^2.47.16",
+    "vitest": "^4.1.4"
   }
 }

package/src/hook/helper/useReferralInteraction.test.ts

@@ -7,40 +7,24 @@ import { vi } from "vitest";
 
 vi.mock("@frak-labs/core-sdk/actions");
 vi.mock("../useFrakClient");
-vi.mock("../useWalletStatus");
-vi.mock("../utils/useFrakContext");
 
-import type { FrakContext, WalletStatusReturnType } from "@frak-labs/core-sdk";
-import { processReferral } from "@frak-labs/core-sdk/actions";
-import { ClientNotFound } from "@frak-labs/frame-connector";
+import { referralInteraction } from "@frak-labs/core-sdk/actions";
 import { renderHook, waitFor } from "@testing-library/react";
 import { describe, expect, test } from "../../../tests/vitest-fixtures";
 import { useFrakClient } from "../useFrakClient";
-import { useWalletStatus } from "../useWalletStatus";
-import { useFrakContext } from "../utils/useFrakContext";
 import { useReferralInteraction } from "./useReferralInteraction";
 
 describe("useReferralInteraction", () => {
-    test("should return processing when wallet status is not available", ({
+    test("should return processing when client is not available", ({
         queryWrapper,
-        mockFrakClient,
     }) => {
-        vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: null,
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: undefined,
-            isSuccess: false,
-            isPending: true,
-        } as ReturnType<typeof useWalletStatus>);
+        vi.mocked(useFrakClient).mockReturnValue(undefined);
 
         const { result } = renderHook(() => useReferralInteraction(), {
             wrapper: queryWrapper.wrapper,
         });
 
-        // Query is disabled when wallet status is not available, status remains pending
+        // Query is disabled when client is not available, status remains pending
         expect(result.current).toBe("processing");
     });
 
@@ -48,40 +32,18 @@ describe("useReferralInteraction", () => {
         queryWrapper,
         mockFrakClient,
     }) => {
-        const mockReferralState = "success";
-
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
-        const mockFrakContext: FrakContext = {
-            r: "0x1234567890123456789012345678901234567890",
-        };
-
         vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: mockFrakContext,
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
-        vi.mocked(processReferral).mockResolvedValue(mockReferralState);
+        vi.mocked(referralInteraction).mockResolvedValue("success");
 
         const { result } = renderHook(() => useReferralInteraction(), {
             wrapper: queryWrapper.wrapper,
         });
 
         await waitFor(() => {
-            expect(result.current).toEqual(mockReferralState);
+            expect(result.current).toEqual("success");
         });
 
-        expect(processReferral).toHaveBeenCalledWith(mockFrakClient, {
-            walletStatus: mockWalletStatus,
-            frakContext: mockFrakContext,
+        expect(referralInteraction).toHaveBeenCalledWith(mockFrakClient, {
             options: undefined,
         });
     });
@@ -90,28 +52,12 @@ describe("useReferralInteraction", () => {
         queryWrapper,
         mockFrakClient,
     }) => {
-        const mockReferralState = "success";
-
         const options = {
             alwaysAppendUrl: true,
         };
 
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
         vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0x7890123456789012345678901234567890123456" },
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
-        vi.mocked(processReferral).mockResolvedValue(mockReferralState);
+        vi.mocked(referralInteraction).mockResolvedValue("success");
 
         const { result } = renderHook(
             () => useReferralInteraction({ options }),
@@ -121,39 +67,22 @@ describe("useReferralInteraction", () => {
         );
 
         await waitFor(() => {
-            expect(result.current).toEqual(mockReferralState);
+            expect(result.current).toEqual("success");
         });
 
-        expect(processReferral).toHaveBeenCalledWith(
-            mockFrakClient,
-            expect.objectContaining({
-                options,
-            })
-        );
+        expect(referralInteraction).toHaveBeenCalledWith(mockFrakClient, {
+            options,
+        });
     });
 
     test("should handle processing state", ({
         queryWrapper,
         mockFrakClient,
     }) => {
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
         vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0x9999999999999999999999999999999999999999" },
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
 
-        // Mock processReferral to never resolve (simulate pending)
-        vi.mocked(processReferral).mockImplementation(
+        // Mock referralInteraction to never resolve (simulate pending)
+        vi.mocked(referralInteraction).mockImplementation(
             () => new Promise(() => {})
         );
 
@@ -167,22 +96,8 @@ describe("useReferralInteraction", () => {
     test("should handle errors", async ({ queryWrapper, mockFrakClient }) => {
         const error = new Error("Referral processing failed");
 
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
         vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee" },
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
-        vi.mocked(processReferral).mockRejectedValue(error);
+        vi.mocked(referralInteraction).mockRejectedValue(error);
 
         const { result } = renderHook(() => useReferralInteraction(), {
             wrapper: queryWrapper.wrapper,
@@ -193,117 +108,33 @@ describe("useReferralInteraction", () => {
         });
     });
 
-    test("should throw ClientNotFound when client is not available", async ({
+    test("should throw ClientNotFound when client is not available but enabled", async ({
         queryWrapper,
     }) => {
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
+        // Force the query to run despite no client (edge case)
         vi.mocked(useFrakClient).mockReturnValue(undefined);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0xcccccccccccccccccccccccccccccccccccccccc" },
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
 
         const { result } = renderHook(() => useReferralInteraction(), {
             wrapper: queryWrapper.wrapper,
         });
 
-        await waitFor(() => {
-            expect(result.current).toBeInstanceOf(ClientNotFound);
-        });
-    });
-
-    test("should update query key when referrer changes", async ({
-        queryWrapper,
-        mockFrakClient,
-    }) => {
-        const mockReferralState = "success";
-
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
-        vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
-        vi.mocked(processReferral).mockResolvedValue(mockReferralState);
-
-        // Start with one referrer
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0x1111111111111111111111111111111111111111" },
-            updateContext: vi.fn(),
-        });
-
-        const { rerender } = renderHook(() => useReferralInteraction(), {
-            wrapper: queryWrapper.wrapper,
-        });
-
-        await waitFor(() => {
-            expect(processReferral).toHaveBeenCalledTimes(1);
-        });
-
-        // Change referrer
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: { r: "0x2222222222222222222222222222222222222222" },
-            updateContext: vi.fn(),
-        });
-
-        rerender();
-
-        // Query should re-run with new referrer
-        await waitFor(() => {
-            expect(processReferral).toHaveBeenCalledTimes(2);
-        });
+        // Query is disabled when client is null, so it stays pending
+        expect(result.current).toBe("processing");
     });
 
-    test("should handle no referrer in context", async ({
+    test("should return idle for no-referrer state", async ({
         queryWrapper,
         mockFrakClient,
     }) => {
-        const mockReferralState = "success";
-
-        const mockWalletStatus: WalletStatusReturnType = {
-            key: "connected",
-            wallet: "0x1234567890123456789012345678901234567890",
-        };
-
         vi.mocked(useFrakClient).mockReturnValue(mockFrakClient);
-        vi.mocked(useFrakContext).mockReturnValue({
-            frakContext: null, // No referrer
-            updateContext: vi.fn(),
-        });
-        vi.mocked(useWalletStatus).mockReturnValue({
-            data: mockWalletStatus,
-            isSuccess: true,
-            isPending: false,
-        } as ReturnType<typeof useWalletStatus>);
-        vi.mocked(processReferral).mockResolvedValue(mockReferralState);
+        vi.mocked(referralInteraction).mockResolvedValue(undefined);
 
         const { result } = renderHook(() => useReferralInteraction(), {
             wrapper: queryWrapper.wrapper,
         });
 
         await waitFor(() => {
-            expect(result.current).toEqual(mockReferralState);
+            expect(result.current).toEqual("idle");
         });
-
-        expect(processReferral).toHaveBeenCalledWith(
-            mockFrakClient,
-            expect.objectContaining({
-                frakContext: null,
-            })
-        );
     });
 });

package/src/hook/helper/useReferralInteraction.ts

@@ -1,17 +1,17 @@
 import {
     type ProcessReferralOptions,
-    processReferral,
+    referralInteraction,
 } 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
  *
+ * Runs once when the Frak client becomes available.
+ *
  * @group hooks
  *
  * @param args
@@ -21,48 +21,30 @@ import { useFrakContext } from "../utils/useFrakContext";
  *
  * @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
+ * @see {@link @frak-labs/core-sdk!actions.referralInteraction | `referralInteraction()`} 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: () => {
+        queryKey: ["frak-sdk", "auto-referral-interaction"],
+        queryFn: async () => {
             if (!client) {
                 throw new ClientNotFound();
             }
 
-            return processReferral(client, {
-                walletStatus,
-                frakContext,
-                options,
-            });
+            return referralInteraction(client, { options });
         },
-        enabled: !!walletStatus,
+        enabled: !!client,
+        staleTime: Number.POSITIVE_INFINITY,
     });
 
     return useMemo(() => {

package/src/hook/index.ts

@@ -1,10 +1,14 @@
 export { useReferralInteraction } from "./helper/useReferralInteraction";
 export { useDisplayModal } from "./useDisplayModal";
+export { useDisplaySharingPage } from "./useDisplaySharingPage";
 export { useFrakClient } from "./useFrakClient";
 export { useFrakConfig } from "./useFrakConfig";
 export { useGetMerchantInformation } from "./useGetMerchantInformation";
+export { useGetMergeToken } from "./useGetMergeToken";
+export { useGetUserReferralStatus } from "./useGetUserReferralStatus";
 export { useOpenSso } from "./useOpenSso";
 export { usePrepareSso } from "./usePrepareSso";
 export { useSendTransactionAction } from "./useSendTransaction";
+export { useSetupReferral } from "./useSetupReferral";
 export { useSiweAuthenticate } from "./useSiweAuthenticate";
 export { useWalletStatus } from "./useWalletStatus";

package/src/hook/useDisplayModal.ts

@@ -13,7 +13,7 @@ type MutationOptions<T extends ModalStepTypes[]> = Omit<
     UseMutationOptions<
         ModalRpcStepsResultType<T>,
         FrakRpcError,
-        DisplayModalParamsType<T>
+        DisplayModalParamsType<T> & { placement?: string }
     >,
     "mutationFn" | "mutationKey"
 >;
@@ -56,13 +56,15 @@ export function useDisplayModal<T extends ModalStepTypes[] = ModalStepTypes[]>({
     return useMutation({
         ...mutations,
         mutationKey: ["frak-sdk", "display-modal"],
-        mutationFn: async (args: DisplayModalParamsType<T>) => {
+        mutationFn: async ({
+            placement,
+            ...params
+        }: DisplayModalParamsType<T> & { placement?: string }) => {
             if (!client) {
                 throw new ClientNotFound();
             }
 
-            // Ask to display the modal
-            return displayModal(client, args);
+            return displayModal(client, params, placement);
         },
     });
 }

package/src/hook/useDisplaySharingPage.ts

@@ -0,0 +1,64 @@
+import type {
+    DisplaySharingPageParamsType,
+    DisplaySharingPageResultType,
+} from "@frak-labs/core-sdk";
+import { displaySharingPage } from "@frak-labs/core-sdk/actions";
+import { ClientNotFound, type FrakRpcError } from "@frak-labs/frame-connector";
+import { type UseMutationOptions, useMutation } from "@tanstack/react-query";
+import { useFrakClient } from "./useFrakClient";
+
+/** @ignore */
+type MutationOptions = Omit<
+    UseMutationOptions<
+        DisplaySharingPageResultType,
+        FrakRpcError,
+        DisplaySharingPageParamsType & { placement?: string }
+    >,
+    "mutationFn" | "mutationKey"
+>;
+
+/** @inline */
+interface UseDisplaySharingPageParams {
+    /**
+     * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
+     */
+    mutations?: MutationOptions;
+}
+
+/**
+ * Hook that return a mutation helping to display a sharing page to the user
+ *
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.displaySharingPage | `displaySharingPage()`} action
+ *
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
+ *
+ * @group hooks
+ *
+ * @returns
+ * The mutation hook wrapping the `displaySharingPage()` action
+ * The `mutate` and `mutateAsync` argument is of type {@link @frak-labs/core-sdk!index.DisplaySharingPageParamsType | `DisplaySharingPageParamsType`} with optional `placement`
+ * The `data` result is a {@link @frak-labs/core-sdk!index.DisplaySharingPageResultType | `DisplaySharingPageResultType`}
+ *
+ * @see {@link @frak-labs/core-sdk!actions.displaySharingPage | `displaySharingPage()`} for more info about the underlying action
+ * @see {@link @tanstack/react-query!useMutation | `useMutation()`} for more info about the mutation options and response
+ */
+export function useDisplaySharingPage({
+    mutations,
+}: UseDisplaySharingPageParams = {}) {
+    const client = useFrakClient();
+
+    return useMutation({
+        ...mutations,
+        mutationKey: ["frak-sdk", "display-sharing-page"],
+        mutationFn: async ({
+            placement,
+            ...params
+        }: DisplaySharingPageParamsType & { placement?: string }) => {
+            if (!client) {
+                throw new ClientNotFound();
+            }
+
+            return displaySharingPage(client, params, placement);
+        },
+    });
+}

package/src/hook/useGetMerchantInformation.ts

@@ -20,6 +20,10 @@ interface UseGetMerchantInformationParams {
      * Optional query options, see {@link @tanstack/react-query!useQuery | `useQuery()`} for more infos
      */
     query?: QueryOptions;
+    /**
+     * Time in ms to cache the result at the core SDK level. Default: 30_000 (30s). Set to 0 to disable.
+     */
+    cacheTime?: number;
 }
 
 /**
@@ -40,6 +44,7 @@ interface UseGetMerchantInformationParams {
  */
 export function useGetMerchantInformation({
     query,
+    cacheTime,
 }: UseGetMerchantInformationParams = {}) {
     const client = useFrakClient();
 
@@ -50,7 +55,7 @@ export function useGetMerchantInformation({
             if (!client) {
                 throw new ClientNotFound();
             }
-            return getMerchantInformation(client);
+            return getMerchantInformation(client, { cacheTime });
         },
     });
 }

package/src/hook/useGetMergeToken.ts

@@ -0,0 +1,59 @@
+import { getMergeToken } from "@frak-labs/core-sdk/actions";
+import { ClientNotFound, type FrakRpcError } from "@frak-labs/frame-connector";
+import { type UseQueryOptions, useQuery } from "@tanstack/react-query";
+import { useFrakClient } from "./useFrakClient";
+
+/** @ignore */
+type QueryOptions = Omit<
+    UseQueryOptions<string | null, FrakRpcError, string | null>,
+    "queryKey" | "queryFn"
+>;
+
+/** @inline */
+interface UseGetMergeTokenParams {
+    /**
+     * Optional query options, see {@link @tanstack/react-query!useQuery | `useQuery()`} for more infos
+     */
+    query?: QueryOptions;
+    /**
+     * Time in ms to cache the result at the core SDK level. Default: 30_000 (30s). Set to 0 to disable.
+     */
+    cacheTime?: number;
+}
+
+/**
+ * Hook that return a query to fetch a merge token for the current anonymous identity
+ *
+ * Used by in-app browser redirect flows to preserve identity
+ * when switching from a WebView to the system browser.
+ *
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.getMergeToken | `getMergeToken()`} action
+ *
+ * @param args - Optional config object with `query` for customizing the underlying {@link @tanstack/react-query!useQuery | `useQuery()`}
+ *
+ * @group hooks
+ *
+ * @returns
+ * The query hook wrapping the `getMergeToken()` action
+ * The `data` result is a `string | null`
+ *
+ * @see {@link @frak-labs/core-sdk!actions.getMergeToken | `getMergeToken()`} for more info about the underlying action
+ * @see {@link @tanstack/react-query!useQuery | `useQuery()`} for more info about the useQuery options and response
+ */
+export function useGetMergeToken({
+    query,
+    cacheTime,
+}: UseGetMergeTokenParams = {}) {
+    const client = useFrakClient();
+
+    return useQuery({
+        ...query,
+        queryKey: ["frak-sdk", "get-merge-token"],
+        queryFn: async () => {
+            if (!client) {
+                throw new ClientNotFound();
+            }
+            return getMergeToken(client, { cacheTime });
+        },
+    });
+}