test(website): expect the plugin directory links after the announcement

PLUGINS_LINKED is now true, so the home page links /plugins from its header,
footer and plugins section. The test still asserted the pre-announcement state
and failed on main.

packages/app/e2e/browser/plugin-sidebar-items.spec.ts

@@ -241,6 +241,32 @@ test.describe("Plugin sidebar items", () => {
     });
   });
 
+  test("a plugin screen toggles the sidebar on a wide layout", async ({ page }) => {
+    await page.setViewportSize(WIDE);
+    await gotoWorkspace(page, workspaceId);
+    const row = headerRow(page, SHOWCASE_PLUGIN_ID, "deploys");
+    await expect(row).toBeVisible({ timeout: 30_000 });
+
+    await row.click();
+    await expect(page.getByText("Deploys screen body", { exact: true })).toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).not.toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).toBeVisible();
+    await closeScreen(page);
+
+    // With the sidebar closed elsewhere, the screen's own toggle is the way back to it.
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).not.toBeVisible();
+    await page.keyboard.press("Control+k");
+    const panel = page.getByTestId("command-center-panel");
+    await panel.getByTestId("command-center-input").fill("Open deploys");
+    await panel.getByRole("button", { name: "Open deploys", exact: true }).click();
+    await expect(page.getByText("Deploys screen body", { exact: true })).toBeVisible();
+    await visibleTestId(page, "menu-button").click();
+    await expect(row).toBeVisible();
+  });
+
   test("a header row's shortcut hint presses the row", async ({ page }) => {
     await page.setViewportSize(WIDE);
     await gotoWorkspace(page, workspaceId);

packages/app/src/plugins/surface-screen.tsx

@@ -7,6 +7,7 @@ import { Text, View } from "react-native";
 import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import { HeaderIconBadge } from "@/components/headers/header-icon-badge";
 import { HeaderToggleButton } from "@/components/headers/header-toggle-button";
+import { SidebarMenuToggle } from "@/components/headers/menu-header";
 import { ScreenHeader } from "@/components/headers/screen-header";
 import { ScreenTitle } from "@/components/headers/screen-title";
 import { HostFilter } from "@/components/hosts/host-filter";
@@ -177,6 +178,7 @@ export function PluginSurfaceScreen() {
   const headerLeft = useMemo(
     () => (
       <>
+        <SidebarMenuToggle />
         {Icon ? (
           <HeaderIconBadge>
             <ThemedPluginHeaderIcon Icon={Icon} uniProps={mutedColorMapping} />

packages/website/e2e/plugins.spec.ts

@@ -388,19 +388,18 @@ async function expectPageMetadata(page: Page, title: string, path: string) {
   );
 }
 
-test("keeps the directory unlinked until the coordinated announcement", async ({ page }) => {
+test("links the directory from the header, footer and plugins section", async ({ page }) => {
   await page.goto("/");
   await expect(
-    page.getByRole("banner").getByRole("link", { name: "Plugins", exact: true }),
-  ).toHaveCount(0);
+    page.locator("header").getByRole("link", { name: "Plugins", exact: true }),
+  ).toHaveAttribute("href", "/plugins");
   await expect(
-    page.getByRole("contentinfo").getByRole("link", { name: "Plugins", exact: true }),
-  ).toHaveCount(0);
+    page.locator("footer").getByRole("link", { name: "Plugins", exact: true }),
+  ).toHaveAttribute("href", "/plugins");
   await expect(page.getByRole("link", { name: "Browse plugins" })).toHaveAttribute(
     "href",
-    "https://paseo.cafe",
+    "/plugins",
   );
-  await expect(page.locator('a[href="/plugins"]')).toHaveCount(0);
   const response = await page.goto("/plugins");
   expect(response?.status()).toBe(200);
   await expect(page.getByRole("heading", { level: 1, name: /^Plugins/ })).toBeVisible();