Muluhabt ERP modules

apps/finance-web/src/shared/components/PageHeader.tsx

@@ -0,0 +1,26 @@
+import { Group, Stack, Text, Title } from "@mantine/core";
+import type { ReactNode } from "react";
+
+export function PageHeader({
+  title,
+  description,
+  actions,
+}: {
+  title: string;
+  description?: string;
+  actions?: ReactNode;
+}) {
+  return (
+    <Group justify="space-between" align="flex-start" mb="lg" wrap="wrap">
+      <Stack gap={2}>
+        <Title order={2}>{title}</Title>
+        {description && (
+          <Text size="sm" c="dimmed">
+            {description}
+          </Text>
+        )}
+      </Stack>
+      {actions && <Group gap="sm">{actions}</Group>}
+    </Group>
+  );
+}