From b1ab7656e30ab32ac972b4aee2d3114eb3c43178 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Mon, 20 Apr 2026 00:24:08 +0000
Subject: [PATCH] Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
---
 .../collections/status-flag-badges.tsx        | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 src/components/collections/status-flag-badges.tsx

diff --git a/src/components/collections/status-flag-badges.tsx b/src/components/collections/status-flag-badges.tsx
new file mode 100644
index 0000000..423a516
--- /dev/null
+++ b/src/components/collections/status-flag-badges.tsx
@@ -0,0 +1,40 @@
+import { Badge } from "@/components/ui/badge";
+
+/**
+ * Compact BK / PP indicator badges used next to case/collection names.
+ * - BK = Bankruptcy
+ * - PP = Payment Plan
+ */
+export function StatusFlagBadges({
+  bk,
+  pp,
+  className,
+}: {
+  bk?: boolean | null;
+  pp?: boolean | null;
+  className?: string;
+}) {
+  if (!bk && !pp) return null;
+  return (
+    <span className={`inline-flex items-center gap-1 ${className ?? ""}`}>
+      {bk && (
+        <Badge
+          variant="outline"
+          className="text-[9px] px-1.5 py-0 h-4 border-rose-600 text-rose-700 dark:text-rose-300 dark:border-rose-400 font-semibold"
+          title="In bankruptcy"
+        >
+          BK
+        </Badge>
+      )}
+      {pp && (
+        <Badge
+          variant="outline"
+          className="text-[9px] px-1.5 py-0 h-4 border-blue-600 text-blue-700 dark:text-blue-300 dark:border-blue-400 font-semibold"
+          title="On payment plan"
+        >
+          PP
+        </Badge>
+      )}
+    </span>
+  );
+}