Files
dashboard-desaplus-noc/src/components/sosial-page.tsx
2026-03-25 15:07:10 +08:00

48 lines
1.2 KiB
TypeScript

import { Grid, GridCol, Stack } from "@mantine/core";
import { Beasiswa } from "./sosial/beasiswa";
import { EventCalendar } from "./sosial/event-calendar";
import { HealthStats } from "./sosial/health-stats";
import { Pendidikan } from "./sosial/pendidikan";
import { PosyanduSchedule } from "./sosial/posyandu-schedule";
import { SummaryCards } from "./sosial/summary-cards";
const SosialPage = () => {
return (
<Stack gap="lg">
{/* Top Summary Cards - 4 Grid */}
<SummaryCards />
{/* Second Row - 2 Column Grid */}
<Grid gutter="md">
{/* Left - Statistik Kesehatan */}
<GridCol span={{ base: 12, lg: 6 }}>
<HealthStats />
</GridCol>
{/* Right - Jadwal Posyandu */}
<GridCol span={{ base: 12, lg: 6 }}>
<PosyanduSchedule />
</GridCol>
</Grid>
{/* Third Row - 2 Column Grid */}
<Grid gutter="md">
{/* Left - Pendidikan */}
<GridCol span={{ base: 12, lg: 6 }}>
<Pendidikan />
</GridCol>
{/* Right - Beasiswa Desa */}
<GridCol span={{ base: 12, lg: 6 }}>
<Beasiswa />
</GridCol>
</Grid>
{/* Bottom Section - Event Budaya */}
<EventCalendar />
</Stack>
);
};
export default SosialPage;