MeghdadFadaee/nyone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve support attachment validation errors

Browse Source
This commit is contained in:
Meghdad Fadaee
2026-05-16 22:19:55 +03:30
parent e633805ed3
commit 95d14f2cec
8 changed files with 153 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
resources/js/components/support-attachment-errors.tsx Normal file
View File

@@ -0,0 +1,28 @@
type Props = {
errors: Partial<Record<string, string>>;
};
export function SupportAttachmentErrors({ errors }: Props) {
const messages = Object.entries(errors)
.filter(
([key, message]) =>
Boolean(message) &&
(key === 'attachments' || key.startsWith('attachments.')),
)
.map(([key, message]) => ({
key,
message: message as string,
}));
if (messages.length === 0) {
return null;
}
return (
<div className="grid gap-1 rounded-md border border-destructive/30 bg-destructive/10 px-3 py-2 text-sm text-destructive">
{messages.map((item) => (
<div key={item.key}>{item.message}</div>
))}
</div>
);
}

9
resources/js/pages/admin/support/show.tsx
View File

@@ -11,6 +11,7 @@ import {
} 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';
@@ -142,10 +143,7 @@ export default function AdminSupportShow({ conversation }: Props) {
maxLength={2000}
/>
</Field>
<Field
label="Attachments"
error={form.errors.attachments}
>
<Field label="Attachments">
<Input
ref={fileInputRef}
type="file"
@@ -178,6 +176,9 @@ export default function AdminSupportShow({ conversation }: Props) {
className="h-1.5 w-full"
/>
)}
<SupportAttachmentErrors
errors={form.errors}
/>
</Field>
<Button
type="submit"

9
resources/js/pages/support/index.tsx
View File

@@ -2,6 +2,7 @@ import { Head, Link, useForm } from '@inertiajs/react';
import { FileUp, LifeBuoy, MessageSquare, 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';
@@ -123,7 +124,7 @@ export default function SupportIndex({ categories, conversations }: Props) {
<div className="mb-5">
<h2 className="font-semibold">New conversation</h2>
<p className="text-sm text-muted-foreground">
Attach up to 3 files, 10 MB each.
Attach up to 3 files, 200 MB each.
</p>
</div>
<form onSubmit={submit} className="grid gap-4">
@@ -164,10 +165,7 @@ export default function SupportIndex({ categories, conversations }: Props) {
maxLength={2000}
/>
</Field>
<Field
label="Attachments"
error={form.errors.attachments}
>
<Field label="Attachments">
<Input
ref={fileInputRef}
type="file"
@@ -198,6 +196,7 @@ export default function SupportIndex({ categories, conversations }: Props) {
className="h-1.5 w-full"
/>
)}
<SupportAttachmentErrors errors={form.errors} />
</Field>
<Button type="submit" disabled={form.processing}>
<Send className="size-4" />

7
resources/js/pages/support/show.tsx
View File

@@ -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"