Initial release

frontend/src/lib/utils.ts

@@ -0,0 +1,49 @@
+import { clsx, type ClassValue } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+
+export function formatDate(iso: string): string {
+  const utc = iso.endsWith('Z') || iso.includes('+') ? iso : iso + 'Z'
+  return new Date(utc).toLocaleString(undefined, {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+  })
+}
+
+export function formatDateShort(iso: string): string {
+  const utc = iso.endsWith('Z') || iso.includes('+') ? iso : iso + 'Z'
+  return new Date(utc).toLocaleString(undefined, {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+  })
+}
+
+export function displayName(user: { first_name: string; last_name?: string | null; username?: string | null }): string {
+  const full = [user.first_name, user.last_name].filter(Boolean).join(' ')
+  return full || user.username || ''
+}
+
+export const STATUS_LABELS: Record<string, string> = {
+  draft: 'Draft',
+  active: 'Active',
+  drawing: 'Drawing',
+  finished: 'Finished',
+  cancelled: 'Cancelled',
+}
+
+export const STATUS_COLORS: Record<string, string> = {
+  draft: 'bg-gray-100 text-gray-600',
+  active: 'bg-emerald-100 text-emerald-700',
+  drawing: 'bg-blue-100 text-blue-700',
+  finished: 'bg-purple-100 text-purple-700',
+  cancelled: 'bg-red-100 text-red-600',
+}