tickte-system/src/components/ui/StatusPill.jsx

const STATUS_CLASS = {
  Open: 'status-open',
  Occupied: 'status-occupied',
  Assigned: 'status-assigned',
  Awaiting: 'status-awaiting',
  'Added Info': 'status-awaiting',
  Closed: 'status-closed',
}

const PRIORITY = {
  0: { cls: 'priority-none', label: 'Keine' },
  1: { cls: 'priority-low', label: 'Niedrig' },
  2: { cls: 'priority-medium', label: 'Mittel' },
  3: { cls: 'priority-high', label: 'Hoch' },
  4: { cls: 'priority-critical', label: 'Kritisch' },
}

const pillBase = {
  display: 'inline-flex',
  alignItems: 'center',
  gap: 6,
  padding: '3px 10px',
  borderRadius: 999,
  fontSize: 12,
  fontWeight: 700,
}

export function StatusPill({ status }) {
  const cls = STATUS_CLASS[status] || 'status-open'
  return <span className={cls} style={pillBase}>{status || 'Open'}</span>
}

export function PriorityPill({ priority }) {
  const p = PRIORITY[priority] ?? PRIORITY[1]
  return <span className={p.cls} style={pillBase}>{p.label}</span>
}