Skip to content

fix: refactored exposed apis#35

Open
Shivam25092001 wants to merge 1 commit into
mainfrom
refactor-apis
Open

fix: refactored exposed apis#35
Shivam25092001 wants to merge 1 commit into
mainfrom
refactor-apis

Conversation

@Shivam25092001

@Shivam25092001 Shivam25092001 commented Mar 26, 2026

Copy link
Copy Markdown
Contributor

FIXED

  • exposed apis

CHANGED:

import { HyperInit } from '@juspay-tech/react-native-hyperswitch';
HyperInit(publishableKey, profileId)

const hyperElementsOptions: HyperElementsOptions = {
    clientSecret: clientSecret ?? undefined,
    sdkAuthorisationForPayments: sdkAuthorisation ?? undefined,
  };
<HyperElements hyper={hyperPromise} options={hyperElementsOptions}>
        <PaymentWidget
          widgetId="payment-widget"
          onPaymentResult={(result: any) => {
            console.log('Payment Result from Widget:', result);
            if (result.errorMessage) {
              setStatus(`Payment failed: ${result.errorMessage}`);
              setMessage(null);
            } else {
              setStatus(getStatus(result?.status));
              setMessage(result?.status);
            }
          }}
          style={{ width: '100%', height: 400 }}
          options={{ 
            ...getCustomisationOptions('accordion'), 
          }}
        />
</HyperElements>

Deprecated useHyper and HyperProvider

IMPLEMENTATION

  • HyperInit stores the global variables in a global context.
  • HyperElement resolves the hyperPromise and internally initailizes the nativeModule with pk_key and other configs (internally initializing the PaymentSession object on native layer).
  • PaymentWidget presents the widget using the clientSecret.

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Refactors the public React Native Hyperswitch SDK surface to a new initialization + context model (HyperInit + HyperElements) and introduces a widget-oriented hook (useWidget), while updating the example app accordingly and removing the prior useHyper / HyperProvider exports.

Changes:

  • Added new core APIs: HyperInit (returns a hyper instance promise) and HyperElements (context provider).
  • Updated PaymentWidget to pull clientSecret from HyperElements context; removed clientSecret/sdkAuthorisation from PaymentSheetConfiguration.options.
  • Added useWidget hook and new exported TS types; updated example app to use HyperInit + HyperElements.

Reviewed changes

Copilot reviewed 13 out of 13 changed files in this pull request and generated 10 comments.

Show a summary per file
File Description
packages/@juspay-tech/react-native-hyperswitch/src/views/PaymentWidget.res Reads clientSecret from HyperElements context and passes it to the native widget.
packages/@juspay-tech/react-native-hyperswitch/src/types/PaymentSheetConfiguration.res Removes clientSecret / sdkAuthorisation from payment sheet options.
packages/@juspay-tech/react-native-hyperswitch/src/types/NativeModuleTypes.res Updates comment; keeps native widget prop types.
packages/@juspay-tech/react-native-hyperswitch/src/types/HyperTypes.res Introduces new exported types for hyper instance, context data, and widget controller.
packages/@juspay-tech/react-native-hyperswitch/src/modules/NativeHyperswitchSdk.res Changes native module types and adds new method signatures.
packages/@juspay-tech/react-native-hyperswitch/src/index.tsx Re-exports new API surface; removes old exports.
packages/@juspay-tech/react-native-hyperswitch/src/hooks/useWidget.res Adds new useWidget hook + legacy wrapper.
packages/@juspay-tech/react-native-hyperswitch/src/hooks/useHyper.res Comments out legacy hook implementation (effectively removed).
packages/@juspay-tech/react-native-hyperswitch/src/core/HyperElements.res Adds context provider responsible for initialization + holding clientSecret/sdkAuthorisation.
packages/@juspay-tech/react-native-hyperswitch/src/core/Hyper.res Adds Hyper.init producing a hyperInstance and storing global config.
packages/@juspay-tech/react-native-hyperswitch/src/context/HyperProvider.res Comments out legacy provider implementation (effectively removed).
example/src/PaymentScreen.tsx Migrates example to HyperElements + widget flow.
example/src/App.tsx Migrates example initialization to HyperInit.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread packages/@juspay-tech/react-native-hyperswitch/src/index.tsx
let isReady = contextData.isInitialized && contextData.error->Option.isNone

let initPaymentSession = React.useCallback0((params: initPaymentSessionParams) => {
nativeHyperswitchSdk.initPaymentSession(~paymentIntentClientSecret=params.paymentIntentClientSecret->Option.getOr(""))->Promise.then(result => {

Copilot AI Mar 26, 2026

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

initPaymentSessionParams includes sdkAuthorisation, but useWidgetLegacy.initPaymentSession ignores it and nativeHyperswitchSdk.initPaymentSession only receives paymentIntentClientSecret. This is misleading for API consumers: either remove sdkAuthorisation from the params type / legacy hook, or change the flow so the SDK authorisation is actually applied (e.g., via HyperElements/native init).

Suggested change
nativeHyperswitchSdk.initPaymentSession(~paymentIntentClientSecret=params.paymentIntentClientSecret->Option.getOr(""))->Promise.then(result => {
nativeHyperswitchSdk.initPaymentSession(
~paymentIntentClientSecret=params.paymentIntentClientSecret->Option.getOr(""),
~sdkAuthorisation=params.sdkAuthorisation->Option.getOr(""),
)->Promise.then(result => {

Copilot uses AI. Check for mistakes.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

will change in upcoming PRs

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@manideepk90 working on updateIntent feature might need this

Comment thread example/src/PaymentScreen.tsx
Comment thread packages/@juspay-tech/react-native-hyperswitch/src/types/HyperTypes.res Outdated
Comment thread example/src/PaymentScreen.tsx Outdated
@Shivam25092001 Shivam25092001 changed the title fix: refactored expposed apis fix: refactored exposed apis Mar 26, 2026
Comment thread example/src/App.tsx
import { View, Text } from 'react-native';
import { HyperProvider } from '@juspay-tech/react-native-hyperswitch';
import {
HyperInit,

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TO check if web is making this a default export

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

loadHyper is a named import in hyperswitch-web, so keeping parity here, keeping as a named import.

Comment thread example/src/App.tsx
}
const hyperPromise =
publishableKey && profileId ?
HyperInit(publishableKey, profileId)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

rename to Hyperswitch

Comment thread packages/@juspay-tech/react-native-hyperswitch/src/core/Hyper.res
// Options type for HyperElements
@genType
type hyperElementsOptions = {
clientSecret: option<string>,

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove clientSecret flow completely

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This will need client-core changes

~customLogUrl: option<string>,
~customParams: option<Js.Json.t>,
) => {
await NativeHyperswitchSdk.nativeHyperswitchSdk.initialise(

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

move this call to HyperInit

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants