FormatException thrown when signing the transaction with AlgorandWalletConnectProvider

[jasonhtpham]

After connecting to my account on Pera Wallet, I faced this error

Error: FormatException: Invalid character (at character 77)
I/flutter (10855): gqNzaWfEQIwtNFWFUDYnI49KtgVk5nGLCiEP9M/F7p4Zz2acj2FNEdZT3Dq56o+hKaSTYTzrU229

When I tried to sign the transaction in this function:

@override
  Future<String?> optInApp({
    required int appId,
  }) async {
    logger.i("Opting in to app: $appId");

    if (await optedIn(appId)) {
      logger.i("Already opted in to app: $appId");
      return null;
    }

    final sender =
        Address.fromAlgorandAddress(_connector.connector.session.accounts[0]);

    // Fetch the suggested transaction params
    final params = await _algorand.getSuggestedTransactionParams();

    // Build the transaction
    final transaction = await (ApplicationOptInTransactionBuilder()
          ..sender = sender
          ..noteText = 'Opt in to app $appId from $sender'
          ..applicationId = appId
          ..suggestedParams = params)
        .build();

    logger.i("Tx created: $transaction");

    try {
      // Sign the transaction
      final txBytes = Encoder.encodeMessagePack(transaction.toMessagePack());
      logger.i("Tx bytes: $txBytes");

      final signedBytes = await _provider.signTransaction(
        txBytes,
        params: {
          'message': 'Opt in to app $appId from $sender',
        },
      );

      logger.i("Tx signed: $signedBytes");

      // Broadcast the transaction
      final txId = await _algorand.sendRawTransactions(
        signedBytes,
        waitForConfirmation: true,
      );
      return txId;
    } catch (e) {
      final err = _tryCast(e, fallback: AlgorandException);
      if (err is AlgorandException) {
        AlgorandException error = err as AlgorandException;
        debugPrint('Error: ${error.message}');
      } else {
        debugPrint('Error: $e');
      }
      return null;
    }
  }

I tried to debug it and found that it happened when I tried to sign the transaction

      final txBytes = Encoder.encodeMessagePack(transaction.toMessagePack());
      final signedBytes = await _provider.signTransaction(
        txBytes,
        params: {
          'message': 'Opt in to app $appId from $sender',
        },
      );

My initialization code and the connect method in my AlgorandConnector class:

AlgorandConnector() {
    _connector = WalletConnectQrCodeModal(
      connector: WalletConnect(
        bridge: 'https://bridge.walletconnect.org',
        clientMeta: const PeerMeta(
          // <-- Meta data of your app appearing in the wallet when connecting
          name: 'Shark Tank DApp',
          description: 'Shark Tank DApp',
          url: 'https://walletconnect.org',
          icons: [
            'https://gblobscdn.gitbook.com/spaces%2F-LJJeCjcLrr53DcT1Ml7%2Favatar.png?alt=media'
          ],
        ),
      ),
    );

    _provider = AlgorandWalletConnectProvider(_connector.connector);
  }

  T? _tryCast<T>(dynamic value, {T? fallback}) {
    try {
      return (value as T);
    } on TypeError catch (_) {
      return fallback;
    }
  }

  @override
  Future<SessionStatus?> connect(BuildContext context) async {
    return await _connector.connect(context, chainId: 4160);
  }

It used to work perfectly fine when I tested it a few days ago. I only faced this error yesterday. It also happened when I tested on a different device. Besides, if I connect to the Dapp using the QR Code, everything works perfectly fine. But I am working on a mobile application so I need the Deep Linking method to work. I had a discussion with @3ph here and was suggested to discuss with @RootSoft

This is the screenshot of the error