diff --git a/.changeset/sour-carrots-lie.md b/.changeset/sour-carrots-lie.md new file mode 100644 index 0000000000..aa7f16ea8d --- /dev/null +++ b/.changeset/sour-carrots-lie.md @@ -0,0 +1,5 @@ +--- +"@coinbase/onchainkit": minor +--- + +feat: Add option to useOpenUrl to handle non-mini-app behavior in a custom way diff --git a/packages/onchainkit/src/minikit/hooks/useOpenUrl.ts b/packages/onchainkit/src/minikit/hooks/useOpenUrl.ts index 009adba8b0..7ecf7b10b0 100644 --- a/packages/onchainkit/src/minikit/hooks/useOpenUrl.ts +++ b/packages/onchainkit/src/minikit/hooks/useOpenUrl.ts @@ -2,12 +2,23 @@ import sdk from '@farcaster/miniapp-sdk'; import { useCallback } from 'react'; import { useMiniKit } from './useMiniKit'; +export type UseOpenUrlParams = { + fallback?: (url: string) => void; +}; + /** - * Opens a new url, if in a frame context, using the openUrl sdk action, otherwise opens in a new tab - * @param url - The URL to open. - * @returns void + * Opens a new url, if in a frame context, using the openUrl sdk action, otherwise opens via the fallback function. + * + * @param options - The options for the useOpenUrl hook. + * @param options.fallback - The fallback function to use if the context is not available. Defaults to opening in a new tab. */ -export function useOpenUrl() { +export function useOpenUrl( + { fallback }: UseOpenUrlParams = { + fallback: (url) => { + window.open(url, '_blank'); + }, + }, +) { const { context } = useMiniKit(); return useCallback( @@ -15,9 +26,9 @@ export function useOpenUrl() { if (context) { sdk.actions.openUrl(url); } else { - window.open(url, '_blank'); + fallback?.(url); } }, - [context], + [context, fallback], ); } diff --git a/packages/onchainkit/src/minikit/index.ts b/packages/onchainkit/src/minikit/index.ts index 8ab7ddd5b7..f5736160be 100644 --- a/packages/onchainkit/src/minikit/index.ts +++ b/packages/onchainkit/src/minikit/index.ts @@ -1,9 +1,8 @@ export { MiniKitProvider } from './MiniKitProvider'; export type { MiniKitProviderProps } from './types'; -export { SafeArea } from './components/SafeArea'; -export type { SafeAreaProps } from './components/SafeArea'; +export { SafeArea, type SafeAreaProps } from './components/SafeArea'; export { useMiniKit } from './hooks/useMiniKit'; -export { useOpenUrl } from './hooks/useOpenUrl'; +export { useOpenUrl, type UseOpenUrlParams } from './hooks/useOpenUrl'; export { useAuthenticate, parseSignInMessage } from './hooks/useAuthenticate'; export { useViewProfile } from './hooks/useViewProfile'; export { useAddFrame } from './hooks/useAddFrame';