Changes

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

src/components/cases/expenses-tab.tsx

@@ -265,7 +265,24 @@ export function CaseExpensesTab({ caseId }: { caseId: string }) {
                   <td className="px-4 py-3 text-right tabular-nums font-medium">{formatCurrency(e.amount)}</td>
                   <td className="px-4 py-3 text-xs text-muted-foreground">{!e.billable ? "Non-billable" : e.invoice_id ? "Invoiced" : "Unbilled"}</td>
                   <td className="px-4 py-3 text-right">
-                    {!e.invoice_id && <Button variant="ghost" size="icon" onClick={() => del(e)}><Trash2 className="h-4 w-4 text-destructive" /></Button>}
+                    <div className="flex items-center justify-end gap-1">
+                      {e.billable && (
+                        <Button
+                          variant="ghost"
+                          size="sm"
+                          className="h-7 px-2 text-xs"
+                          onClick={() => toggleInvoiced(e)}
+                          title={e.invoice_id ? "Mark as unbilled" : "Mark as invoiced"}
+                        >
+                          {e.invoice_id ? (
+                            <><Undo2 className="h-3.5 w-3.5 mr-1" /> Unbill</>
+                          ) : (
+                            <><CheckCircle2 className="h-3.5 w-3.5 mr-1" /> Invoiced</>
+                          )}
+                        </Button>
+                      )}
+                      {!e.invoice_id && <Button variant="ghost" size="icon" onClick={() => del(e)}><Trash2 className="h-4 w-4 text-destructive" /></Button>}
+                    </div>
                   </td>
                 </tr>
               ))}