fix: show user-friendly error on file upload failure (413)

Livewire fires a livewire-upload-error JS event when an upload fails,
including 413 responses from the server. Add x-on: Alpine listeners
on the comment and reply forms to display an error message instead of
silently failing. Use x-on: instead of @ shorthand to avoid Blade
parsing @livewire as a directive.

resources/views/livewire/comment-item.blade.php

@@ -104,7 +104,11 @@
 
         {{-- Reply form --}}
         @if ($isReplying)
-            <div class="mt-3">
+            <div class="mt-3"
+                x-data="{ uploadError: null }"
+                x-on:livewire-upload-error.window="uploadError = '{{ __('File upload failed. The file may be too large or an unsupported type.') }}'"
+                x-on:livewire-upload-start.window="uploadError = null"
+            >
                 {{ $this->replyForm }}
 
                 @if (!empty($replyAttachments))
@@ -120,6 +124,7 @@
                     @error('replyAttachments.*')
                         <p class="mt-1 text-sm text-danger-600 dark:text-danger-400">{{ $message }}</p>
                     @enderror
+                    <p x-show="uploadError" x-text="uploadError" class="mt-1 text-sm text-danger-600 dark:text-danger-400"></p>
                 @endif
 
                 <div class="mt-2 flex items-center justify-between">

resources/views/livewire/comments.blade.php

@@ -2,6 +2,9 @@
     @if (!\Relaticle\Comments\CommentsConfig::isBroadcastingEnabled())
         wire:poll.{{ \Relaticle\Comments\CommentsConfig::getPollingInterval() }}
     @endif
+    x-data="{ uploadError: null }"
+    x-on:livewire-upload-error.window="uploadError = '{{ __('File upload failed. The file may be too large or an unsupported type.') }}'"
+    x-on:livewire-upload-start.window="uploadError = null"
 >
     {{-- Sort toggle --}}
     <div class="flex items-center justify-between">
@@ -76,6 +79,7 @@
                     @error('attachments.*')
                         <p class="mt-1 text-sm text-danger-600 dark:text-danger-400">{{ $message }}</p>
                     @enderror
+                    <p x-show="uploadError" x-text="uploadError" class="mt-1 text-sm text-danger-600 dark:text-danger-400"></p>
                 @endif
 
                 <div class="mt-2 flex items-center justify-between">