diff --git a/res/css/views/rooms/_PinnedEventTile.pcss b/res/css/views/rooms/_PinnedEventTile.pcss index b42de75649..b37e3724fc 100644 --- a/res/css/views/rooms/_PinnedEventTile.pcss +++ b/res/css/views/rooms/_PinnedEventTile.pcss @@ -37,5 +37,28 @@ limitations under the License. white-space: nowrap; } } + + .mx_PinnedEventTile_thread { + display: flex; + gap: var(--cpd-space-2x); + font: var(--cpd-font-body-sm-regular); + + svg { + width: 20px; + fill: var(--cpd-color-icon-tertiary); + } + + span { + display: flex; + color: var(--cpd-color-text-secondary); + } + + button { + background: transparent; + border: none; + cursor: pointer; + text-decoration: underline; + } + } } } diff --git a/src/components/views/rooms/PinnedEventTile.tsx b/src/components/views/rooms/PinnedEventTile.tsx index 5252e5124d..5fb9c07f45 100644 --- a/src/components/views/rooms/PinnedEventTile.tsx +++ b/src/components/views/rooms/PinnedEventTile.tsx @@ -23,6 +23,7 @@ import { Icon as UnpinIcon } from "@vector-im/compound-design-tokens/icons/unpin import { Icon as ForwardIcon } from "@vector-im/compound-design-tokens/icons/forward.svg"; import { Icon as TriggerIcon } from "@vector-im/compound-design-tokens/icons/overflow-horizontal.svg"; import { Icon as DeleteIcon } from "@vector-im/compound-design-tokens/icons/delete.svg"; +import { Icon as ThreadIcon } from "@vector-im/compound-design-tokens/icons/threads.svg"; import classNames from "classnames"; import dis from "../../../dispatcher/dispatcher"; @@ -39,6 +40,7 @@ import { isContentActionable } from "../../../utils/EventUtils"; import { getForwardableEvent } from "../../../events"; import { OpenForwardDialogPayload } from "../../../dispatcher/payloads/OpenForwardDialogPayload"; import { createRedactEventDialog } from "../dialogs/ConfirmRedactDialog"; +import { ShowThreadPayload } from "../../../dispatcher/payloads/ShowThreadPayload"; const AVATAR_SIZE = "32px"; @@ -69,6 +71,9 @@ export function PinnedEventTile({ event, room, permalinkCreator }: PinnedEventTi throw new Error("Pinned event unexpectedly has no sender"); } + const isInThread = Boolean(event.threadRootId); + const displayThreadInfo = !event.isThreadRoot && isInThread; + return (