From ac97dcb092a7a86148eaaa7d8c73e9f116348f7f Mon Sep 17 00:00:00 2001
From: manukminasyan <manuk.minasyan1@gmail.com>
Date: Fri, 27 Mar 2026 21:04:34 +0400
Subject: [PATCH] fix: replace form elements with div+wire:click to prevent
 nested form conflicts

The CommentsAction slide-over wraps content in a Filament action form.
Nested <form> elements inside the comments Livewire templates caused the
browser to submit the outer action form instead, closing the slide-over
without storing the comment.

Replace <form wire:submit> with <div> and type="submit" buttons with
type="button" wire:click for all three forms (comment, edit, reply).
---
 resources/views/livewire/comment-item.blade.php | 12 ++++++------
 resources/views/livewire/comments.blade.php     |  6 +++---
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/resources/views/livewire/comment-item.blade.php b/resources/views/livewire/comment-item.blade.php
index b65e940..2e08625 100644
--- a/resources/views/livewire/comment-item.blade.php
+++ b/resources/views/livewire/comment-item.blade.php
@@ -32,13 +32,13 @@
 
             {{-- Body or edit form --}}
             @if ($isEditing)
-                <form wire:submit="saveEdit" class="mt-1">
+                <div class="mt-1">
                     {{ $this->editForm }}
                     <div class="mt-2 flex gap-2">
-                        <button type="submit" class="text-sm font-medium text-primary-600 hover:text-primary-500 dark:text-primary-400">Save</button>
+                        <button type="button" wire:click="saveEdit" class="text-sm font-medium text-primary-600 hover:text-primary-500 dark:text-primary-400">Save</button>
                         <button type="button" wire:click="cancelEdit" class="text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400">Cancel</button>
                     </div>
-                </form>
+                </div>
             @else
                 <div class="fi-prose prose prose-sm mt-1 max-w-none text-gray-700 dark:prose-invert dark:text-gray-300">
                     {!! $comment->renderBodyWithMentions() !!}
@@ -104,7 +104,7 @@
 
         {{-- Reply form --}}
         @if ($isReplying)
-            <form wire:submit="addReply" class="mt-3">
+            <div class="mt-3">
                 {{ $this->replyForm }}
 
                 @if (\Relaticle\Comments\CommentsConfig::areAttachmentsEnabled())
@@ -135,10 +135,10 @@
                 @endif
 
                 <div class="mt-2 flex gap-2">
-                    <button type="submit" class="text-sm font-medium text-primary-600 hover:text-primary-500 dark:text-primary-400">Reply</button>
+                    <button type="button" wire:click="addReply" class="text-sm font-medium text-primary-600 hover:text-primary-500 dark:text-primary-400">Reply</button>
                     <button type="button" wire:click="cancelReply" class="text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400">Cancel</button>
                 </div>
-            </form>
+            </div>
         @endif
 
         {{-- Nested replies --}}
diff --git a/resources/views/livewire/comments.blade.php b/resources/views/livewire/comments.blade.php
index 2b3e4c7..79f6048 100644
--- a/resources/views/livewire/comments.blade.php
+++ b/resources/views/livewire/comments.blade.php
@@ -60,7 +60,7 @@
     {{-- New comment form - only for authorized users --}}
     @auth
         @can('create', \Relaticle\Comments\CommentsConfig::getCommentModel())
-            <form wire:submit="addComment" class="mt-4">
+            <div class="mt-4">
                 {{ $this->commentForm }}
 
                 @if (\Relaticle\Comments\CommentsConfig::areAttachmentsEnabled())
@@ -91,14 +91,14 @@
                 @endif
 
                 <div class="mt-2 flex justify-end">
-                    <button type="submit"
+                    <button type="button" wire:click="addComment"
                         class="inline-flex items-center rounded-lg bg-primary-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 dark:bg-primary-500 dark:hover:bg-primary-400 dark:focus:ring-offset-gray-800"
                         wire:loading.attr="disabled" wire:target="addComment">
                         <span wire:loading.remove wire:target="addComment">Comment</span>
                         <span wire:loading wire:target="addComment">Posting...</span>
                     </button>
                 </div>
-            </form>
+            </div>
         @endcan
     @endauth
 </div>