bfeea743f7
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Convert tasks, calendar, and dashboard pages from synchronous mock data to async loading pattern with useState/useEffect. Each page now shows a loading state via child components while data loads, and displays a PDA-friendly amber-styled message with a retry button if loading fails. This prepares these pages for real API integration by establishing the async data flow pattern. Child components (TaskList, Calendar, dashboard widgets) already handled isLoading props — now the pages actually use them. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
import { describe, it, expect, vi } from "vitest";
|
|
import { render, screen, waitFor } from "@testing-library/react";
|
|
import CalendarPage from "./page";
|
|
|
|
// Mock the Calendar component
|
|
vi.mock("@/components/calendar/Calendar", () => ({
|
|
Calendar: ({
|
|
events,
|
|
isLoading,
|
|
}: {
|
|
events: unknown[];
|
|
isLoading: boolean;
|
|
}): React.JSX.Element => (
|
|
<div data-testid="calendar">{isLoading ? "Loading" : `${String(events.length)} events`}</div>
|
|
),
|
|
}));
|
|
|
|
describe("CalendarPage", (): void => {
|
|
it("should render the page title", (): void => {
|
|
render(<CalendarPage />);
|
|
expect(screen.getByRole("heading", { level: 1 })).toHaveTextContent("Calendar");
|
|
});
|
|
|
|
it("should show loading state initially", (): void => {
|
|
render(<CalendarPage />);
|
|
expect(screen.getByTestId("calendar")).toHaveTextContent("Loading");
|
|
});
|
|
|
|
it("should render the Calendar with events after loading", async (): Promise<void> => {
|
|
render(<CalendarPage />);
|
|
await waitFor((): void => {
|
|
expect(screen.getByTestId("calendar")).toHaveTextContent("3 events");
|
|
});
|
|
});
|
|
|
|
it("should have proper layout structure", (): void => {
|
|
const { container } = render(<CalendarPage />);
|
|
const main = container.querySelector("main");
|
|
expect(main).toBeInTheDocument();
|
|
});
|
|
|
|
it("should render the subtitle text", (): void => {
|
|
render(<CalendarPage />);
|
|
expect(screen.getByText("View your schedule at a glance")).toBeInTheDocument();
|
|
});
|
|
});
|