Form response edit

apps/blade/src/app/admin/forms/[slug]/client.tsx

@@ -188,6 +188,7 @@
   const [instructions, setInstructions] = useState<UIInstruction[]>([]);
   const [duesOnly, setDuesOnly] = useState(false);
   const [allowResubmission, setAllowResubmission] = useState(true);
+  const [allowEdit, setAllowEdit] = useState(true);
   const [responseRoleIds, setResponseRoleIds] = useState<string[]>([]);
   const [responseRolesDialogOpen, setResponseRolesDialogOpen] = useState(false);
   const [activeItemId, setActiveItemId] = useState<string | null>(null);
@@ -257,9 +258,10 @@
       },
       duesOnly,
       allowResubmission,
+      allowEdit,
       responseRoleIds,
     } as any);
   }, [
     formTitle,
     formDescription,
     formBanner,
@@ -267,6 +269,7 @@
     instructions,
     duesOnly,
     allowResubmission,
+    allowEdit,
     formData,
     isLoading,
     isFetching,
@@ -296,6 +299,7 @@
         setFormBanner(formData.formData.banner || "");
         setDuesOnly(formData.duesOnly);
         setAllowResubmission(formData.allowResubmission);
+        setAllowEdit(formData.allowEdit);
         setResponseRoleIds((formData as any).responseRoleIds || []);
 
         const loadedQuestions: UIQuestion[] = formData.formData.questions.map(
@@ -324,12 +328,12 @@
   // auto save trigger when toggle switches are changed
   useEffect(() => {
     if (!isLoading) handleSaveForm();
   }, [duesOnly, allowResubmission, responseRoleIds, isLoading]); // removed handleSaveForm to prevent save-on-every-render
 
   // auto save when finishing editing an item (changing active card)
   useEffect(() => {
     if (!isLoading) handleSaveForm();
   }, [activeItemId, isLoading]); // triggers when switching items or clicking off
 
   // Periodic auto-save every 40 seconds
   useEffect(() => {
@@ -546,7 +550,7 @@
             </div>
           </div>
 
-          <div className="flex flex-col gap-3 md:flex-row md:items-center md:gap-6 lg:gap-8">
+          <div className="flex flex-col gap-3 md:flex-row md:items-center md:gap-6 lg:gap-3">
             <div className="flex items-center gap-3">
               <Switch
                 id="dues-only"
@@ -573,6 +577,19 @@
                 Allow Multiple Responses
               </Label>
             </div>
+            <div className="flex items-center gap-3">
+              <Switch
+                id="allow-resubmit"
+                checked={allowEdit}
+                onCheckedChange={setAllowEdit}
+              />
+              <Label
+                htmlFor="allow-edit"
+                className="cursor-pointer text-sm font-bold"
+              >
+                Allow Response Edit
+              </Label>
+            </div>
             <Dialog
               open={responseRolesDialogOpen}
               onOpenChange={setResponseRolesDialogOpen}

apps/blade/src/app/dashboard/_components/member-dashboard/forms/form-responses.tsx

@@ -34,11 +34,13 @@ export async function FormResponses() {
                       {new Date(formResponse.submittedAt).toLocaleString()}
                     </span>
                   </div>
-
-                  <ViewFormResponseButton
-                    formNameSlug={formResponse.formSlug ?? ""}
-                    responseIdSlug={formResponse.id}
-                  />
+                  <Link
+                    href={`/forms/${formResponse.formSlug ?? ""}/${formResponse.id}`}
+                  >
+                    <Button size="sm">
+                      {formResponse.allowEdit ? "Edit" : "View"}
+                    </Button>
+                  </Link>
                 </div>
               </div>
             ))}
@@ -54,17 +56,3 @@ export async function FormResponses() {
     </Card>
   );
 }
-
-function ViewFormResponseButton({
-  responseIdSlug,
-  formNameSlug,
-}: {
-  responseIdSlug: string;
-  formNameSlug: string;
-}) {
-  return (
-    <Link href={`/forms/${formNameSlug}/${responseIdSlug}`}>
-      <Button size="sm">View/Edit</Button>
-    </Link>
-  );
-}

apps/blade/src/app/forms/[formName]/[responseId]/page.tsx

@@ -1,6 +1,8 @@
 import { redirect } from "next/navigation";
+import { XCircle } from "lucide-react";
 
 import { auth } from "@forge/auth";
+import { Card } from "@forge/ui/card";
 
 import { SIGN_IN_PATH } from "~/consts";
 import { api, HydrateClient } from "~/trpc/server";
@@ -16,8 +18,26 @@ export default async function FormResponderPage({
     redirect(SIGN_IN_PATH);
   }
 
+  if (!params.formName) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-primary/5 p-6">
+        <Card className="max-w-md p-8 text-center">
+          <XCircle className="mx-auto mb-4 h-16 w-16 text-destructive" />
+          <h1 className="mb-2 text-2xl font-bold">Form not found</h1>
+        </Card>
+      </div>
+    );
+  }
+
   if (!params.responseId) {
-    return <div>Submission not found</div>;
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-primary/5 p-6">
+        <Card className="max-w-md p-8 text-center">
+          <XCircle className="mx-auto mb-4 h-16 w-16 text-destructive" />
+          <h1 className="mb-2 text-2xl font-bold">Response not found</h1>
+        </Card>
+      </div>
+    );
   }
 
   // handle url encode form names to allow spacing and special characters