@wopr-network/platform-ui-core 1.5.0 → 1.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wopr-network/platform-ui-core",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Brand-agnostic AI agent platform UI — deploy as any brand via env vars",
   "repository": {
     "type": "git",

package/src/__tests__/buy-crypto-credits-panel.test.tsx

@@ -1,14 +1,19 @@
-import { render, screen } from "@testing-library/react";
+import { render, screen, waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { afterEach, describe, expect, it, vi } from "vitest";
 
-const { mockCreateCryptoCheckout, mockIsAllowedRedirectUrl } = vi.hoisted(() => ({
-  mockCreateCryptoCheckout: vi.fn(),
-  mockIsAllowedRedirectUrl: vi.fn(),
-}));
+const { mockCreateCryptoCheckout, mockIsAllowedRedirectUrl, mockGetSupportedPaymentMethods } =
+  vi.hoisted(() => ({
+    mockCreateCryptoCheckout: vi.fn(),
+    mockIsAllowedRedirectUrl: vi.fn(),
+    mockGetSupportedPaymentMethods: vi.fn(),
+  }));
 
 vi.mock("@/lib/api", () => ({
   createCryptoCheckout: (...args: unknown[]) => mockCreateCryptoCheckout(...args),
+  createEthCheckout: vi.fn(),
+  createStablecoinCheckout: vi.fn(),
+  getSupportedPaymentMethods: (...args: unknown[]) => mockGetSupportedPaymentMethods(...args),
 }));
 
 vi.mock("@/lib/validate-redirect-url", () => ({
@@ -44,6 +49,9 @@ vi.mock("next/navigation", () => ({
 vi.mock("better-auth/react", () => ({
   createAuthClient: () => ({
     useSession: () => ({ data: null, isPending: false, error: null }),
+    signIn: { email: vi.fn(), social: vi.fn() },
+    signUp: { email: vi.fn() },
+    signOut: vi.fn(),
   }),
 }));
 
@@ -55,14 +63,31 @@ vi.mock("lucide-react", async (importOriginal) => {
   };
 });
 
+const MOCK_USDC_METHOD = {
+  id: "usdc:base",
+  type: "stablecoin",
+  label: "USDC on Base",
+  token: "USDC",
+  chain: "base",
+};
+const MOCK_BTC_METHOD = {
+  id: "btc:btcpay",
+  type: "btc",
+  label: "BTC",
+  token: "BTC",
+  chain: "bitcoin",
+};
+
 afterEach(() => {
   vi.restoreAllMocks();
   mockIsAllowedRedirectUrl.mockReset();
   mockCreateCryptoCheckout.mockReset();
+  mockGetSupportedPaymentMethods.mockReset();
 });
 
 describe("BuyCryptoCreditPanel", () => {
   it("renders crypto amount buttons ($10, $25, $50, $100)", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
@@ -74,23 +99,35 @@ describe("BuyCryptoCreditPanel", () => {
   });
 
   it("Pay button is disabled when no amount selected", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
-    const payBtn = screen.getByRole("button", { name: "Pay with crypto" });
+    // Wait for methods to load
+    await waitFor(() => {
+      expect(screen.getByText("Stablecoin")).toBeInTheDocument();
+    });
+
+    const payBtn = screen.getByRole("button", { name: "Pay with USDC" });
     expect(payBtn).toBeDisabled();
   });
 
   it("Pay button is enabled after selecting an amount", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     const user = userEvent.setup();
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
+    await waitFor(() => {
+      expect(screen.getByText("Stablecoin")).toBeInTheDocument();
+    });
+
     await user.click(screen.getByText("$25"));
-    expect(screen.getByRole("button", { name: "Pay with crypto" })).toBeEnabled();
+    expect(screen.getByRole("button", { name: "Pay with USDC" })).toBeEnabled();
   });
 
   it("calls createCryptoCheckout with selected amount and redirects", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     const hrefSetter = vi.fn();
     Object.defineProperty(window, "location", {
       value: { ...window.location, href: "" },
@@ -112,8 +149,14 @@ describe("BuyCryptoCreditPanel", () => {
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
+    await waitFor(() => {
+      expect(screen.getByText("BTC")).toBeInTheDocument();
+    });
+
+    // Switch to BTC tab
+    await user.click(screen.getByText("BTC"));
     await user.click(screen.getByText("$50"));
-    await user.click(screen.getByRole("button", { name: "Pay with crypto" }));
+    await user.click(screen.getByRole("button", { name: "Pay with BTC" }));
 
     expect(mockCreateCryptoCheckout).toHaveBeenCalledWith(50);
     expect(mockIsAllowedRedirectUrl).toHaveBeenCalledWith("https://btcpay.example.com/i/abc123");
@@ -121,6 +164,7 @@ describe("BuyCryptoCreditPanel", () => {
   });
 
   it("shows error when redirect URL is not allowed", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     mockCreateCryptoCheckout.mockResolvedValue({
       url: "https://evil.com/steal",
       referenceId: "ref-evil",
@@ -131,15 +175,21 @@ describe("BuyCryptoCreditPanel", () => {
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
+    await waitFor(() => {
+      expect(screen.getByText("BTC")).toBeInTheDocument();
+    });
+
+    await user.click(screen.getByText("BTC"));
     await user.click(screen.getByText("$10"));
-    await user.click(screen.getByRole("button", { name: "Pay with crypto" }));
+    await user.click(screen.getByRole("button", { name: "Pay with BTC" }));
 
     expect(
       await screen.findByText("Unexpected checkout URL. Please contact support."),
     ).toBeInTheDocument();
   });
 
-  it("shows Opening checkout... while checkout is in progress", async () => {
+  it("shows Creating checkout... while checkout is in progress", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     mockCreateCryptoCheckout.mockReturnValue(
       new Promise(() => {
         /* intentionally pending */
@@ -150,29 +200,33 @@ describe("BuyCryptoCreditPanel", () => {
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
+    await waitFor(() => {
+      expect(screen.getByText("BTC")).toBeInTheDocument();
+    });
+
+    await user.click(screen.getByText("BTC"));
     await user.click(screen.getByText("$100"));
-    await user.click(screen.getByRole("button", { name: "Pay with crypto" }));
+    await user.click(screen.getByRole("button", { name: "Pay with BTC" }));
 
-    expect(await screen.findByText("Opening checkout...")).toBeInTheDocument();
+    expect(await screen.findByText("Creating checkout...")).toBeInTheDocument();
   });
 
   it("shows error when crypto checkout API call fails", async () => {
+    mockGetSupportedPaymentMethods.mockResolvedValue([MOCK_USDC_METHOD, MOCK_BTC_METHOD]);
     mockCreateCryptoCheckout.mockRejectedValue(new Error("API down"));
 
     const user = userEvent.setup();
     const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
     render(<BuyCryptoCreditPanel />);
 
+    await waitFor(() => {
+      expect(screen.getByText("BTC")).toBeInTheDocument();
+    });
+
+    await user.click(screen.getByText("BTC"));
     await user.click(screen.getByText("$25"));
-    await user.click(screen.getByRole("button", { name: "Pay with crypto" }));
+    await user.click(screen.getByRole("button", { name: "Pay with BTC" }));
 
     expect(await screen.findByText("Checkout failed. Please try again.")).toBeInTheDocument();
   });
-
-  it("displays minimum amount note", async () => {
-    const { BuyCryptoCreditPanel } = await import("../components/billing/buy-crypto-credits-panel");
-    render(<BuyCryptoCreditPanel />);
-
-    expect(screen.getByText(/Minimum \$10/)).toBeInTheDocument();
-  });
 });

package/src/__tests__/settings.test.tsx

@@ -19,10 +19,17 @@ vi.mock("next/navigation", () => ({
   usePathname: () => "/settings/profile",
 }));
 
-// Mock better-auth/react
+// Mock better-auth/react — session with user-001 (Alice) so role-gated org UI renders admin view
 vi.mock("better-auth/react", () => ({
   createAuthClient: () => ({
-    useSession: () => ({ data: null, isPending: false, error: null }),
+    useSession: () => ({
+      data: {
+        user: { id: "user-001", name: "Alice Johnson", email: "alice@example.com" },
+        session: { id: "sess-1", userId: "user-001", expiresAt: new Date(Date.now() + 86400000) },
+      },
+      isPending: false,
+      error: null,
+    }),
     signIn: { email: vi.fn(), social: vi.fn() },
     signUp: { email: vi.fn() },
     signOut: vi.fn(),