import { describe, expect, it, vi } from "vitest";
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";

vi.mock("@/components/DashboardLayout", () => ({
  default: ({ children, title }: { children: React.ReactNode; title: string }) => (
    <main><h1>{title}</h1>{children}</main>
  ),
}));

import WithdrawPage from "@/app/withdraw/page";

describe("WithdrawPage", () => {
  it("fills quick amounts including the full available balance", async () => {
    const user = userEvent.setup();
    render(<WithdrawPage />);
    const input = screen.getByPlaceholderText("0.00");

    await user.click(screen.getByRole("button", { name: "1,000" }));
    expect(input).toHaveValue(1000);
    await user.click(screen.getByRole("button", { name: "الكل" }));
    expect(input).toHaveValue(8320);
  });

  it("accepts a manually entered amount and displays submission success", async () => {
    const user = userEvent.setup();
    render(<WithdrawPage />);

    await user.type(screen.getByPlaceholderText("0.00"), "750");
    expect(screen.getByPlaceholderText("0.00")).toHaveValue(750);
    await user.click(screen.getByRole("button", { name: "تأكيد السحب" }));

    expect(screen.getByText("تم تقديم طلب السحب بنجاح!")).toBeInTheDocument();
    expect(screen.getByText("سيصل المبلغ خلال 1-3 أيام عمل")).toBeInTheDocument();
  });
});