Fix 'my threads' filtering to include participated threads (#7882)

* move js utils into directory Signed-off-by: Kerry Archibald <kerrya@element.io> * typescripterize js test-utils Signed-off-by: Kerry Archibald <kerrya@element.io> * move test utils to directory Signed-off-by: Kerry Archibald <kerrya@element.io> * move remaining mock functions to directory Signed-off-by: Kerry Archibald <kerrya@element.io> * update imports Signed-off-by: Kerry Archibald <kerrya@element.io> * missed copyright Signed-off-by: Kerry Archibald <kerrya@element.io> * threads test helpers Signed-off-by: Kerry Archibald <kerrya@element.io> * forgotten copyright Signed-off-by: Kerry Archibald <kerrya@element.io> * comments Signed-off-by: Kerry Archibald <kerrya@element.io> * fix threads helper unsigned Signed-off-by: Kerry Archibald <kerrya@element.io> * test filter creation when thread capabilities enabled Signed-off-by: Kerry Archibald <kerrya@element.io>
2024-11-26 11:15:53 +03:00 · 2022-02-24 09:44:34 +01:00 · 2022-02-24 09:44:34 +01:00 · 889b0cebb2
commit 889b0cebb2
parent 81cda7c749
3 changed files with 135 additions and 14 deletions
--- a/src/components/structures/ThreadPanel.tsx
+++ b/src/components/structures/ThreadPanel.tsx
@ -39,7 +39,7 @@ import { Layout } from '../../settings/enums/Layout';
 import { RoomPermalinkCreator } from '../../utils/permalinks/Permalinks';
 import Measured from '../views/elements/Measured';

-async function getThreadTimelineSet(
+export async function getThreadTimelineSet(
    client: MatrixClient,
    room: Room,
    filterType = ThreadFilterType.All,
@ -89,14 +89,12 @@ async function getThreadTimelineSet(
        Array.from(room.threads)
            .sort(([, threadA], [, threadB]) => threadA.replyToEvent.getTs() - threadB.replyToEvent.getTs())
            .forEach(([, thread]) => {
-                const isOwnEvent = thread.rootEvent.getSender() === client.getUserId();
-                if (filterType !== ThreadFilterType.My || isOwnEvent) {
+                const currentUserParticipated = thread.events.some(event => event.getSender() === client.getUserId());
+                if (filterType !== ThreadFilterType.My || currentUserParticipated) {
                    timelineSet.getLiveTimeline().addEvent(thread.rootEvent, false);
                }
            });

-        // for (const [, thread] of room.threads) {
-        // }
        return timelineSet;
    }
 }
--- a/test/components/structures/ThreadPanel-test.tsx
+++ b/test/components/structures/ThreadPanel-test.tsx
@ -16,22 +16,33 @@ limitations under the License.

 import React from 'react';
 import { shallow, mount } from "enzyme";
+import {
+    MatrixClient,
+    RelationType,
+    Room,
+    UNSTABLE_FILTER_RELATION_SENDERS,
+    UNSTABLE_FILTER_RELATION_TYPES,
+} from 'matrix-js-sdk';
+import { mocked } from 'jest-mock';
 import '../../skinned-sdk';

 import {
    ThreadFilterType,
    ThreadPanelHeader,
    ThreadPanelHeaderFilterOptionItem,
+    getThreadTimelineSet,
 } from '../../../src/components/structures/ThreadPanel';
 import { ContextMenuButton } from '../../../src/accessibility/context_menu/ContextMenuButton';
 import ContextMenu from '../../../src/components/structures/ContextMenu';
 import { _t } from '../../../src/languageHandler';
+import { makeThread } from '../../test-utils/threads';

 describe('ThreadPanel', () => {
    describe('Header', () => {
        it('expect that All filter for ThreadPanelHeader properly renders Show: All threads', () => {
            const wrapper = shallow(
                <ThreadPanelHeader
+                    empty={false}
                    filterOption={ThreadFilterType.All}
                    setFilterOption={() => undefined} />,
            );
@ -41,6 +52,7 @@ describe('ThreadPanel', () => {
        it('expect that My filter for ThreadPanelHeader properly renders Show: My threads', () => {
            const wrapper = shallow(
                <ThreadPanelHeader
+                    empty={false}
                    filterOption={ThreadFilterType.My}
                    setFilterOption={() => undefined} />,
            );
@ -50,6 +62,7 @@ describe('ThreadPanel', () => {
        it('expect that ThreadPanelHeader properly opens a context menu when clicked on the button', () => {
            const wrapper = mount(
                <ThreadPanelHeader
+                    empty={false}
                    filterOption={ThreadFilterType.All}
                    setFilterOption={() => undefined} />,
            );
@ -64,6 +77,7 @@ describe('ThreadPanel', () => {
        it('expect that ThreadPanelHeader has the correct option selected in the context menu', () => {
            const wrapper = mount(
                <ThreadPanelHeader
+                    empty={false}
                    filterOption={ThreadFilterType.All}
                    setFilterOption={() => undefined} />,
            );
@ -75,4 +89,110 @@ describe('ThreadPanel', () => {
            expect(foundButton).toMatchSnapshot();
        });
    });
+
+    describe('getThreadTimelineSet()', () => {
+        const filterId = '123';
+        const client = {
+            getUserId: jest.fn(),
+            getCapabilities: jest.fn().mockResolvedValue({}),
+            decryptEventIfNeeded: jest.fn().mockResolvedValue(undefined),
+            getOrCreateFilter: jest.fn().mockResolvedValue(filterId),
+            paginateEventTimeline: jest.fn().mockResolvedValue(undefined),
+        } as unknown as MatrixClient;
+
+        const aliceId = '@alice:server.org';
+        const bobId = '@bob:server.org';
+        const charlieId = '@charlie:server.org';
+        const room = new Room('!room1:server.org', client, aliceId);
+
+        const roomWithThreads = new Room('!room2:server.org', client, aliceId);
+        const aliceAndBobThread = makeThread(client, roomWithThreads, {
+            authorId: aliceId,
+            participantUserIds: [aliceId, bobId],
+            roomId: roomWithThreads.roomId,
+        });
+        const justBobThread = makeThread(client, roomWithThreads, {
+            authorId: bobId,
+            participantUserIds: [bobId],
+            roomId: roomWithThreads.roomId,
+        });
+        const everyoneThread = makeThread(client, roomWithThreads, {
+            authorId: charlieId,
+            participantUserIds: [aliceId, bobId, charlieId],
+            length: 5,
+            roomId: roomWithThreads.roomId,
+        });
+        roomWithThreads.threads.set(aliceAndBobThread.id, aliceAndBobThread);
+        roomWithThreads.threads.set(justBobThread.id, justBobThread);
+        roomWithThreads.threads.set(everyoneThread.id, everyoneThread);
+
+        beforeEach(() => {
+            mocked(client.getUserId).mockReturnValue(aliceId);
+            mocked(client.getCapabilities).mockResolvedValue({});
+        });
+
+        describe('when extra capabilities are not enabled on server', () => {
+            it('returns an empty timelineset when room has no threads', async () => {
+                const result = await getThreadTimelineSet(client, room);
+
+                expect(result.getLiveTimeline().getEvents()).toEqual([]);
+            });
+
+            it('returns a timelineset with thread root events for room when filter is All', async () => {
+                const result = await getThreadTimelineSet(client, roomWithThreads);
+
+                const resultEvents = result.getLiveTimeline().getEvents();
+                expect(resultEvents.length).toEqual(3);
+                expect(resultEvents).toEqual(expect.arrayContaining([
+                    justBobThread.rootEvent,
+                    aliceAndBobThread.rootEvent,
+                    everyoneThread.rootEvent,
+                ]));
+            });
+
+            it('returns a timelineset with threads user has participated in when filter is My', async () => {
+                // current user is alice
+                mocked(client).getUserId.mockReturnValue(aliceId);
+
+                const result = await getThreadTimelineSet(client, roomWithThreads, ThreadFilterType.My);
+                const resultEvents = result.getLiveTimeline().getEvents();
+                expect(resultEvents).toEqual(expect.arrayContaining([
+                    // alice authored root event
+                    aliceAndBobThread.rootEvent,
+                    // alive replied to this thread
+                    everyoneThread.rootEvent,
+                ]));
+            });
+        });
+
+        describe('when extra capabilities are enabled on server', () => {
+            beforeEach(() => {
+                jest.clearAllMocks();
+                mocked(client.getCapabilities).mockResolvedValue({
+                    ['io.element.thread']: { enabled: true },
+                });
+            });
+
+            it('creates a filter with correct definition when filterType is All', async () => {
+                await getThreadTimelineSet(client, room);
+
+                const [filterKey, filter] = mocked(client).getOrCreateFilter.mock.calls[0];
+                expect(filterKey).toEqual(`THREAD_PANEL_${room.roomId}_${ThreadFilterType.All}`);
+                expect(filter.getDefinition().room.timeline).toEqual({
+                    [UNSTABLE_FILTER_RELATION_TYPES.name]: [RelationType.Thread],
+                });
+            });
+
+            it('creates a filter with correct definition when filterType is My', async () => {
+                await getThreadTimelineSet(client, room, ThreadFilterType.My);
+
+                const [filterKey, filter] = mocked(client).getOrCreateFilter.mock.calls[0];
+                expect(filterKey).toEqual(`THREAD_PANEL_${room.roomId}_${ThreadFilterType.My}`);
+                expect(filter.getDefinition().room.timeline).toEqual({
+                    [UNSTABLE_FILTER_RELATION_TYPES.name]: [RelationType.Thread],
+                    [UNSTABLE_FILTER_RELATION_SENDERS.name]: [aliceId],
+                });
+            });
+        });
+    });
 });
--- a/test/test-utils/threads.ts
+++ b/test/test-utils/threads.ts
@ -1,4 +1,3 @@
-
 /*
 Copyright 2022 The Matrix.org Foundation C.I.C.

@ -15,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */

-import { IUnsigned, MatrixClient, MatrixEvent, Room } from "matrix-js-sdk";
+import { MatrixClient, MatrixEvent, RelationType, Room } from "matrix-js-sdk";
 import { Thread } from "matrix-js-sdk/src/models/thread";

 import { mkMessage, MessageEventProps } from "./test-utils";
@ -26,7 +25,7 @@ export const makeThreadEvent = ({ rootEventId, replyToEventId, ...props }: Messa
    ...props,
    relatesTo: {
        event_id: rootEventId,
-        rel_type: "io.element.thread",
+        rel_type: RelationType.Thread,
        ['m.in_reply_to']: {
            event_id: replyToEventId,
        },
@ -50,12 +49,12 @@ type MakeThreadEventsProps = {

 export const makeThreadEvents = ({
    roomId, authorId, participantUserIds, length = 2, ts = 1, currentUserId,
-}): { rootEvent: MatrixEvent, events: MatrixEvent[] } => {
+}: MakeThreadEventsProps): { rootEvent: MatrixEvent, events: MatrixEvent[] } => {
    const rootEvent = mkMessage({
        user: authorId,
        event: true,
        room: roomId,
-        msg: 'root event message',
+        msg: 'root event message ' + Math.random(),
        ts,
    });

@ -79,10 +78,14 @@ export const makeThreadEvents = ({
    }

    rootEvent.setUnsigned({
-        latest_event: events[events.length - 1],
-        count: length,
-        current_user_participated: [...participantUserIds, authorId].includes(currentUserId),
-    } as IUnsigned);
+        "m.relations": {
+            [RelationType.Thread]: {
+                latest_event: events[events.length - 1],
+                count: length,
+                current_user_participated: [...participantUserIds, authorId].includes(currentUserId),
+            },
+        },
+    });

    return { rootEvent, events };
 };