Add a pinned message badge under a pinned message (#118)

* Add pinned message badge for Modern Layout

* Add Bubble layout support

* Add thread support

* Add irc support

* Rename event tile badges

* Don't render footer when there is no reactions

* Add a test for `PinnedMessageBadge.tsx`

* Add a test in EventTile-test.tsx

* Add e2e test
This commit is contained in:
Florian Duros 2024-10-04 09:11:37 +02:00 committed by GitHub
parent 2dbaf00e71
commit 70418f8f3d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 189 additions and 11 deletions

View file

@ -0,0 +1,19 @@
/*
* Copyright 2024 New Vector Ltd.
*
* SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
* Please see LICENSE files in the repository root for full details.
*
*/
import React from "react";
import { render } from "@testing-library/react";
import { PinnedMessageBadge } from "../../../../src/components/views/messages/PinnedMessageBadge.tsx";
describe("PinnedMessageBadge", () => {
it("should render", () => {
const { asFragment } = render(<PinnedMessageBadge />);
expect(asFragment()).toMatchSnapshot();
});
});

View file

@ -0,0 +1,14 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`PinnedMessageBadge should render 1`] = `
<DocumentFragment>
<div
class="mx_PinnedMessageBadge"
>
<div
width="16"
/>
Pinned message
</div>
</DocumentFragment>
`;

View file

@ -32,6 +32,8 @@ import DMRoomMap from "../../../../src/utils/DMRoomMap";
import dis from "../../../../src/dispatcher/dispatcher";
import { Action } from "../../../../src/dispatcher/actions";
import { IRoomState } from "../../../../src/components/structures/RoomView";
import PinningUtils from "../../../../src/utils/PinningUtils";
import { Layout } from "../../../../src/settings/enums/Layout";
describe("EventTile", () => {
const ROOM_ID = "!roomId:example.org";
@ -91,6 +93,10 @@ describe("EventTile", () => {
});
});
afterEach(() => {
jest.spyOn(PinningUtils, "isPinned").mockReturnValue(false);
});
describe("EventTile thread summary", () => {
beforeEach(() => {
jest.spyOn(client, "supportsThreads").mockReturnValue(true);
@ -154,6 +160,27 @@ describe("EventTile", () => {
});
});
describe("EventTile renderingType: Threads", () => {
it("should display the pinned message badge", async () => {
jest.spyOn(PinningUtils, "isPinned").mockReturnValue(true);
getComponent({}, TimelineRenderingType.Thread);
expect(screen.getByText("Pinned message")).toBeInTheDocument();
});
});
describe("EventTile renderingType: default", () => {
it.each([[Layout.Group], [Layout.Bubble], [Layout.IRC]])(
"should display the pinned message badge",
async (layout) => {
jest.spyOn(PinningUtils, "isPinned").mockReturnValue(true);
getComponent({ layout });
expect(screen.getByText("Pinned message")).toBeInTheDocument();
},
);
});
describe("EventTile in the right panel", () => {
beforeAll(() => {
const dmRoomMap: DMRoomMap = {