"Ae.sourceAccount is not a function" when deleting multiple offer operations in single transaction

Question

Basically deleting multiple offers with manageSellOffer operations is causing the error "Ae.sourceAccount is not a function"

All other transactions are functional using my transactionBuilder method and single deletions worked also before I refactored to an array of these operations.

deleteOffers(offers: IOffer[]): Observable<any> {
    if (!offers?.length) return of();
    let operations = [];

    // 1. create delete operations for each offer
    for ( let i = 0, j = offers.length; i < j; i++ ) {    
        if (!offers[i].offerId) return of('Cancelled: bad offer params');

        const bigOptsPrice = offers[i]?.price ? new BigNumber(offers[i].price).toPrecision(15) : undefined;
        const sdkPrice = bigOptsPrice? new BigNumber(bigOptsPrice) : undefined;

        const params = {
            offerId: offers[i]?.offerId,
            ...(offers[i]?.buying && { buying: this.assetsService.createAsset(offers[i]?.buying) }),
            ...(offers[i]?.selling && { selling: this.assetsService.createAsset(offers[i]?.selling) }),
            ...(sdkPrice && { price: String(sdkPrice) }),
            amount: '0' // amount: '0' deletes an offer
        };

        operations.push(StellarSdk.Operation.manageSellOffer(params));
    }
    
    // 2. create the transaction - ready to be built
    let tx = this.transactionBuilder([operations], this.offerMemo());
    // 3. submit the transaction
    return this.submitTransaction(tx);
}

transactionBuilder(operations: any[], memo?: string, timeout: number = 180): any {
    let tx = new StellarSdk.TransactionBuilder(this.account$.getValue(), { 
        'fee': StellarSdk.BASE_FEE, 
        'networkPassphrase': environment.network_pass
        // ...(memo && { 'memo': memo }),
    });

    tx.setTimeout(timeout);

    operations.forEach(op => {
        tx.addOperation(op);
    });

    return tx.build(); <-- ERROR HAPPENS HERE
}

Deleting offers causes

core.mjs:7635 ERROR TypeError: Ae.sourceAccount is not a function
    at Function.value (operation.js:169:21)
    at transaction.js:148:35
    at i (_arrayMap.js:16:21)
    at e (map.js:49:47)
    at new D (transaction.js:147:35)
    at H.value (transaction_builder.js:567:16)
    at E.transactionBuilder (stellar-sdk.service.ts:620:19)
    at E.deleteOffers (stellar-sdk.service.ts:577:23)
    at o.deleteOffers (path-payment.component.ts:561:32)
    at o.resetHop (path-payment.component.ts:332:18)

Answer 1

It's difficult to test it out without a living test version of the issue but checking at the code I see this:

// 2. create the transaction - ready to be built
let tx = this.transactionBuilder([operations], this.offerMemo());

There you are passing an array inside of an array, later in the transactionBuilder method you are doing this:

operations.forEach(op => {
  tx.addOperation(op);
});

This means you are not actually adding the correct operations to the array of the transaction and could be giving some issues when the tx is being built (maybe that doesn't bring any issue but it's possible).