klarna / react-native-klarna-inapp-sdk

Klarna's React Native wrapper for the In-App SDK

Klarna Mobile SDK React Native

This library wraps Klarna Mobile SDK and exposes its functionality as React Native components. It currently has the following components:

• KlarnaPaymentView to integrate Klarna Payments,
• KlarnaStandaloneWebView to integrate Klarna Standalone WebView.

This repository also includes a test application that you can use to see how it works.

SDK for Other Platforms

• Android
• iOS
• Flutter

Requirements

• iOS 10 or later.
• Android 4.4 or later.

Documentations

• Overview
• Using the Mobile SDK on React Native

Getting started

Add Dependency

NPM

npm install react-native-klarna-inapp-sdk --save

Yarn

yarn add react-native-klarna-inapp-sdk

Warning regarding Android integration

Both the iOS and Android integrations depend on the native SDK.

We've experienced issues with React Native 59 and above where 3rd party Gradle repositories won't be recognized in the Android project's build.gradle. To address this, you'll need to add a reference to the repository in your own app's build.gradle.

You can do it by adding the lines between the comments below:

allprojects {
    repositories {
        ...
        // Add the lines below
        maven {
            url 'https://x.klarnacdn.net/mobile-sdk/'
        }
    }
}

Support

If you are having any issues using the SDK in your project or if you think that something is wrong with the SDK itself, please follow our support guide.

Contribution

If you want to contribute to this project please follow our contribution guide.

License

This project is licensed under Apache License, Version 2.0.

react-native-klarna-inapp-sdk's Issues

Android app is unable to connect to Metro Bundler.

Describe the bug
On Android the app can't connect to Metro Bundler in the development mode. I've also tried to run your test project, but the situation is the same.
If I remove Klarna - everything is okay.

To Reproduce
Steps to reproduce the behavior:

1. Run android app
2. See that the app can't connect to the metro bundler.

Expected behavior
Android app can connect to metro bundler.

Screenshots

Device and version:

• Device: [e.g. Redmi Note 7, Pixel emulator]
• OS: Android 10, Android 11
• SDK Version [2.1.8]

Impact Level
I've tried it on three projects, including yours and template one. Same with my colleague. It could be a blocker if the problem is global.

React Native On-site Messaging

Is your feature request related to a problem? Please describe.
From what I see on the following doc https://docs.klarna.com/in-app/inapp-android-overview/on-site-messaging/
On-site messaging is currently only available on KLARNA iOS and android SDK, meaning that if we want to integrate it on a React Native app, we will need to create a bridge.

Describe the solution you'd like
Ideally, it would be nice if On-site Messaging was directly available in React Native SDK and not have to bridge based on the native(android and ios) SDKs.

Describe alternatives you've considered
Build a bridge based on iOS and Android KLARNA SDK.

Additional context
We are integrating with stripe, but we think this part(On-site Messaging) need to be implemented directly from KLARNA SDK. Correct me if I'm wrong.

Thank you

KlarnaPaymentView not render after codepush or metro refresh on android

When the application is first installed, KlarnaPaymentView is rendered as it's supposed to be. but if the app is refreshed (like codepush update or metro reload)
option description text fields ( like pay_later) are not showing.

This is the ss from when the first time your test app is installed:

this is ss after the reload app with metro (r key press)

test device
1- android 13 s22 ultra
2- android 12 m31

"dependencies": { "@react-navigation/native": "^6.0.12", "@react-navigation/native-stack": "^6.8.0", "react": "17.0.1", "react-native": "0.64.4", "react-native-klarna-inapp-sdk": "file:../", "react-native-safe-area-context": "^3.4.1", "react-native-screens": "^3.17.0" },

payments/v1/authorizations/${authToken}/order is showing PERMISSION_DENIED error

Describe the bug
When user is selecting payment terms its showing PERMISSION_DENIED error

Expected behavior
It should show
{
"order_id": "3eaeb557-5e30-47f8-b840-b8d987f5945d",
"redirect_url": "https://payments.klarna.com/redirect/...",
"fraud_status": "ACCEPTED",
"authorized_payment_method": "invoice"
}

Screenshots
If applicable, add screenshots to help explain your problem.

Device and version:

• Device: ios 15 pro simulator
• OS: iOS
• SDK Version17

Merchant Name
The Fragrance Shop

Impact Level
not able to go live with the app

> Task : react-native-klarna-inapp-sdk:compileReleaseJavaWithJavac FAILED

Describe the bug
I cannot say if it is a bug, but when I am integrating react-native-klarna-inapp-sdk into my project, and running ./gradlew assembleRelease, it is failing with the following error. Refer to the screenshot.

To Reproduce
Steps to reproduce the behavior:

1. Follow the documentation to integrate Klarna SDK
2. Run the build command to build AAB or APK
3. See error

Screenshots

Impact Level
It is kind of urgent and blocking me from finishing my Android build.

"Command PhaseScriptExecution failed with a nonzero exit code" getting this error in iOS after integrating react native SDK.

Describe the bug
After integrating the react native sdk when I am compiling the app on iOS simulator I am getting error : "Command PhaseScriptExecution failed with a nonzero exit code".
This is happening on latest version '2.0.42'. But I am able to run the code on sdk version '2.0.24' and below that. So not sure why this is happening on latest versions.

To Reproduce
Steps to reproduce the behavior:

1. Install react-native-klarna-inapp-sdk with npm or yarn.
2. Run app on iOS simulator.
3. See error

Expected behavior
App should run on iOS simulator.

Screenshots

Device and version:

• Device: iPhone 11 Pro Simulator
• OS: iOS13.2.2
• SDK Version 2.0.42
• Xcode version 11.2.1

Additional context
I have also tested the iOS demo app which is also giving the same error. Link: https://github.com/klarna/kp-ios-example-app

Android soft keyboard hides the input field in bottom screen

Hi,
Android soft keyboard hides the input field at bottom of screen and the content above the keyboard is not scrollable.
This makes a bad user experience since the users needs to write their info in blindfold (behind the soft keyboard).
This can be fixed by setting android:windowSoftInputMode="adjustResize" in Manifest.xml but that will change the behaviour on the soft keyboard in the whole app, which is not wanted in this case. It is only needed in the Klarna module.

Device and version:
Samsung S20 FE Android 11

React-native-klarna-inapp-sdk not working with latest react native version

When creating react native app using npx react-native init ProjectName and then typing npm install react-native-klarna-inapp-sdk It throws an error saying it cannot resolve dependency tree.

New Architecture support

Will you have any plan to upgrade to support new React Native fabric renderer system ?
https://reactnative.dev/docs/next/new-architecture-intro

Could not find com.klarna.mobile:sdk:2.4.1.

Describe the bug
Unable to run the project on android in the latest react native version (0.71.4)

To Reproduce
Updated react native version from 0.66.5 to 0.71.4 and unable to run the project in android.

Screenshots

Device and version:

• react native: v0.71.4
• react - v18.2.0
• react-native-klarna-inapp-sdk : v2.1.10
• node - v18.3.0
• java - v11.0.12
• Android studio - Android Studio Chipmunk v11.0.12+0-b1504.28-7817840
• Android emulator: Android 12 OS

Thanks

Could not find a declaration file for module 'react-native-klarna-inapp-sdk'.

Could not find a declaration file for module 'react-native-klarna-inapp-sdk'. '/Users/deva/Desktop/delete_me/AwesomeApp/node_modules/react-native-klarna-inapp-sdk/src/index.js' implicitly has an 'any' type.
Try npm i --save-dev @types/react-native-klarna-inapp-sdk if it exists or add a new declaration (.d.ts) file containing declare module 'react-native-klarna-inapp-sdk';ts(7016)

To Reproduce
Steps to reproduce the behavior:

1. Create new react native project
2. import KlarnaPaymentView in any View
3. You will see the above error

Installation fails with 1.0.9

Describe the bug
Running pod install after SDK installation gives error

Fetching podspec for `react-native-klarna-inapp-sdk` from `../node_modules/react-native-klarna-inapp-sdk/react-native-klarna-inapp-sdk.podspec`
Downloading dependencies
Installing KlarnaMobileSDK (2.0.10)
Installing react-native-klarna-inapp-sdk (1.0.9)

[!] Error installing react-native-klarna-inapp-sdk
[!] /usr/bin/git clone https://github.com/klarna/react-native-klarna-inapp-sdk.git /var/folders/w2/hgd452qx5qv8jvq0r1k1fxv40000gn/T/d20200227-7880-p7tvpp --template= --single-branch --depth 1 --branch 1.0.9

Cloning into '/var/folders/w2/hgd452qx5qv8jvq0r1k1fxv40000gn/T/d20200227-7880-p7tvpp'...
warning: Could not find remote branch 1.0.9 to clone.
fatal: Remote branch 1.0.9 not found in upstream origin

To Reproduce
Steps to reproduce the behavior:

1. Manually install SDK
2. Go to iOS folder
3. pod install
4. See error

Expected behavior
Should install without errors

Screenshots

Device and version:

• Device: MacBook Pro
• OS: MAX OS X
• SDK Version 1.0.9

Additional context
We did not have issues with 1.0.7

"Unable to load script from assets 'index.android.bundle'..." after integrating SDK using NPM or manual installation

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. npm install this package
2. try to run using npx react-native run-android
3. see error

* What went wrong:
Execution failed for task ':app:checkDebugAarMetadata'.
> Could not resolve all files for configuration ':app:debugRuntimeClasspath'.
   > Could not find com.klarna.mobile:sdk:2.0.16.
     Searched in the following locations:
       - file:/Users/ios/.m2/repository/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
       - file:/Users/ios/Desktop/demo_tests/paymentDemo/node_modules/react-native/android/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
       - file:/Users/ios/Desktop/demo_tests/paymentDemo/node_modules/jsc-android/dist/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
       - https://dl.google.com/dl/android/maven2/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
       - https://jcenter.bintray.com/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
       - https://www.jitpack.io/com/klarna/mobile/sdk/2.0.16/sdk-2.0.16.pom
     Required by:
         project :app > project :react-native-klarna-inapp-sdk

I fix this error by following this https://github.com/klarna/react-native-klarna-inapp-sdk#warning-regarding-android-integration

But after that metro server does not run. Project Builds successfully but metro server do not run .

I followed this guide and fixed metro issue too but it is just a hack and it breaks hot refresh and debugging .

Expected behavior
It should run with metro server .

Here is the example code you can check it also for reproducing same error:- https://github.com/EndLess728/klarna-demo-

Screenshots

Device and version:

• Device: Android
• OS: Android 10
• SDK Version 2.0.16

Authorization window is not showing properly on iOS 13.1

When I try to load the authorization window it animates up and stays for a split second, then dissapears completely. This is on iOS 13.1 running on different simulators. Have not had the possibility to test it on an actual device though. I also tried it with v1.0.2 and v1.0.3 with no luck.

Android build fails

Describe the bug
Gradle build fails while executing command npm run android on React Native

To Reproduce
Steps to reproduce the behavior:

1. npx react-native init ProjectName
2. npm install react-native-klarna-inapp-sdk --save
3. react-native link react-native-klarna-inapp-sdk
4. I reference repository in build.gradle file

Expected behavior
App build succeeds

Screenshots

Device and version:

• Device: [Redmi Note 10 Pro]
• OS: [Android 11]
• SDK Version [2.1.6]

Additionally, if i remove klarna from dependencies, it would without any problems.

Klarna WebView Not Properly rendering on Android

On Android , if you try to render KlarnaPaymentView for category pay_over_time , the Webview is not fully rendered , It just shows the header part with breakdown of payments, without the Card Input View where user would enter their card details .

It seems like it has to do with Height listener in Android , because if you rotate your device and then bring it back , it layouts fine , the same code works fine for IOS .
A clear and concise description of what the bug is.

To Reproduce

some of the code is removed , but skeleton is there .
Steps to reproduce the behavior:
`
import { KlarnaConfirmationFooter } from './klarna-confirmation-footer.component';

export const StyledKlarnaPaymentView = styled(KlarnaPaymentView)width: 100%; flex: 1;;

export const KlarnaWebViewWrapper = styled.Viewflex: 1;;

export const KlarnaConfirmationWrapper = styled.Viewflex: 1;;

export const KlarnaConfirmation: React.FC = React.memo(function KlarnaConfirmation() {

return (
    <KlarnaConfirmationWrapper>
        <KlarnaWebViewWrapper>
            {!isKlarnaLoaded && <ActivityIndicator size="large" />}
            {!isFetching && (
                <StyledKlarnaPaymentView
                    category={chosenCategory as string}
                    ref={klarnaViewRef}
                    onInitialized={handleInitialised}
                    onLoaded={handleLoaded}
                    onAuthorized={eventCallBack}
                    onError={eventCallBack}
                    onFinalized={eventCallBack}
                    onReauthorized={eventCallBack}
                />
            )}
        </KlarnaWebViewWrapper>
        <KlarnaConfirmationFooter disabled={isFooterButtonDisabled} onPress={handlePayWithKlarnaTap} />
    </KlarnaConfirmationWrapper>
);

});

`
Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem. This is from a physical Huwaei p30 lite

This is a from emulator

Device and version:

• Huwaei P30 lite

• Android Version 10.0

• SDK Version 2.0.13

• Galaxy J5

• Android Version 7.1.1

• SDK Version 2.0.13

Additional context

Can't open the klarna's authorize popup in reactnative app for ios.

Describe the bug
After I authorize braintree 's 3D Secure 2, i can't open the klarna's authorize popup in reactnative app for ios.
I find KlarnaPaymentView's authorize method and callback was be called, code execution is normal，but I can't see the authorize popup.

To Reproduce
Steps to reproduce the behavior:

1. get a reactnative app for ios
2. 3ds authorization and payment by braintree sdk
3. create a new order, and use klarna payment

Expected behavior
how to fix it, or tell me what happend

Device and version:

• Device: [e.g. iPhoneX]
• OS: [e.g. iOSq5.4.1]
• SDK Version: 2.0.18

Impact Level
Is it a blocking issue for development.

we should use another package name

react-native-klarna-inapp-sdk/android/src/main/AndroidManifest.xml

Line 2 in 86c73ef

package="com.klarna">

when we try to include the SDK into Klarna application that uses package com.klarna we have a DEX conflict.

All modules/libraries should use own unique package name.

P.S. Its ok for the rest of the world, but for internal use we create conflict.

P.P.S. workaround:

android {
    /* ... */
    /* Custom source code injection */
    sourceSets {
        // http://google.github.io/android-gradle-dsl/current/com.android.build.gradle.api.AndroidSourceSet.html
        main {
            /*
                Inject library source code into solution to prevent the conflict of
                the packages: App - com.klarna & InAppSdk - com.klarna
            */
            java.srcDirs project(':react-native-klarna-inapp-sdk').file('src/main/java')
        }
    }
}

recommended package name: com.klarna.inapp.sdk OR com.klarna.inapp

KlarnaPaymentView "Bankkonto" won't render in android

Describe the bug
This issue occurred in android, after session initialised, the app rendered three payment options:

1. Bankkonto
2. Köp först. Betala sen
3. Dela upp

When the user click "1) Bankkonto", KlarnaPaymentView#onLoaded was triggered, but the webview won't render. 2) and 3) work as expected only if when the user hasn't clicked 1) previously.

To Reproduce
Steps to reproduce the behavior (scenario 1):

1. Render 3 klarna payment options
2. choose to render "bankkonto"
3. webview of bankkonto won't render

Steps to reproduce the behavior (scenario 2):

1. Render 3 klarna payment options
2. choose to render "köp först betala sen", then choose "bankkonto"
3. webview of bankkonto won't render

Logs from android studio
client url and credentials are masked by "xxxxxxxxxxxxxxxxxxx".

I/chromium: [INFO:CONSOLE(0)] "Uncaught (in promise) TypeError: Failed to fetch", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (0)
    [INFO:CONSOLE(11)] "Received message: 
    {
      "action": "actionToComponent",
      "messageId": "7302ce5",
      "params": {
        "actionType": "initialize",
        "clientToken": "xxxxxxxxxxxxxx_client_token_xxxxxxxxxxxxxx",
        "returnUrl": "https://www.xxxxxxxxxxxxxxxxxxx.se/klarna-success-return"
      },
      "receiver": "KlarnaPaymentsWrapper",
      "sender": "Native"
    }", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
    [INFO:CONSOLE(11)] "Sending event: RecvdInitialize", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
    [INFO:CONSOLE(11)] "Handling mock init.", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
I/chromium: [INFO:CONSOLE(11)] "Token parsed:  true", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
I/chromium: [INFO:CONSOLE(11)] "Sending event: ValidatedInitialize", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
I/chromium: [INFO:CONSOLE(11)] "Performing Klarna.Payments.init().", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
    [INFO:CONSOLE(11)] "Sending event: PerformingInitialize", source: file:///data/user/0/xxxxxxxxxxxxxxxxxxxxxx/files/kp_index.html?mockkp=true&storeall=true&loglevel=0 (11)
W/WebView: java.lang.Throwable: A WebView method was called on thread 'JavaBridge'. All WebView methods must be called on the same thread. (Expected Looper Looper (main, tid 2) {5db60d0} called on Looper (JavaBridge, tid 1446) {39cb602}, FYI main Looper is Looper (main, tid 2) {5db60d0})
        at android.webkit.WebView.checkThread(WebView.java:2575)
        at android.webkit.WebView.getUrl(WebView.java:1251)
        at com.klarna.mobile.sdk.a.e.m.g.<init>(AnalyticBuilder.kt:2)
        at com.klarna.mobile.sdk.a.e.m.b.a(AnalyticBuilder.kt:1)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:4)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:12)
        at com.klarna.mobile.sdk.core.webview.g$a.postMessage(WebViewNativeHook.kt:36)
        at android.os.MessageQueue.nativePollOnce(Native Method)
        at android.os.MessageQueue.next(MessageQueue.java:336)
        at android.os.Looper.loop(Looper.java:174)
        at android.os.HandlerThread.run(HandlerThread.java:67)
D/StrictMode: StrictMode policy violation: android.os.strictmode.WebViewMethodCalledOnWrongThreadViolation
        at android.webkit.WebView.checkThread(WebView.java:2575)
        at android.webkit.WebView.getUrl(WebView.java:1251)
        at com.klarna.mobile.sdk.a.e.m.g.<init>(AnalyticBuilder.kt:2)
        at com.klarna.mobile.sdk.a.e.m.b.a(AnalyticBuilder.kt:1)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:4)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:12)
        at com.klarna.mobile.sdk.core.webview.g$a.postMessage(WebViewNativeHook.kt:36)
        at android.os.MessageQueue.nativePollOnce(Native Method)
        at android.os.MessageQueue.next(MessageQueue.java:336)
        at android.os.Looper.loop(Looper.java:174)
        at android.os.HandlerThread.run(HandlerThread.java:67)
W/System.err: java.lang.RuntimeException: java.lang.Throwable: A WebView method was called on thread 'JavaBridge'. All WebView methods must be called on the same thread. (Expected Looper Looper (main, tid 2) {5db60d0} called on Looper (JavaBridge, tid 1446) {39cb602}, FYI main Looper is Looper (main, tid 2) {5db60d0})
        at android.webkit.WebView.checkThread(WebView.java:2580)
        at android.webkit.WebView.getUrl(WebView.java:1251)
        at com.klarna.mobile.sdk.a.e.m.g.<init>(AnalyticBuilder.kt:2)
        at com.klarna.mobile.sdk.a.e.m.b.a(AnalyticBuilder.kt:1)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:4)
        at com.klarna.mobile.sdk.a.e.m.a.a(AnalyticBuilder.kt:12)
        at com.klarna.mobile.sdk.core.webview.g$a.postMessage(WebViewNativeHook.kt:36)
        at android.os.MessageQueue.nativePollOnce(Native Method)
        at android.os.MessageQueue.next(MessageQueue.java:336)
        at android.os.Looper.loop(Looper.java:174)
        at android.os.HandlerThread.run(HandlerThread.java:67)
    Caused by: java.lang.Throwable: A WebView method was called on thread 'JavaBridge'. All WebView methods must be called on the same thread. (Expected Looper Looper (main, tid 2) {5db60d0} called on Looper (JavaBridge, tid 1446) {39cb602}, FYI main Looper is Looper (main, tid 2) {5db60d0})
        at android.webkit.WebView.checkThread(WebView.java:2575)
    	... 10 more

Device and version:

• Device: google pixel 4
• OS: android 10
• react-native-klarna-inapp-sdk: 2.0.5 (currently latest)

Additional context
In 2.0.5, webview won't render, but in 2.0.2, it will crash the app;
It works perfectly in iOS.

'KlarnaMobileSDK/KlarnaMobileSDK-Swift.h' file not found

• Settings

pod 'KlarnaMobileSDK'
"react-native-klarna-inapp-sdk": "^1.0.3"
Libraries and binary linked
After a freshnpm iand pod install with react-native link.

Getting /source/app/node_modules/react-native-klarna-inapp-sdk/ios/view/PaymentViewWrapper.m:10:9: 'KlarnaMobileSDK/KlarnaMobileSDK-Swift.h' file not found

Not able to run on iOS simulator

I'm not able to run the app on iOS simulator any more but it's seems to be working fine on physical device.
dyld: Library not loaded: @rpath/libswiftCore.dylib Referenced from: .../Frameworks/KlarnaMobileSDK.framework/KlarnaMobileSDK Reason: no suitable image found. Did find: /usr/lib/swift/libswiftCore.dylib: mach-o, but not built for iOS simulator

What should I do to make it run on simulator?

Compilation failure when running "react-native run-android"

I installed the plugin by following the instructions on the README page. However, the compilation failed while running react-native run-android. The errors occurred for Task :react-native-klarna-inapp-sdk:compileDebugJavaWithJavac. The error messages are attached below.

RN Version: "0.59.5",
react-native-klarna-inapp-sdk Version: "1.0.0"

Error messages:

> Task :react-native-klarna-inapp-sdk:compileDebugJavaWithJavac FAILED
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-kl
arna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.jav
a:14: error: package com.klarna.mobile.sdk.api.payments does not exist
import com.klarna.mobile.sdk.api.payments.KlarnaPaymentView;
                                         ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-kl
arna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.jav
a:15: error: package com.klarna.mobile.sdk.api.payments does not exist
import com.klarna.mobile.sdk.api.payments.KlarnaPaymentViewCallback;
                                         ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-kl
arna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:16: error: package com.klarna.mobile.sdk.api.payments does not exist
import com.klarna.mobile.sdk.api.payments.KlarnaPaymentsSDKError;
                                         ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:30: error: cannot find symbol
public class KlarnaPaymentViewManager extends SimpleViewManager<PaymentViewWrapper> implements KlarnaPaymentViewCallback {
                                                                                               ^
  symbol: class KlarnaPaymentViewCallback
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/PaymentViewWrapper.java:13: error: package com.klarna.mobile.sdk.api.payments does not exist
import com.klarna.mobile.sdk.api.payments.KlarnaPaymentView;
                                         ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:188: error: cannot find symbol
    private void postEventForView(String eventName, Map additionalParams, KlarnaPaymentView view) {
                                                                          ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:205: error: cannot find symbol
    public void onInitialized(@NotNull KlarnaPaymentView paymentView) {
                                       ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:210: error: cannot find symbol
    public void onLoaded(@NotNull KlarnaPaymentView paymentView) {
                                  ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:215: error: cannot find symbol
    public void onLoadPaymentReview(@NotNull KlarnaPaymentView paymentView, boolean b) {
                                             ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:220: error: cannot find symbol
    public void onAuthorized(@NotNull KlarnaPaymentView paymentView, boolean approved, @org.jetbrains.annotations.Nullable String authToken, @org.jetbrains.annotations.Nullable Boolean finalizeRequired) {
                                      ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:230: error: cannot find symbol
    public void onReauthorized(@NotNull KlarnaPaymentView paymentView, boolean approved, @org.jetbrains.annotations.Nullable String authToken) {
                                        ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:239: error: cannot find symbol
    public void onFinalized(@NotNull KlarnaPaymentView paymentView, boolean approved, @org.jetbrains.annotations.Nullable String authToken) {
                                     ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:248: error: cannot find symbol
    public void onErrorOccurred(@NotNull KlarnaPaymentView klarnaPaymentView, @NotNull KlarnaPaymentsSDKError klarnaPaymentsSDKError) {
                                         ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:248: error: cannot find symbol
    public void onErrorOccurred(@NotNull KlarnaPaymentView klarnaPaymentView, @NotNull KlarnaPaymentsSDKError klarnaPaymentsSDKError) {
                                                                                       ^
  symbol:   class KlarnaPaymentsSDKError
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:252: error: cannot find symbol
    private PaymentViewWrapper wrapperForPaymentView(KlarnaPaymentView paymentView) {
                                                     ^
  symbol:   class KlarnaPaymentView
  location: class KlarnaPaymentViewManager
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/PaymentViewWrapper.java:21: error: cannot find symbol
    public KlarnaPaymentView paymentView;
           ^
  symbol:   class KlarnaPaymentView
  location: class PaymentViewWrapper
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:125: error: variable sessionData is already defined in method receiveCommand(PaymentViewWrapper,int,ReadableArray)
                    final String sessionData = args.getString(1);
                                 ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:132: error: variable sessionData is already defined in method receiveCommand(PaymentViewWrapper,int,ReadableArray)
                String sessionData = null;
                       ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:141: error: variable sessionData is already defined in method receiveCommand(PaymentViewWrapper,int,ReadableArray)
                String sessionData = null;
                       ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:161: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_INITIALIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_INITIALIZE),
                                  ^
  symbol:   variable EVENT_NAME_ON_INITIALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:161: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_INITIALIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_INITIALIZE),
                                                                                                                 ^
  symbol:   variable EVENT_NAME_ON_INITIALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:162: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_LOAD, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_LOAD),
                                  ^
  symbol:   variable EVENT_NAME_ON_LOAD
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:162: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_LOAD, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_LOAD),
                                                                                                           ^
  symbol:   variable EVENT_NAME_ON_LOAD
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:163: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_LOAD_PAYMENT_REVIEW, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_LOAD_PAYMENT_REVIEW),
                                  ^
  symbol:   variable EVENT_NAME_ON_LOAD_PAYMENT_REVIEW
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:163: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_LOAD_PAYMENT_REVIEW, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_LOAD_PAYMENT_REVIEW),
                                                                                                                          ^
  symbol:   variable EVENT_NAME_ON_LOAD_PAYMENT_REVIEW
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:164: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_AUTHORIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_AUTHORIZE),
                                  ^
  symbol:   variable EVENT_NAME_ON_AUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:164: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_AUTHORIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_AUTHORIZE),
                                                                                                                ^
  symbol:   variable EVENT_NAME_ON_AUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:165: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_REAUTHORIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_REAUTHORIZE),
                                  ^
  symbol:   variable EVENT_NAME_ON_REAUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:165: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_REAUTHORIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_REAUTHORIZE),
                                                                                                                  ^
  symbol:   variable EVENT_NAME_ON_REAUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:166: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_FINALIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_FINALIZE)
                                  ^
  symbol:   variable EVENT_NAME_ON_FINALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:166: error: cannot find symbol
                KlarnaPaymentEvent.EVENT_NAME_ON_FINALIZE, MapBuilder.of("registrationName", KlarnaPaymentEvent.EVENT_NAME_ON_FINALIZE)
                                                                                                               ^
  symbol:   variable EVENT_NAME_ON_FINALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:204: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:206: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_INITIALIZE, null, paymentView);
                                           ^
  symbol:   variable EVENT_NAME_ON_INITIALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:209: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:211: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_LOAD, null, paymentView);
                                           ^
  symbol:   variable EVENT_NAME_ON_LOAD
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:214: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:216: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_LOAD_PAYMENT_REVIEW, null, paymentView);
                                           ^
  symbol:   variable EVENT_NAME_ON_LOAD_PAYMENT_REVIEW
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:219: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:221: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_AUTHORIZE,
                                           ^
  symbol:   variable EVENT_NAME_ON_AUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:229: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:231: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_REAUTHORIZE,
                                           ^
  symbol:   variable EVENT_NAME_ON_REAUTHORIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:238: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:240: error: cannot find symbol
        postEventForView(KlarnaPaymentEvent.EVENT_NAME_ON_FINALIZE,
                                           ^
  symbol:   variable EVENT_NAME_ON_FINALIZE
  location: class KlarnaPaymentEvent
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java:247: error: method does not override or implement a method from a supertype
    @Override
    ^
/Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/PaymentViewWrapper.java:31: error: cannot find symbol
        paymentView = new KlarnaPaymentView(getReactAppContext().getCurrentActivity(), attrs); // Insure we use activity and not application context for dialogs.
                          ^
  symbol:   class KlarnaPaymentView
  location: class PaymentViewWrapper
Note: /Users/ying.zhang/Projects/hxxxx/cs_xxxx/node_modules/react-native-klarna-inapp-sdk/android/src/main/java/com/klarna/KlarnaPaymentViewManager.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
45 errors

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':react-native-klarna-inapp-sdk:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

CLEARTEXT communication to xxx not permitted by network security policy in Android

Describe the bug
No API calls starting with HTTP (http://203.89.289/api/get) are working in Android, but API calls starting with HTTPS (https://domain.com/api/get) are working. No issue in iOS.

To Reproduce
Steps to reproduce the behaviour:
API calls starting with HTTP are not working at all after installing this package. Even though I got this error from rn-fetch-blob, none of the APIs is working.

Expected behaviour
All the API calls starting with HTTP needs to work in Android.

Device and version:

• Android Emulator, One Plus
• Android 10
• API -30
• react native : 0.66.2
• react-native-klarna-inapp-sdk - 2.1.0

Not full content is rendered on Android.

Describe the bug
On Android, some part of the content is not rendered, this text is missing:

You must be 18+ to use this credit card. ....

Expected behavior
All data should be visible

Screenshots

Device and version:

• Device: Android simulator
• OS: Android

Additional context
On iOS everything is ok. The screenshot is above.