From 31f5d80f413488debc83ebdc06c1763439749ff2 Mon Sep 17 00:00:00 2001
From: Tanuja Pansare <tanuja@stratawiz.com>
Date: Thu, 16 Jul 2026 09:57:01 +0530
Subject: [PATCH] Form submissions updates

---
 .../panels/FormSubmissionsPanel.tsx           | 68 ++++++++++++-------
 .../participants/ParticipantBulkDialogs.tsx   |  2 +-
 src/services/api/types.ts                     | 18 ++++-
 3 files changed, 60 insertions(+), 28 deletions(-)

diff --git a/src/app/components/panels/FormSubmissionsPanel.tsx b/src/app/components/panels/FormSubmissionsPanel.tsx
index 57849d15..7447f717 100644
--- a/src/app/components/panels/FormSubmissionsPanel.tsx
+++ b/src/app/components/panels/FormSubmissionsPanel.tsx
@@ -171,11 +171,18 @@ export function FormSubmissionsPanel({ formId, formName, onClose }: Props) {
     setReplying(true);
     setReplyMessage(null);
     try {
-      await formsApi.replyToSubmission(formId, { to, subject: replySubject, body: replyBody });
+      // Extend payload with submissionId; backend uses it to persist replied status.
+      await (formsApi as any).replyToSubmission(formId, {
+        submissionId: replyTarget._id,
+        to,
+        subject: replySubject,
+        body: replyBody,
+      });
       setReplyMessage("Email sent successfully.");
       setReplyTarget(null);
       setReplySubject("");
       setReplyBody("");
+      await fetchPage();
     } catch (e) {
       setReplyMessage(e instanceof Error ? e.message : "Failed to send reply.");
     } finally {
@@ -456,32 +463,41 @@ export function FormSubmissionsPanel({ formId, formName, onClose }: Props) {
                 </thead>
                 <tbody>
                   {rows.map((s) => {
-                    const o = dataToObj(s.data);
-                    return (
-                      <tr key={s._id} style={{ borderBottom: "1px solid var(--border)", verticalAlign: "top" }}>
-                        <td style={{ padding: "10px 12px" }}>
-                          <button
-                            type="button"
-                            onClick={() => openReply(s)}
-                            style={{
-                              display: "inline-flex",
-                              alignItems: "center",
-                              gap: 6,
-                              padding: "6px 10px",
-                              borderRadius: "var(--radius-button)",
-                              border: "1px solid var(--border)",
-                              background: "var(--secondary)",
-                              color: "var(--foreground)",
-                              cursor: "pointer",
-                              fontSize: "var(--text-xs)",
-                              fontFamily: "var(--font-noto-sans)",
-                              fontWeight: 600,
-                            }}
-                          >
-                            <MailPlus size={14} />
-                            Reply
-                          </button>
+                  const o = dataToObj(s.data);
+                  const hasEmail = participantEmail(s.participant) !== "—";
+
+                  const isReplied = !!s.replied;
+                  return (
+                    <tr
+                      key={s._id}
+                      style={{
+                        borderBottom: "1px solid var(--border)",
+                        verticalAlign: "top",
+                        background: isReplied ? "rgba(16, 185, 129, 0.08)" : undefined,
+                      }}
+                    >
+                      <td style={{ padding: "10px 12px" }}>
+                        <button
+                          type="button"
+                          onClick={() => hasEmail && !isReplied && openReply(s)}
+                          disabled={!hasEmail || isReplied}
+                          title={isReplied ? "Already replied" : !hasEmail ? "No email available" : "Reply"}
+                          style={{ display: "inline-flex", alignItems: "center", gap: 6, padding: "6px 10px", borderRadius: "var(--radius-button)",
+                            border: "1px solid var(--border)",
+                            background: isReplied ? "rgba(16, 185, 129, 0.15)" : hasEmail ? "var(--secondary)" : "var(--background)",
+                            color: isReplied ? "var(--foreground)" : hasEmail ? "var(--foreground)" : "var(--muted)",
+                            cursor: !hasEmail || isReplied ? "not-allowed" : "pointer",
+                            opacity: !hasEmail ? 0.5 : 1,
+                            fontSize: "var(--text-xs)",
+                            fontFamily: "var(--font-noto-sans)",
+                            fontWeight: 600,
+                          }}
+                        >
+                          <MailPlus size={14} />
+                          {isReplied ? "Replied" : "Reply"}
+                        </button>
                         </td>
+
                         <td style={{ padding: "10px 12px", whiteSpace: "nowrap", color: "var(--foreground)" }}>
                           {formatWhen(s.submittedAt)}
                         </td>
diff --git a/src/app/components/participants/ParticipantBulkDialogs.tsx b/src/app/components/participants/ParticipantBulkDialogs.tsx
index 4aee3999..f8662f14 100644
--- a/src/app/components/participants/ParticipantBulkDialogs.tsx
+++ b/src/app/components/participants/ParticipantBulkDialogs.tsx
@@ -200,7 +200,7 @@ export function ParticipantBulkDialogs({
             }}
             style={{ padding: "7px 14px", borderRadius: "var(--radius-button)", border: "none", background: "var(--primary)", color: "var(--primary-foreground)", cursor: "pointer", fontSize: "var(--text-sm)" }}
           >
-            Apply
+            {bulkDialog === "removeTags" ? "Remove" : "Apply"}
           </button>
         )}
       </>
diff --git a/src/services/api/types.ts b/src/services/api/types.ts
index 27f13aec..7d5a35ea 100644
--- a/src/services/api/types.ts
+++ b/src/services/api/types.ts
@@ -610,8 +610,24 @@ export interface FormSubmissionRecord {
   form?: string;
   submittedAt: string;
   data?: Record<string, unknown>;
-  participant?: { _id?: string; firstName?: string; lastName?: string; email?: string } | string;
+  participant?: {
+    _id?: string;
+    firstName?: string;
+    lastName?: string;
+    email?: string;
+  } | string;
   status?: string;
+
+  replied?: boolean;
+  repliedAt?: string;
+  repliedBy?:
+    | string
+    | {
+        _id?: string;
+        firstName?: string;
+        lastName?: string;
+        email?: string;
+      };
 }
 
 export interface SpeakerLogistics {