Error in Group Transaction

I have a code where I am tring to buy nfts and its a group transaction where algos are being transfered based on which nft are being transfred and based on that another loyalty tokens are being transfered.
When I manually transfrer the token it wokrs but when I use the wallet this error occurs.
This is my code for connection with algo signer

const sendTxn = async(signedTxs) => {
    console.log("TXN", signedTxs)
    const res = await window.algorand.postTxns(signedTxs)
        .then(async d => {
            // const data = waitForAlgosignerConfirmation(signedTxs);
            console.log("sendREsponse", d);
            // console.log("data", data);
            return d;
        })
        .catch(e => console.error(e));
    return res

};

const signAndSendTxn = async(trans) => {
    try {
        // FetchServerData.showLoaderWithText();
        // let Buffer = require('buffer').Buffer
        console.log("Trans: ", trans);

        const recovered_pay_txn = algosdk.decodeUnsignedTransaction(
            Buffer.from(trans.toString(), "base64")

        );
        let base64Tx = await window.algorand.encoding.msgpackToBase64(
            recovered_pay_txn.toByte()

        );
        console.log("Recoveryptm--", recovered_pay_txn)

        console.log("base64Tx", base64Tx);
        // FetchServerData.updateLoaderText("Sign transaction");
        const signedTxn = await window.algorand.signTxns([{ txn: base64Tx }])
            .then(async d => {
                const tx = await sendTxn(d);
                console.log("tx", tx.txnIDs[0]);
                return tx.txnIDs[0];
            })
            .catch(e => console.error(e));
        return signedTxn;
    } catch (error) {

        console.log("Error", error.message)
        throw new Error(error);

    }
};

And this is the code for buying the nft

const buyWithAlgos = async() => {
    console.log("Inside buywith algo");
    try {
        const connection = await AlgosignerUtility.checkAlgoSignerWallet1(true);
        console.log("connection------",connection);

        if (!connection) {
            console.log("Inside IF");
            return;
        }   

        const optInNFT = await axios.post(config.API_Algo_ENDPOINT+'marketplacecheckoptin',{
         
            body: {
              
              "Purchaser" : connection[0], 
              "Token_Id" :  Number(props.nfts.tokenId)
            }
           
            })

            console.log("optInNFT-------", optInNFT); 

            if(optInNFT.data.OptinCheck == true){
              document.getElementById("confirmspin").style.display = "block"
            const paymentTransaction = await axios.post(config.API_Algo_ENDPOINT+'useralgopayment',{
         
            body: {
                "Sender":connection[0],
                "Receiver":"OOF7CR65VIJIKYUXRWBENSIUQVW6YHUL7M5ONCZHYFD7JBQO33EF7MCHTQ",
                "Amount": Number(totalPrice * 1000000)
            }
           
            })
          
            // console.log("error");
            console.log("paymentTxn-------", paymentTransaction); 

When I try to buy the nft Algosigner gets opened but after signing the transaction this is the error.
Can anyone please help with this issue?