Skip to content

Commit 66897a8

Browse files
aleksandernsilvaaleksandernsilva
committed
fix: thread jump to message changes main channel scroll position
1 parent 39f2e87 commit 66897a8

File tree

6 files changed

+82
-19
lines changed

6 files changed

+82
-19
lines changed

‎apps/meteor/app/ui-utils/client/lib/RoomHistoryManager.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -309,7 +309,7 @@ class RoomHistoryManagerClass extends Emitter {
309309
const room = this.getRoom(message.rid);
310310

311311
const subscription = Subscriptions.state.find((record) => record.rid === message.rid);
312-
const result = await callWithErrorHandling('loadSurroundingMessages', message, defaultLimit);
312+
const result = await callWithErrorHandling('loadSurroundingMessages', message, defaultLimit, false);
313313

314314
this.clear(message.rid);
315315

‎apps/meteor/client/lib/utils/legacyJumpToMessage.ts‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { IMessage } from '@rocket.chat/core-typings';
22
import { isThreadMessage } from '@rocket.chat/core-typings';
3+
// import { flushSync } from 'react-dom';
34

45
import { goToRoomById } from './goToRoomById';
56
import { RoomHistoryManager } from '../../../app/ui-utils/client';
@@ -19,7 +20,14 @@ export const legacyJumpToMessage = async (message: IMessage) => {
1920
routeParamsOverrides: { tab: 'thread', context: message.tmid || message._id },
2021
replace: RoomManager.opened === message.rid,
2122
});
22-
await RoomHistoryManager.getSurroundingMessages(message);
23+
24+
if (message.tcount) {
25+
await RoomHistoryManager.getSurroundingMessages(message);
26+
} else if (!RoomHistoryManager.isLoaded(message.rid)) {
27+
// Load room history if room is not loaded
28+
await RoomHistoryManager.getMore(message.rid);
29+
}
30+
2331
return;
2432
}
2533

‎apps/meteor/client/views/room/body/hooks/useGetMore.ts‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -25,32 +25,36 @@ export const useGetMore = (rid: string, atBottomRef: MutableRefObject<boolean>)
2525
return;
2626
}
2727

28-
const { scrollTop, clientHeight, scrollHeight } = getBoundingClientRect(element);
28+
if (jumpToRef.current) {
29+
return;
30+
}
31+
32+
if (RoomHistoryManager.isLoading(rid)) {
33+
return;
34+
}
2935

3036
if (msgIdRef.current && !RoomHistoryManager.isLoaded(rid)) {
3137
return;
3238
}
3339

40+
const { scrollTop, clientHeight, scrollHeight } = getBoundingClientRect(element);
41+
3442
const lastScrollTopRef = scrollTop;
3543
const height = clientHeight;
36-
const isLoading = RoomHistoryManager.isLoading(rid);
3744
const hasMore = RoomHistoryManager.hasMore(rid);
3845
const hasMoreNext = RoomHistoryManager.hasMoreNext(rid);
3946

40-
if (jumpToRef.current) {
41-
return;
42-
}
43-
44-
if (isLoading) {
45-
return;
46-
}
47-
4847
if (hasMore === true && lastScrollTopRef <= height / 3) {
4948
await RoomHistoryManager.getMore(rid);
5049

5150
if (jumpToRef.current) {
5251
return;
5352
}
53+
54+
if (!element.isConnected) {
55+
return;
56+
}
57+
5458
flushSync(() => {
5559
RoomHistoryManager.restoreScroll(rid);
5660
});

‎apps/meteor/server/methods/loadSurroundingMessages.ts‎

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ declare module '@rocket.chat/ddp-client' {
1414
loadSurroundingMessages(
1515
message: Pick<IMessage, '_id' | 'rid'> & { ts?: Date },
1616
limit?: number,
17+
showThreadMessages?: boolean,
1718
):
1819
| {
1920
messages: IMessage[];
@@ -25,7 +26,7 @@ declare module '@rocket.chat/ddp-client' {
2526
}
2627

2728
Meteor.methods<ServerMethods>({
28-
async loadSurroundingMessages(message, limit = 50) {
29+
async loadSurroundingMessages(message, limit = 50, showThreadMessages = true) {
2930
check(message, Object);
3031
check(limit, Number);
3132

@@ -60,7 +61,12 @@ Meteor.methods<ServerMethods>({
6061
limit: Math.ceil(limit / 2),
6162
};
6263

63-
const messages = await Messages.findVisibleByRoomIdBeforeTimestamp(mainMessage.rid, mainMessage.ts, options).toArray();
64+
const messages = await Messages.findVisibleByRoomIdBeforeTimestamp(
65+
mainMessage.rid,
66+
mainMessage.ts,
67+
options,
68+
showThreadMessages,
69+
).toArray();
6470

6571
const moreBefore = messages.length === options.limit;
6672

@@ -72,7 +78,12 @@ Meteor.methods<ServerMethods>({
7278

7379
options.limit = Math.floor(limit / 2);
7480

75-
const afterMessages = await Messages.findVisibleByRoomIdAfterTimestamp(mainMessage.rid, mainMessage.ts, options).toArray();
81+
const afterMessages = await Messages.findVisibleByRoomIdAfterTimestamp(
82+
mainMessage.rid,
83+
mainMessage.ts,
84+
options,
85+
showThreadMessages,
86+
).toArray();
7687

7788
const moreAfter = afterMessages.length === options.limit;
7889

‎packages/model-typings/src/models/IMessagesModel.ts‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,12 @@ export interface IMessagesModel extends IBaseModel<IMessage> {
176176
users: string[],
177177
options?: FindOptions<IMessage>,
178178
): FindCursor<IMessage>;
179-
findVisibleByRoomIdAfterTimestamp(roomId: string, timestamp: Date, options?: FindOptions<IMessage>): FindCursor<IMessage>;
179+
findVisibleByRoomIdAfterTimestamp(
180+
roomId: string,
181+
timestamp: Date,
182+
options?: FindOptions<IMessage>,
183+
showThreadMessages?: boolean,
184+
): FindCursor<IMessage>;
180185
findVisibleByRoomIdBeforeTimestampNotContainingTypes(
181186
roomId: string,
182187
timestamp: Date,
@@ -203,7 +208,12 @@ export interface IMessagesModel extends IBaseModel<IMessage> {
203208
showThreadMessages?: boolean,
204209
inclusive?: boolean,
205210
): Promise<number>;
206-
findVisibleByRoomIdBeforeTimestamp(roomId: string, timestamp: Date, options?: FindOptions<IMessage>): FindCursor<IMessage>;
211+
findVisibleByRoomIdBeforeTimestamp(
212+
roomId: string,
213+
timestamp: Date,
214+
options?: FindOptions<IMessage>,
215+
showThreadMessages?: boolean,
216+
): FindCursor<IMessage>;
207217
getLastTimestamp(options?: FindOptions<IMessage>): Promise<Date | undefined>;
208218
findOneBySlackBotIdAndSlackTs(slackBotId: string, slackTs: Date): Promise<IMessage | null>;
209219
findByRoomIdAndMessageIds(rid: string, messageIds: string[], options?: FindOptions<IMessage>): FindCursor<IMessage>;

‎packages/models/src/models/Messages.ts‎

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -889,7 +889,12 @@ export class MessagesRaw extends BaseRaw<IMessage> implements IMessagesModel {
889889
return this.find(query, options);
890890
}
891891

892-
findVisibleByRoomIdAfterTimestamp(roomId: string, timestamp: Date, options?: FindOptions<IMessage>): FindCursor<IMessage> {
892+
findVisibleByRoomIdAfterTimestamp(
893+
roomId: string,
894+
timestamp: Date,
895+
options?: FindOptions<IMessage>,
896+
showThreadMessages = true,
897+
): FindCursor<IMessage> {
893898
const query = {
894899
_hidden: {
895900
$ne: true,
@@ -898,6 +903,16 @@ export class MessagesRaw extends BaseRaw<IMessage> implements IMessagesModel {
898903
ts: {
899904
$gt: timestamp,
900905
},
906+
...(!showThreadMessages && {
907+
$or: [
908+
{
909+
tmid: { $exists: false },
910+
},
911+
{
912+
tshow: true,
913+
},
914+
],
915+
}),
901916
};
902917

903918
return this.find(query, options);
@@ -913,7 +928,12 @@ export class MessagesRaw extends BaseRaw<IMessage> implements IMessagesModel {
913928
return this.find(query, options);
914929
}
915930

916-
findVisibleByRoomIdBeforeTimestamp(roomId: string, timestamp: Date, options?: FindOptions<IMessage>): FindCursor<IMessage> {
931+
findVisibleByRoomIdBeforeTimestamp(
932+
roomId: string,
933+
timestamp: Date,
934+
options?: FindOptions<IMessage>,
935+
showThreadMessages = true,
936+
): FindCursor<IMessage> {
917937
const query = {
918938
_hidden: {
919939
$ne: true,
@@ -922,6 +942,16 @@ export class MessagesRaw extends BaseRaw<IMessage> implements IMessagesModel {
922942
ts: {
923943
$lt: timestamp,
924944
},
945+
...(!showThreadMessages && {
946+
$or: [
947+
{
948+
tmid: { $exists: false },
949+
},
950+
{
951+
tshow: true,
952+
},
953+
],
954+
}),
925955
};
926956

927957
return this.find(query, options);

0 commit comments

Comments
 (0)