From 791e3664ee84df5df4779060a3df83176bc6b280 Mon Sep 17 00:00:00 2001
From: Francisco Pessano <franpessano1@gmail.com>
Date: Sun, 8 Jun 2025 01:53:12 -0300
Subject: [PATCH] feat: Integrate ConversationTimeline into DebtCard for
 enhanced debt updates

---
 src/components/Dashboard.tsx | 11 ++++-------
 src/components/DebtCard.tsx  | 12 +++++++++++-
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src/components/Dashboard.tsx b/src/components/Dashboard.tsx
index 3cad4e9..456634c 100644
--- a/src/components/Dashboard.tsx
+++ b/src/components/Dashboard.tsx
@@ -313,14 +313,11 @@ export function Dashboard() {
 								<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
 									{debtList.map((debt) => (
 										<div key={debt.id} className="space-y-4">
-											<DebtCard debt={debt} onUpdate={fetchDebts} />
-											<ConversationTimeline
+											<DebtCard
 												debt={debt}
-												onDebtUpdate={(debt) => {
-													setDebts(
-														debts.map((d) => (d.id === debt.id ? debt : d))
-													);
-												}}
+												onUpdate={fetchDebts}
+												debts={debts}
+												setDebts={setDebts}
 											/>
 										</div>
 									))}
diff --git a/src/components/DebtCard.tsx b/src/components/DebtCard.tsx
index 03b4f48..8b3782c 100644
--- a/src/components/DebtCard.tsx
+++ b/src/components/DebtCard.tsx
@@ -54,10 +54,13 @@ import {
 	updateVariablesForTextChange,
 } from "../lib/emailVariables";
 import { ManualResponseDialog } from "./ManualResponseDialog";
+import { ConversationTimeline } from "./ConversationTimeline";
 
 interface DebtCardProps {
 	debt: Debt;
 	onUpdate?: () => void; // Callback to refresh data after updates
+	debts: Debt[];
+	setDebts: (debts: Debt[]) => void;
 }
 
 const statusColors = {
@@ -101,7 +104,7 @@ const statusLabels = {
 	opted_out: "Opted Out",
 };
 
-export function DebtCard({ debt, onUpdate }: DebtCardProps) {
+export function DebtCard({ debt, onUpdate, debts, setDebts }: DebtCardProps) {
 	const [isApproving, setIsApproving] = useState(false);
 	const [isRejecting, setIsRejecting] = useState(false);
 	const [userProfile, setUserProfile] = useState<any>(null);
@@ -725,6 +728,13 @@ export function DebtCard({ debt, onUpdate }: DebtCardProps) {
 						</AlertDialog>
 					</div>
 				)}
+
+				<ConversationTimeline
+					debt={debt}
+					onDebtUpdate={(debt) => {
+						setDebts(debts.map((d) => (d.id === debt.id ? debt : d)));
+					}}
+				/>
 			</CardContent>
 		</Card>
 	);