No Identifiers allowed after numeric literals (React Native)

[AtmegaBuzz]

Describe the bug
When i added this line

        let wallet = walletSdk.Wallet.TestNet();

The react native was giving this error "No Identifiers allowed after numeric literals".
upon debugging i found our that it can due to the bignumber.js or big int used in the sdk

What version are you on?
"@stellar/typescript-wallet-sdk": "^1.5.0"

Additional context

[Shaptic]

You should be sure to use a React Native compiler that supports BigInt literals (like 1234n).

[Botdavid]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a full stack developer, i have a good foundation in JavaScript and typescript

How I plan on tackling this issue

This is an issue that can be tacked easily, although I would like to get further clarity on the issues, as much information regarding the issue was not stated.

[akintewe]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a React Native / Flutter Developer with 6 years of experience combined. And yes i feel the issue might be coming from bignumber.js file which would have to be analysed, but also most configuration/syntax issues might come from the SDK used.

How I plan on tackling this issue

I would prefer analyzing the file in particular and the sdk to make sure they are both correctly implemented. Would be lovely if this issue can be assigned to me

[Luluameh]

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I have extensive experience in JavaScript and TypeScript, particularly in developing React Native applications. My background includes troubleshooting complex issues and collaborating on SDK integrations, which has equipped me with the skills to effectively address compatibility challenges.

How I plan on tackling this issue

I would start by reproducing the bug to confirm its occurrence. Then, I would investigate the bigint or bignumber.js implementation in the SDK to identify where it conflicts with the React Native environment. After pinpointing the issue, I would propose a solution, such as modifying the offending code or recommending a compatible version of the library to avoid the error related to numeric literals.

[Luluameh]

Hello @AtmegaBuzz

Update on "No identifiers allowed directly after numeric literal" Issue

Thank you for assigning me this issue. I've taken several steps to reproduce and investigate the problem:

1. Environment Setup:

   • Created a new React Native project
   • Installed the latest @stellar/typescript-wallet-sdk (version : "^1.7.0",)
   • Installed bignumber.js for handling large numbers
   • Added necessary polyfills and configurations for BigInt support

2. Code Implementation:

   • Implemented a basic app using the Stellar Wallet SDK
   • Specifically included BigInt literals and BigNumber objects to potentially trigger the error

   • Tested with the following code:

   import "./shim";
   import React from "react";
   import { View, Text } from "react-native";
   import * as Random from "expo-random";
   import { Keypair } from "@stellar/stellar-sdk";
   import BigNumber from "bignumber.js";
   import * as walletSdk from "@stellar/typescript-wallet-sdk";
   
   // Ensured that BigInt is available
   if (typeof BigInt === "undefined") global.BigInt = require("big-integer");
   
   const generateRandomKeypair = () => {
     const randomBytes = Random.getRandomBytes(32);
     return Keypair.fromRawEd25519Seed(Buffer.from(randomBytes));
   };
   
   export default function App() {
     const keypair = generateRandomKeypair();
     let wallet = walletSdk.Wallet.TestNet();
   
     // Using a BigInt literal to potentially trigger the error
     const bigIntLiteral = 1000000000000000000n;
   
     // Example of using BigNumber
     const largeNumber = new BigNumber("1000000000000000000");
   
     return (
       <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
         <Text>Public Key: {keypair.publicKey()}</Text>
         <Text>Secret Key: {keypair.secret()}</Text>
         <Text>BigInt Literal: {bigIntLiteral.toString()}</Text>
         <Text>Large Number: {largeNumber.toString()}</Text>
       </View>
     );
   }

3.Results:

• The app runs without any errors related to numeric literals
• Both BigInt literals and BigNumber objects are displayed correctly
• Output example:

  Public Key: GBXHCHNHTFOHD6KF2CY4IIP2FLABPJZWUWVPCGQ3TMXNOO45JZMDAOVE
  Secret Key: SBPTG746K632HKBMQF5DIZ2FSZRSVFXZIAFKAZO4AMS5ESAFJL7J5RVK
  BigInt Literal: 1000000000000000000
  Large Number: 1000000000000000000
  

4. Additional Steps Taken:
   • Pulled the js-stellar-sdk code to investigate any internal usage of BigInt literals
   • Created a separate React Native project to isolate the issue

Despite these efforts, I have not been able to reproduce the "No identifiers allowed directly after numeric literal" error.

Questions and Next Steps:

1. Are there specific operations or functions within the Stellar Wallet SDK that are known to trigger this error?
2. Can you provide more context on where this error typically occurs in your codebase or during which operations?
3. Are there any specific versions of React Native or the Stellar SDK where this issue is more prevalent?
4. Is there a particular device or environment setup where this error is more likely to occur?

I'm committed to resolving this issue and would greatly appreciate any additional information or specific scenarios where you've encountered this error. This will help me focus my efforts on the most relevant areas and potentially reproduce the issue more accurately.

Thank you for your guidance, and I look forward to your response.

[Shaptic]

@Luluameh which compiler are you using for React Native? One of them has support for BigInt literals whereas others don't, at least when this issue was created. cc @fnando who may have some add'l context

[Luluameh]

I'm using Babel as the compiler for the React Native project.