seahaven-ap/src/pages/index.tsx

import { Box, Container, Stack, Typography } from "@mui/material";
import { areMocksEnabled, getMockInvoices, getMockVendors } from "@/mocks";

export default function HomePage() {
  const invoices = getMockInvoices();
  const vendors = getMockVendors();

  return (
    <Box component="main" sx={{ minHeight: "100vh", py: 8 }}>
      <Container maxWidth="md">
        <Stack spacing={2}>
          <Typography component="h1" variant="h1">
            Sea Haven AP
          </Typography>
          <Typography color="text.secondary">
            Internal accounts payable automation. Dashboard grids land in AP-5.
          </Typography>
          <Typography variant="body2" data-testid="mocks-status">
            Mocks {areMocksEnabled() ? "enabled" : "disabled"} — {vendors.length} vendors,{" "}
            {invoices.length} invoices
          </Typography>
        </Stack>
      </Container>
    </Box>
  );
}