Migrating from Para v1.x to v2.0 Alpha
Guide for migrating from Para version 1.x to Para’s version 2.0 alpha release
Use this guide for assistance migrating from Para version 1.x to Para’s version 2.0 alpha release. Para 2.0 is in active development, and feature changes are expected while we work toward the final stable version. Developers wanting the latest changes should use the alpha version.
React SDK
Summary of breaking changes
-
The
setup-para
CLI tool needs to run before running your app to ensure all@getpara
libraries are properly polyfilled. It is recommended to do this in yourpostinstall
step of yourpackage.json
, something like: -
The
ParaProvider
is now required to be used when using the@getpara/react-sdk
.@alpha -
A
queryClient
from@tanstack/react-query
must be provided.See the
@tanstack/react-query
docs for more information on setting up aQueryClient
-
The
appName
prop has moved from a modal prop to a required config prop on theParaProvider
. This name will be used throughout the modal and in any external wallet providers that may be used. -
The
ParaModal
no longer needs to be provided separately, it is automatically included with theParaProvider
and all modal props can be passed to theParaProvider
.The
ParaModal
can still be provided separately if that is preferred. In this case thedisableEmbeddedModal: true
value should be passed to theParaProvider
config. -
The
ParaModal
props,isOpen
andonClose
, are no longer required (though they can be provided if desired). These values are now handled by theParaProvider
and developers can use theuseModal
hook to control the modal state. -
When using external wallets the Para connector libraries no longer need to be provided, just installed. All config values for these connectors can be passed to the
ParaProvider
.
Migration
Migration to V2 can be done one of two ways:
- (PREFERRED) Remove the
ParaModal
component you are providing and use the modal that the updatedParaProvider
provides. This option offers the most code reduction and overall simpler developer experience. - Continue to use the
ParaModal
component you are providing in your app. This option is a bit quicker than the first but will lead to a poorer developer experience.
Remove your <ParaModal>
and use the one built into <ParaProvider>
.
Starting Code:
After Migration:
Remove your <ParaModal>
and use the one built into <ParaProvider>
.
Starting Code:
After Migration:
Continue using your own <ParaModal>
by disabling the built-in one.
After Migration:
Adding External Wallets
If you’re using external wallets with Para currently, those configs can now be passed to the ParaProvider
and the connectors will be instantiated for you. Assuming you already followed the migration steps above, a successful migration would look like:
Notes on the external wallet migration:
- All wallets are provided by default, if you wish for them all to be provided you can remove the
wallets
value in theexternalWalletConfig
- If you only wish to use EVM wallets only the
evmConnector
config needs to be passed, the other connectors will be skipped in that case.
Pregen Wallet Methods
Methods dealing with pregen wallets now use a simpler object-based notation to specify the type and identifier the wallet belongs to.
Common Enums (optional)
Enum types used in certain methods, while still available, are now replaced with string union types. You will not be required to import these enums for methods that accept them.
Type Definitions
Auth Objects
User identity attestations are now represented as auth objects with a single key and value, representing both the type of attestation and the relevant identifier. These objects are used for methods that require an attestation of this type, primarily those for authentication and pre-generated wallet management.
Auth Object Examples
Phone number auth objects expect a string in international format, beginning with a +
and containing only numbers without spaces or extra characters, i.e.: +${number}
. If your UI deals in separated country codes and national phone numbers, you may use the exported formatPhoneNumber
function to combine them into a correctly formatted string.
Cancelable Methods (optional)
This feature is available in the following SDKs:
@getpara/web-sdk
@alpha@getpara/react-sdk
@alpha@getpara/react-native-sdk
@alpha
For methods that wait for user action, such as waitForLogin
, you may now pass a callback that is invoked on each polling interval, as well as a callback to indicate whether the method should be canceled and another invoked upon cancelation.
New Authentication Flow
The primary methods for authenticating via phone, email address, or third-party services have been overhauled and greatly simplified. If you are using a custom authentication UI, refer to the Custom Authentication UI page for detailed instructions and code samples. For new developers, the Para Modal is the preferred option to handle user authentication in your app.
Modified Core Methods
We’ve streamlined and improved several core methods in version 2.0.0. The following sections outline what’s changed and what actions you need to take.
These changes are required when upgrading to version 2.0.0. Make sure to update your code accordingly to avoid breaking your application.