Development

Announcing React Native Line v2!

Emiliano Botti
Emiliano Botti
Blog Main Image

We are happy to announce a new react-native-line version that supports the latest updates on the LINE SDK and it's available to download via npm!

When one of our projects called for an integration of sign in with Line (which is pretty popular in Japan), there were not any maintained alternatives in the React Native community so we decided to develop our own!

Example app main Example app permissions

(Example app with react-native-line integration)

A few years after the first release, being more specific in 2019, an issue was reported asking us for supporting React Native versions greater than 0.58. The newest React Native version introduced some breaking changes so we spent some time making it compatible again with the latest libraries.

Let's get into its functionality and how it works....

Functionalities

Login with Arguments

The new login functionality accepts any kind of argument like the native LineSDK.

Try out any of the following arguments:

{
  scopes?: LoginPermission[]
  onlyWebLogin?: boolean
  botPrompt?: BotPrompt
}

Where scopes accepts:

{
  EMAIL = 'email',
  /// The permission to get an ID token in the login response.
  OPEN_ID = 'openid',

  /// The permission to get the user's profile including the user ID, display name, and the profile image
  /// URL in the login response.
  PROFILE = 'profile',
}

and botPrompt:

{
  aggressive = 'aggressive',
  normal = 'normal',
}

This means your application would have the ability to get specific logged user information such as email address, user id, URL, and more!

Logout

Simply trigger this piece of code to logout the user:

try {
   ...
   await Line.logout()
   ...
} catch (error) {
   ...
}

Get logged user information

If you want to get information from the logged user, just run this snippet of code:

try {
   ...
   const profile = await Line.getProfile()
   ...
} catch (error) {
   ...
}

And you will get this profile object to use as you wish:

{
   /// The user ID of the current authorized user.
  userID: String

  /// The display name of the current authorized user.
  displayName: string

  /// The profile image URL of the current authorized user. `null` if the user has not set a profile
  /// image.
  pictureURL?: string

  /// The status message of the current authorized user. `null` if the user has not set a status message.
  statusMessage?: string
}

Get and refresh access token

LINE encourages to let the SDK to take care of the token management. But if for some reason you want to handle it, you have these functionalities in your swiss-army-knife:

  • Current token: getCurrentAccessToken()
  • Refresh token: refreshToken()
  • Verify token: verifyAccessToken()

Get bot prompt

Finally, you can get your user friendship status with the Line Official Account. You need to configure it in your account, specify the botPrompt option when logging in and then call getBotFriendshipStatus() method. Follow LINE's instructions for more information on how to link the bot to your account.

Comments about the library

Implementation

Unlike most natives modules in the React Native community which are developed in Objective-C and Java, new React Native Line version is implemented using Swift and Kotlin at a low level.

This was an easy decision to make. First, we have been using Swift and Kotlin since their first release. Secondly, Line SDK is deprecating the Objective-C version on behalf of Swift (see image below). Lastly, and this is more obvious, Swift and Kotlin are modern, more intuitive, easy to read, and maintain than Obj-c and Java respectively.

deprecation advertisement

Integration Guide

If you're using LineSDK for the first time, you can check the installation guide.

If you want to update to the latest version, please check out our fined-tuned migration guide.

Final thoughts

We hope you find it useful. Don't hesitate to contact us if you need any help or have a great new feature idea. We will be more than happy to keep this project growing!

Finally, we also want to thank everyone that helps create and maintain this library.

React Native LineReact NativeLineSDKXmartlabs