Improve support attachment validation errors

resources/js/pages/support/show.tsx

@@ -2,6 +2,7 @@ import { Head, Link, useForm } from '@inertiajs/react';
 import { ArrowLeft, FileDown, FileUp, Lock, Send } from 'lucide-react';
 import type { FormEvent, ReactNode } from 'react';
 import { useRef } from 'react';
+import { SupportAttachmentErrors } from '@/components/support-attachment-errors';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
@@ -100,10 +101,7 @@ export default function SupportShow({ conversation }: Props) {
                                     maxLength={2000}
                                 />
                             </Field>
-                            <Field
-                                label="Attachments"
-                                error={form.errors.attachments}
-                            >
+                            <Field label="Attachments">
                                 <Input
                                     ref={fileInputRef}
                                     type="file"
@@ -134,6 +132,7 @@ export default function SupportShow({ conversation }: Props) {
                                         className="h-1.5 w-full"
                                     />
                                 )}
+                                <SupportAttachmentErrors errors={form.errors} />
                             </Field>
                             <Button
                                 type="submit"