Individual mutation requests error

Question

Hello, quick question regarding the error handling for tRPC

So I'm creating kind of a chatroom where I use a combination of tRPC and Pusher to send and receive messages. I'm currently stuck though when sending multiple messages (where I'm assuming they get batched in some sort of way) and then one of the requests fails for something like ratelimiting which I will display as first send and then an error.

However, multiple of the other messages that get batched together are never gets their response, leaving them in an infinite sending state (see screenshot below)

Just wondering how I should handle when sending larger amounts of messages like this and/if im doing anything wrong on my end?

I will attach a code snippet below too (I know it's a clusterfuck, just dw abt it):

client:
setLocalMessages((prev) = [...prev, tempChat]);

...

_sendChat(
                { chatId, message: msg, image: img ?? undefined },
                {
                    onSuccess(data) {
                        setLocalMessages((prev) =
                            [...prev, data].filter((msg) = msg.id !== tempId),
                        );
                    },
                    onError(err) {
                        setLocalMessages((prev) =
                            prev.map((msg) = {
                                if (msg.id === tempId)
                                    return {
                                        ...msg,
                                        status: "failed",
                                        error:
                                            err.data?.code ===
                                            "TOOMANYREQUESTS"
                                                ? "You are sending too many messages."
                                                : "Failed to send message",
                                    };
                                return msg;
                            }),
                        );
                    },
                },
            );

server:
const { chatId, message, image } = input;
            
            if (
                !(
                    await ctx.ratelimits.chat.send.regular.limit(
                        ctx.session.user.id,
                    )
                ).success
            )
                throw new TRPCError({
                    code: "TOOMANYREQUESTS",
                    message: "You are sending messages too fast.",
                    cause: "You are sending messages too fast.",
                });

const chat = await ctx.prisma.chat.findUnique({
                ...
            });

if (!chat)
                throw new TRPCError({
                    code: "NOT_FOUND",
                    message: "You are not a member of any chats by that ID.",
                    cause: "The chat ID is invalid or you are not a member of the chat.",
                });

...

try {
                await pusherServer.trigger(
                    [chat-${newMessage.chatId}, ...chat.participantIds],
                    "new-message",
                    ctx.session.user.id,
                );
            } catch (err) {
                console.error(err);
            }
`

Individual mutation requests error

Looking for more? Join the community!