From af4ba413316c1e43367b206d733accea35b3e4c0 Mon Sep 17 00:00:00 2001 From: gabriellsh Date: Wed, 11 Oct 2023 11:21:20 -0300 Subject: [PATCH 1/5] Debounce refetch and optimally update message --- .../Threads/hooks/useThreadMainMessageQuery.ts | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts index 8b3bef03f793..84b2272c5f62 100644 --- a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts +++ b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts @@ -5,9 +5,10 @@ import type { UseQueryResult } from '@tanstack/react-query'; import { useQueryClient, useQuery } from '@tanstack/react-query'; import { useCallback, useEffect, useRef } from 'react'; +import { withDebouncing } from '../../../../../../lib/utils/highOrderFunctions'; import type { FieldExpression, Query } from '../../../../../lib/minimongo'; import { createFilterFromQuery } from '../../../../../lib/minimongo'; -import { onClientMessageReceived } from '../../../../../lib/onClientMessageReceived'; +// import { onClientMessageReceived } from '../../../../../lib/onClientMessageReceived'; import { useRoom } from '../../../contexts/RoomContext'; import { useGetMessageByID } from './useGetMessageByID'; @@ -87,19 +88,22 @@ export const useThreadMainMessageQuery = ( }, [tmid]); return useQuery(['rooms', room._id, 'threads', tmid, 'main-message'] as const, async ({ queryKey }) => { - const message = await getMessage(tmid); + const mainMessage = await getMessage(tmid); - const mainMessage = (await onClientMessageReceived(message)) || message; - - if (!mainMessage && !isThreadMainMessage(mainMessage)) { + if (!mainMessage || !isThreadMainMessage(mainMessage)) { throw new Error('Invalid main message'); } + const debouncedInvalidate = withDebouncing({ wait: 10000 })(() => { + queryClient.invalidateQueries(queryKey, { exact: true }); + }); + unsubscribeRef.current = unsubscribeRef.current || subscribeToMessage(mainMessage, { - onMutate: () => { - queryClient.invalidateQueries(queryKey, { exact: true }); + onMutate: (message) => { + queryClient.setQueryData(queryKey, () => message); + debouncedInvalidate(); }, onDelete: () => { onDelete?.(); From 6828c0c3a291fb18cdae49e153980f4a234bc15c Mon Sep 17 00:00:00 2001 From: gabriellsh <40830821+gabriellsh@users.noreply.github.com> Date: Wed, 11 Oct 2023 11:23:56 -0300 Subject: [PATCH 2/5] add cs --- .changeset/cool-zoos-move.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/cool-zoos-move.md diff --git a/.changeset/cool-zoos-move.md b/.changeset/cool-zoos-move.md new file mode 100644 index 000000000000..dda6fbe2b02e --- /dev/null +++ b/.changeset/cool-zoos-move.md @@ -0,0 +1,5 @@ +--- +"@rocket.chat/meteor": patch +--- + +fixed threads breaking when sending messages too fast From 24003b3288946a13280e7689725e2b0a109858f2 Mon Sep 17 00:00:00 2001 From: gabriellsh Date: Wed, 11 Oct 2023 11:31:33 -0300 Subject: [PATCH 3/5] Remove comment --- .../contextualBar/Threads/hooks/useThreadMainMessageQuery.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts index 84b2272c5f62..6c86c038cb17 100644 --- a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts +++ b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts @@ -8,7 +8,6 @@ import { useCallback, useEffect, useRef } from 'react'; import { withDebouncing } from '../../../../../../lib/utils/highOrderFunctions'; import type { FieldExpression, Query } from '../../../../../lib/minimongo'; import { createFilterFromQuery } from '../../../../../lib/minimongo'; -// import { onClientMessageReceived } from '../../../../../lib/onClientMessageReceived'; import { useRoom } from '../../../contexts/RoomContext'; import { useGetMessageByID } from './useGetMessageByID'; From 2f00cda6cc5ffb1f55c2328a90394066b2af33fd Mon Sep 17 00:00:00 2001 From: gabriellsh Date: Wed, 11 Oct 2023 12:34:35 -0300 Subject: [PATCH 4/5] remove check --- .../contextualBar/Threads/hooks/useThreadMainMessageQuery.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts index 6c86c038cb17..f191ce2776b9 100644 --- a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts +++ b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts @@ -89,7 +89,7 @@ export const useThreadMainMessageQuery = ( return useQuery(['rooms', room._id, 'threads', tmid, 'main-message'] as const, async ({ queryKey }) => { const mainMessage = await getMessage(tmid); - if (!mainMessage || !isThreadMainMessage(mainMessage)) { + if (!mainMessage) { throw new Error('Invalid main message'); } From 41e6389f6d84bfdfed55a8da9d082cf9e2a2e781 Mon Sep 17 00:00:00 2001 From: yash-rajpal Date: Thu, 12 Oct 2023 19:35:18 +0530 Subject: [PATCH 5/5] remove unused import --- .../contextualBar/Threads/hooks/useThreadMainMessageQuery.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts index f191ce2776b9..aca714549cf1 100644 --- a/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts +++ b/apps/meteor/client/views/room/contextualBar/Threads/hooks/useThreadMainMessageQuery.ts @@ -1,4 +1,3 @@ -import { isThreadMainMessage } from '@rocket.chat/core-typings'; import type { IMessage, IThreadMainMessage } from '@rocket.chat/core-typings'; import { useStream } from '@rocket.chat/ui-contexts'; import type { UseQueryResult } from '@tanstack/react-query';