Extract Extensions into their own right panel tab (#12844)

* Extract useIsVideoRoom hook

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move useWidgets hook to WidgetUtils

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Extract Extensions into their own right panel tab

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove unused components & classes

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

playwright/e2e/integration-manager/utils.ts

@@ -19,8 +19,6 @@ import type { ElementAppPage } from "../../pages/ElementAppPage";
 export async function openIntegrationManager(app: ElementAppPage) {
     const { page } = app;
     await app.toggleRoomInfoPanel();
-    await page
-        .locator(".mx_RoomSummaryCard_appsGroup")
-        .getByRole("button", { name: "Add widgets, bridges & bots" })
-        .click();
+    await page.getByRole("tab", { name: "Extensions" }).click();
+    await page.getByRole("button", { name: "Add extensions" }).click();
 }

playwright/e2e/right-panel/right-panel.spec.ts

@@ -73,7 +73,8 @@ test.describe("RightPanel", () => {
         test("should handle clicking add widgets", async ({ page, app }) => {
             await viewRoomSummaryByName(page, app, ROOM_NAME);
 
-            await page.getByRole("button", { name: "Add widgets, bridges & bots" }).click();
+            await page.getByRole("tab", { name: "Extensions" }).click();
+            await page.getByRole("button", { name: "Add extensions" }).click();
             await expect(page.locator(".mx_IntegrationManager")).toBeVisible();
         });