Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>

src/components/cases/collections-tab.tsx

@@ -77,6 +77,7 @@ import {
 import { SortableLedgerRow } from "./ledger-row";
 import { ApplyCollectionWorkflowDialog } from "@/components/collections/apply-collection-workflow-dialog";
 import { MergeCollectionsDialog } from "./merge-collections-dialog";
+import { StatusFlagBadges } from "@/components/collections/status-flag-badges";
 
 const TXN_TYPES = [
   { value: "assessment", label: "Assessment" },
@@ -303,7 +304,12 @@ export function CaseCollectionsTab({
                       onClick={() => setActiveId(c.id)}
                     >
                       <TableCell className="font-medium">
-                        {c.homeowner?.last_name}, {c.homeowner?.first_name}
+                        <span className="inline-flex items-center gap-1.5">
+                          <span>
+                            {c.homeowner?.last_name}, {c.homeowner?.first_name}
+                          </span>
+                          <StatusFlagBadges bk={c.in_bankruptcy} pp={c.on_payment_plan} />
+                        </span>
                       </TableCell>
                       <TableCell className="text-muted-foreground">
                         {c.homeowner?.unit_number || "—"}

src/routes/collections.$collectionId.tsx

@@ -67,6 +67,7 @@ import { SearchableSelect } from "@/components/ui/searchable-select";
 import { toast } from "sonner";
 import { spawnNextCollectionWorkflowTask } from "@/lib/workflow-chain";
 import { ApplyCollectionWorkflowDialog } from "@/components/collections/apply-collection-workflow-dialog";
+import { StatusFlagBadges } from "@/components/collections/status-flag-badges";
 
 export const Route = createFileRoute("/collections/$collectionId")({
   component: CollectionDetailRoute,
@@ -356,8 +357,49 @@ function CollectionDetailRoute() {
                 Closed{collection.closed_at ? ` · ${formatDate(collection.closed_at)}` : ""}
               </Badge>
             )}
+            <StatusFlagBadges bk={collection.in_bankruptcy} pp={collection.on_payment_plan} />
           </div>
           <div className="flex items-center gap-2 flex-wrap">
+            <label className="flex items-center gap-1.5 text-xs text-muted-foreground cursor-pointer select-none">
+              <Checkbox
+                checked={!!collection.in_bankruptcy}
+                onCheckedChange={async (v) => {
+                  const val = !!v;
+                  setCollection((c: any) => c ? { ...c, in_bankruptcy: val } : c);
+                  const { error } = await supabase
+                    .from("collections")
+                    .update({ in_bankruptcy: val })
+                    .eq("id", collection.id);
+                  if (error) {
+                    toast.error("Could not update", { description: error.message });
+                    setCollection((c: any) => c ? { ...c, in_bankruptcy: !val } : c);
+                  } else {
+                    toast.success(val ? "Marked in bankruptcy" : "Bankruptcy flag removed");
+                  }
+                }}
+              />
+              In bankruptcy
+            </label>
+            <label className="flex items-center gap-1.5 text-xs text-muted-foreground cursor-pointer select-none">
+              <Checkbox
+                checked={!!collection.on_payment_plan}
+                onCheckedChange={async (v) => {
+                  const val = !!v;
+                  setCollection((c: any) => c ? { ...c, on_payment_plan: val } : c);
+                  const { error } = await supabase
+                    .from("collections")
+                    .update({ on_payment_plan: val })
+                    .eq("id", collection.id);
+                  if (error) {
+                    toast.error("Could not update", { description: error.message });
+                    setCollection((c: any) => c ? { ...c, on_payment_plan: !val } : c);
+                  } else {
+                    toast.success(val ? "Marked on payment plan" : "Payment plan flag removed");
+                  }
+                }}
+              />
+              On payment plan
+            </label>
             <Button size="sm" variant="outline" onClick={() => setApplyHoOpen(true)}>
               <UserPlus className="h-4 w-4 mr-1.5" />
               {collection.homeowner ? "Change homeowner" : "Apply homeowner"}

src/routes/collections.index.tsx

@@ -23,6 +23,7 @@ import {
 } from "@/components/ui/table";
 import { formatCurrency, formatDate } from "@/lib/format";
 import { ChevronRight, Wallet, Search, ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
+import { StatusFlagBadges } from "@/components/collections/status-flag-badges";
 
 export const Route = createFileRoute("/collections/")({
   component: CollectionsIndexPage,
@@ -57,7 +58,7 @@ function CollectionsIndexPage() {
       supabase
         .from("collections")
         .select(
-          "id, status, current_stage, opened_at, name, homeowner:homeowners(id, first_name, last_name, unit_number, opening_balance), case:cases(id, case_number, title, client:clients(id, name))",
+          "id, status, current_stage, opened_at, name, in_bankruptcy, on_payment_plan, homeowner:homeowners(id, first_name, last_name, unit_number, opening_balance), case:cases(id, case_number, title, client:clients(id, name))",
         )
         .order("created_at", { ascending: false }),
       supabase
@@ -266,6 +267,7 @@ function CollectionsIndexPage() {
                               </span>
                             )}
                           </Link>
+                          <StatusFlagBadges bk={r.in_bankruptcy} pp={r.on_payment_plan} className="ml-2" />
                           {r.status === "closed" && (
                             <Badge variant="outline" className="ml-2 text-[10px] border-emerald-600 text-emerald-700">
                               Closed