chore: perauset customer project

packages/components/src/status-badge.tsx

@@ -0,0 +1,37 @@
+import { Badge } from '@pikku/mantine/core'
+import { asI18n } from '@pikku/react'
+
+const STATUS_COLORS: Record<string, string> = {
+  submitted: 'yellow',
+  pending: 'yellow',
+  under_review: 'orange',
+  approved: 'blue',
+  confirmed: 'blue',
+  checked_in: 'green',
+  active: 'green',
+  open: 'green',
+  planned: 'blue',
+  checked_out: 'gray',
+  completed: 'gray',
+  full: 'orange',
+  closed: 'gray',
+  rejected: 'red',
+  declined: 'red',
+  cancelled: 'red',
+  blocked: 'pink',
+  waitlisted: 'orange',
+}
+
+function formatStatus(status: string): string {
+  return status.replace(/_/g, ' ').replace(/\b\w/g, (c) => c.toUpperCase())
+}
+
+export function StatusBadge({ status }: { status: string }) {
+  const color = STATUS_COLORS[status] ?? 'gray'
+
+  return (
+    <Badge color={color} variant="light" size="sm">
+      {asI18n(formatStatus(status))}
+    </Badge>
+  )
+}