Work around for EIP712 on React Naitve

[Elvin-Skaria]

I am currently working on a React native project that requires me to implement EIP712 typed hashing and signing.

I have implemented the code on React with Metamask, where the both web3.currentProvider.sendAsync() or web3.currentProvider.send() returned the required a signed hash. The method used for signing is eth_signTypedData_v4.

But when trying the similar code on react native it returns an error that looks something like this:

ERROR {"error": {"code": -32700, "message": "err:[]*jsonrpc.Request: decode slice: expect [ or n, but found {, error found in #1 byte of ...|{\"signMetho|..., bigger context ...|{\"signMethod\":\"eth_signTypedData_v4\",\"params\":[\"0x5|... when unmarshal request"}, "id": "", "jsonrpc": "2.0"}

I even tried using web3.eth.sign() and web3.eth.personal.sign(), but the hash returned isn't the one as required, as it fails in getting the verification in the smart contract.

Following is the Code that I have implement on my React naitve project:

    const params = [account.address, msgParams];
    const from = account.address;
    console.log(params)

    web3.currentProvider?.send({
        signMethod,
        params,
        from
    },
        async function (err: any, result: any) {
            if (err) return console.dir(err)
            if (result.error) {
                console.log(result.error.message)
            }
            if (result.error) return console.error('ERROR', result)
            console.log('TYPED SIGNED:' + JSON.stringify(result.result))

            console.log("Signature result from wallet :");
            console.log(result);
            if (result && result.result) {
                const signature = result.result.substring(2);
                const r = "0x" + signature.substring(0, 64);
                const s = "0x" + signature.substring(64, 128);
                const v = parseInt(signature.substring(128, 130), 16);
                console.log("r:", r);
                console.log("s:", s);
                console.log("v:", v);
                console.log(account.address, "userAddress")

                const promiEvent = await contract.methods
                    .doingsomething(account.address, r, s, v)
                    .send({ from: account.address });

                console.log(promiEvent);

                if (promiEvent) {
                    created()
                } else {
                    failed("Could not get user signature.");
                }

            } else {
                failed("Could not get user signature.");
            }
        })

Following are the version of the packages that are being used:

"web3": "^1.7.0" "react-native": "0.67.2",

Please do let me know if any workaround is possible for this. Thank you