Add user-owned IM channel connections

2026-06-11 01:45:58 +00:00 · 2026-06-10 21:07:44 +08:00
parent 0fb18e368c
commit dbe3a3bb0d
47 changed files with 4009 additions and 47 deletions
@@ -0,0 +1,77 @@
+import { expect, test, type Page } from "@playwright/test";
+
+import { mockLangGraphAPI } from "./utils/mock-api";
+
+function mockChannelsAPI(page: Page) {
+  void page.route("**/api/channels/providers", (route) => {
+    return route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify({
+        enabled: true,
+        providers: [
+          {
+            provider: "telegram",
+            display_name: "Telegram",
+            enabled: true,
+            configured: true,
+            auth_mode: "deep_link",
+            connection_status: "not_connected",
+          },
+          {
+            provider: "slack",
+            display_name: "Slack",
+            enabled: true,
+            configured: true,
+            auth_mode: "oauth",
+            connection_status: "not_connected",
+          },
+          {
+            provider: "discord",
+            display_name: "Discord",
+            enabled: true,
+            configured: true,
+            auth_mode: "oauth_and_bot_install",
+            connection_status: "not_connected",
+          },
+        ],
+      }),
+    });
+  });
+
+  void page.route("**/api/channels/connections", (route) => {
+    return route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify({ connections: [] }),
+    });
+  });
+}
+
+test.describe("IM channels", () => {
+  test("sidebar and settings expose channel connections", async ({ page }) => {
+    mockLangGraphAPI(page);
+    mockChannelsAPI(page);
+
+    await page.goto("/workspace/chats/new");
+
+    const sidebar = page.locator("[data-sidebar='sidebar']");
+    await expect(sidebar.getByText("Channels")).toBeVisible({
+      timeout: 15_000,
+    });
+    await expect(sidebar.getByText("Telegram")).toBeVisible();
+    await expect(sidebar.getByText("Slack")).toBeVisible();
+    await expect(sidebar.getByText("Discord")).toBeVisible();
+    await expect(sidebar.getByRole("button", { name: "Connect" })).toHaveCount(
+      3,
+    );
+
+    await sidebar.getByRole("button", { name: /Settings and more/ }).click();
+    await page.getByRole("menuitem", { name: "Settings" }).click();
+    await page.getByRole("button", { name: "Channels" }).click();
+
+    await expect(page.getByText("Telegram direct messages")).toBeVisible();
+    await expect(page.getByText("Slack workspace messages")).toBeVisible();
+    await expect(page.getByText("Discord server messages")).toBeVisible();
+  });
+});
@@ -0,0 +1,123 @@
+import { beforeEach, describe, expect, test, vi } from "vitest";
+
+vi.mock("@/core/api/fetcher", () => ({
+  fetch: vi.fn(),
+}));
+
+vi.mock("@/core/config", () => ({
+  getBackendBaseURL: () => "/backend",
+}));
+
+import { fetch as fetcher } from "@/core/api/fetcher";
+import {
+  connectChannelProvider,
+  disconnectChannelConnection,
+  listChannelConnections,
+  listChannelProviders,
+} from "@/core/channels/api";
+
+const mockedFetch = vi.mocked(fetcher);
+
+function jsonResponse(status: number, body: unknown): Response {
+  return new Response(JSON.stringify(body), {
+    status,
+    statusText: status >= 400 ? "Bad Request" : "OK",
+    headers: { "Content-Type": "application/json" },
+  });
+}
+
+beforeEach(() => {
+  mockedFetch.mockReset();
+});
+
+describe("channels api", () => {
+  test("loads provider catalog", async () => {
+    mockedFetch.mockResolvedValueOnce(
+      jsonResponse(200, {
+        enabled: true,
+        providers: [
+          {
+            provider: "telegram",
+            display_name: "Telegram",
+            enabled: true,
+            configured: true,
+            auth_mode: "deep_link",
+            connection_status: "not_connected",
+          },
+        ],
+      }),
+    );
+
+    await expect(listChannelProviders()).resolves.toMatchObject({
+      enabled: true,
+      providers: [{ provider: "telegram", display_name: "Telegram" }],
+    });
+    expect(mockedFetch).toHaveBeenCalledWith("/backend/api/channels/providers");
+  });
+
+  test("loads current user's connections", async () => {
+    mockedFetch.mockResolvedValueOnce(
+      jsonResponse(200, {
+        connections: [
+          {
+            id: "connection-1",
+            provider: "telegram",
+            status: "connected",
+            external_account_name: "Alice",
+            scopes: [],
+            metadata: {},
+          },
+        ],
+      }),
+    );
+
+    await expect(listChannelConnections()).resolves.toMatchObject([
+      { id: "connection-1", provider: "telegram", status: "connected" },
+    ]);
+    expect(mockedFetch).toHaveBeenCalledWith(
+      "/backend/api/channels/connections",
+    );
+  });
+
+  test("starts a provider connection flow", async () => {
+    mockedFetch.mockResolvedValueOnce(
+      jsonResponse(200, {
+        provider: "telegram",
+        mode: "deep_link",
+        url: "https://t.me/deerflow_bot?start=state",
+        expires_in: 600,
+      }),
+    );
+
+    await expect(connectChannelProvider("telegram")).resolves.toMatchObject({
+      provider: "telegram",
+      url: "https://t.me/deerflow_bot?start=state",
+    });
+    expect(mockedFetch).toHaveBeenCalledWith(
+      "/backend/api/channels/telegram/connect",
+      { method: "POST" },
+    );
+  });
+
+  test("disconnects a channel connection", async () => {
+    mockedFetch.mockResolvedValueOnce(new Response(null, { status: 204 }));
+
+    await expect(
+      disconnectChannelConnection("connection-1"),
+    ).resolves.toBeUndefined();
+    expect(mockedFetch).toHaveBeenCalledWith(
+      "/backend/api/channels/connections/connection-1",
+      { method: "DELETE" },
+    );
+  });
+
+  test("uses backend detail for failed requests", async () => {
+    mockedFetch.mockResolvedValueOnce(
+      jsonResponse(400, { detail: "Channel provider is not configured" }),
+    );
+
+    await expect(connectChannelProvider("slack")).rejects.toThrow(
+      "Channel provider is not configured",
+    );
+  });
+});