diff --git a/playwright/e2e/spaces/threads-activity-centre/threadsActivityCentre.spec.ts b/playwright/e2e/spaces/threads-activity-centre/threadsActivityCentre.spec.ts index 1b237c0b53..eb4d7c8df0 100644 --- a/playwright/e2e/spaces/threads-activity-centre/threadsActivityCentre.spec.ts +++ b/playwright/e2e/spaces/threads-activity-centre/threadsActivityCentre.spec.ts @@ -17,6 +17,7 @@ */ import { expect, test } from "."; +import { CommandOrControl } from "../../utils"; test.describe("Threads Activity Centre", () => { test.use({ @@ -118,4 +119,19 @@ test.describe("Threads Activity Centre", () => { ]); await expect(util.getTacPanel()).toMatchScreenshot("tac-panel-notification-unread.png"); }); + + test("should block the Spotlight to open when the TAC is opened", async ({ util, page }) => { + const toggleSpotlight = () => page.keyboard.press(`${CommandOrControl}+k`); + + // Sanity check + // Open and close the spotlight + await toggleSpotlight(); + await expect(page.locator(".mx_SpotlightDialog")).toBeVisible(); + await toggleSpotlight(); + + await util.openTac(); + // The spotlight should not be opened + await toggleSpotlight(); + await expect(page.locator(".mx_SpotlightDialog")).not.toBeVisible(); + }); }); diff --git a/res/css/structures/_ThreadsActivityCentre.pcss b/res/css/structures/_ThreadsActivityCentre.pcss index d803fd30e5..4f723700f2 100644 --- a/res/css/structures/_ThreadsActivityCentre.pcss +++ b/res/css/structures/_ThreadsActivityCentre.pcss @@ -16,6 +16,10 @@ * / */ +.mx_ThreadsActivityCentre_container { + display: flex; +} + .mx_ThreadsActivityCentreButton { border-radius: 8px; margin: 18px auto auto auto; diff --git a/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx b/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx index f6374ef32a..debf845164 100644 --- a/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx +++ b/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx @@ -32,6 +32,8 @@ import { useUnreadThreadRooms } from "./useUnreadThreadRooms"; import { StatelessNotificationBadge } from "../../rooms/NotificationBadge/StatelessNotificationBadge"; import { NotificationLevel } from "../../../../stores/notifications/NotificationLevel"; import PosthogTrackers from "../../../../PosthogTrackers"; +import { getKeyBindingsManager } from "../../../../KeyBindingsManager"; +import { KeyBindingAction } from "../../../../accessibility/KeyboardShortcuts"; interface ThreadsActivityCentreProps { /** @@ -49,41 +51,56 @@ export function ThreadsActivityCentre({ displayButtonLabel }: ThreadsActivityCen const roomsAndNotifications = useUnreadThreadRooms(open); return ( -