import { render, screen } from "@testing-library/react";
import { describe, it, expect, vi } from "vitest";
import type { Budget } from "@/api/schemas";

// jsdom has no CSS.supports(); Seed's SegmentedControl/TextField call it via
// @seed-design/react-supports to detect :focus-visible support.
if (typeof (globalThis as any).CSS === "undefined") {
  (globalThis as any).CSS = { supports: () => false };
} else if (typeof (globalThis as any).CSS.supports !== "function") {
  (globalThis as any).CSS.supports = () => false;
}

const budgetFixture: Budget = {
  dayLimit: "50000",
  weekLimit: "300000",
  monthLimit: "1200000",
  plannedIncome: "2000000",
  plannedIncomeManual: "0",
  loanObligations: "0",
  savingsContributions: "0",
  subscriptionContributions: "0",
  availableIncome: "2000000",
  categories: [{ name: "хоол", day: "10000", week: "60000", month: "240000" }],
  savingsGoals: [],
  report: {
    day: { overallSpent: "15000", overallLimit: "50000", rows: [{ category: "хоол", spent: "5000", limit: "20000" }] },
    week: { overallSpent: "0", overallLimit: "300000", rows: [] },
    month: { overallSpent: "0", overallLimit: "1200000", rows: [] },
  },
};

vi.mock("@/api/hooks/reads", () => ({
  useBudget: () => ({ data: budgetFixture, isLoading: false }),
  useNetWorth: () => ({ data: { assets: "0", liabilities: "0", total: "0", accounts: [] }, isLoading: false }),
}));

vi.mock("@/api/hooks/mutations", () => ({
  usePutBudget: () => ({ mutate: vi.fn() }),
  useSavingsGoalMutations: () => ({ post: { mutate: vi.fn() }, delete: { mutate: vi.fn() } }),
}));

import { PlannerView } from "./PlannerView";

describe("PlannerView", () => {
  it("renders the day-horizon overall total and a category limit", () => {
    render(<PlannerView />);

    // Overall (day) card: spent / limit from budget.report.day.
    expect(screen.getByText("15,000₮ / 50,000₮")).toBeInTheDocument();

    // Category limit row: name + spent / limit from budget.report.day.rows.
    expect(screen.getByText("хоол")).toBeInTheDocument();
    expect(screen.getByText("5,000₮ / 20,000₮")).toBeInTheDocument();
  });
});