Issues using setData(id, newData) from trpc.useContext() -> typescript not accepting string as input

Question

Currently exerciseId flagged on line with // Typescript Error isn't being accepted, resulting in the following Typescript Error:

Argument of type 'string' is not assignable to parameter of type 'Updater<"" | ExerciseWithFavourited | null | undefined, "" | ExerciseWithFavourited | null | undefined>'.ts(2345)

  const favouriteMutation = trpc.exercise.favourite.useMutation({
    onMutate: async (exerciseId) => {
      // stop any outgoing refetches (so they don't overwrite our optimistic update)
      await utils.exercise.getById.cancel(exerciseId);

      // get snapshot of current value
      const origExercise = utils.exercise.getById.getData(exerciseId);

      // modify cache to reflect optimistic update
      utils.exercise.getById.setData(exerciseId, { // Typescript Error
        ...origExercise,
        favourited: origExercise && !origExercise?.favourited
      });

    },
    onSuccess: () => {
      utils.exercise.getById.invalidate();
    },
    onError: (err, exerciseId) => {
      utils.exercise.getById.refetch(exerciseId);
    }
  });

I'm pretty new to Typescript and tRPC, so could easily be making a silly mistake. Any help greatly appreciated. Thanks!

I've tried:

• Passing 'undefined' as the first parameter...
• Using a functional approach (orig) => {...orig, favourited: !orig.favourited}
• Reading through the tRPC examples (looks the same as what I'm doing) -> https://github.com/trpc/trpc/blob/main/packages/tests/server/react/setQueryData.test.tsx