useMutation from a component creates multiple ReRender

I have a problem that I want to update data based on a condition before a render and handle the render optimistically. I have never done this and don’t know how to solve it so this was my first solution.

My component recieves an array with transactions, that comes from a higher up component which queries the transactions.
Transactions can be scheduled or not. I send them to two other components after separating them.

However if a scheduled transactions should not be scheduled anyore I want to update it.

so before my render I have this little code:

	if (transactionsToUpdate.length >= 1) {
		try {
			updateScheduled({
				variables: {
					transactionIds: transactionsToUpdate,
					state: false,
				},
			});
		} catch (err) {
			console.error(err);
		}
	}

But if I do this I get 3 renders and sends 3 mutations to the backend, since I’m opmistially sending the data to the right components I would like not to do these rerender and graphql mutation calls more than once. But I’m not sure how to.