letsbe/pn-new-crm
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

refactor(clients): strip yacht/company/proxy sections from client form

Browse Source
This commit is contained in:
Matt Ciaccio
2026-04-24 14:27:47 +02:00
parent 367fc9800e
commit a6d6647bb2
1 changed files with 22 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

142
src/components/clients/client-form.tsx
View File

@@ -16,13 +16,7 @@ import {
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import {
Sheet,
SheetContent,
SheetHeader,
SheetTitle,
SheetFooter,
} from '@/components/ui/sheet';
import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetFooter } from '@/components/ui/sheet';
import { Checkbox } from '@/components/ui/checkbox';
import { Separator } from '@/components/ui/separator';
import { TagPicker } from '@/components/shared/tag-picker';
@@ -36,13 +30,7 @@ interface ClientFormProps {
client?: {
id: string;
fullName: string;
companyName?: string | null;
nationality?: string | null;
isProxy?: boolean;
proxyType?: string | null;
actualOwnerName?: string | null;
yachtName?: string | null;
berthSizeDesired?: string | null;
preferredContactMethod?: string | null;
preferredLanguage?: string | null;
timezone?: string | null;
@@ -53,6 +41,7 @@ interface ClientFormProps {
value: string;
label?: string | null;
isPrimary?: boolean;
notes?: string | null;
}>;
tags?: Array<{ id: string }>;
};
@@ -75,13 +64,11 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
defaultValues: {
fullName: '',
contacts: [{ channel: 'email', value: '', isPrimary: true }],
isProxy: false,
tagIds: [],
},
});
const { fields, append, remove } = useFieldArray({ control, name: 'contacts' });
const isProxy = watch('isProxy');
const tagIds = watch('tagIds') ?? [];
// Populate form when editing
@@ -89,14 +76,10 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
if (client && open) {
reset({
fullName: client.fullName,
companyName: client.companyName ?? undefined,
nationality: client.nationality ?? undefined,
isProxy: client.isProxy ?? false,
proxyType: client.proxyType ?? undefined,
actualOwnerName: client.actualOwnerName ?? undefined,
yachtName: client.yachtName ?? undefined,
berthSizeDesired: client.berthSizeDesired ?? undefined,
preferredContactMethod: (client.preferredContactMethod as CreateClientInput['preferredContactMethod']) ?? undefined,
preferredContactMethod:
(client.preferredContactMethod as CreateClientInput['preferredContactMethod']) ??
undefined,
preferredLanguage: client.preferredLanguage ?? undefined,
timezone: client.timezone ?? undefined,
source: (client.source as CreateClientInput['source']) ?? undefined,
@@ -108,6 +91,7 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
value: c.value,
label: c.label ?? undefined,
isPrimary: c.isPrimary ?? false,
notes: c.notes ?? undefined,
}))
: [{ channel: 'email', value: '', isPrimary: true }],
tagIds: client.tags?.map((t) => t.id) ?? [],
@@ -116,7 +100,6 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
reset({
fullName: '',
contacts: [{ channel: 'email', value: '', isPrimary: true }],
isProxy: false,
tagIds: [],
});
}
@@ -151,10 +134,7 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<SheetTitle>{isEdit ? 'Edit Client' : 'New Client'}</SheetTitle>
</SheetHeader>
<form
onSubmit={handleSubmit((data) => mutation.mutate(data))}
className="space-y-6 py-6"
>
<form onSubmit={handleSubmit((data) => mutation.mutate(data))} className="space-y-6 py-6">
{/* Basic Info */}
<div className="space-y-4">
<h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wide">
@@ -170,11 +150,6 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
)}
</div>
<div className="space-y-1">
<Label>Company Name</Label>
<Input {...register('companyName')} placeholder="Acme Corp" />
</div>
<div className="space-y-1">
<Label>Nationality</Label>
<Input {...register('nationality')} placeholder="British" />
@@ -194,9 +169,7 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
type="button"
variant="outline"
size="sm"
onClick={() =>
append({ channel: 'email', value: '', isPrimary: false })
}
onClick={() => append({ channel: 'email', value: '', isPrimary: false })}
>
<Plus className="mr-1 h-3.5 w-3.5" />
Add Contact
@@ -218,7 +191,10 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<Select
value={watch(`contacts.${index}.channel`)}
onValueChange={(v) =>
setValue(`contacts.${index}.channel`, v as 'email' | 'phone' | 'whatsapp' | 'other')
setValue(
`contacts.${index}.channel`,
v as 'email' | 'phone' | 'whatsapp' | 'other',
)
}
>
<SelectTrigger className="h-8">
@@ -254,9 +230,7 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<div className="col-span-1 flex items-center gap-1 pb-1">
<Checkbox
checked={watch(`contacts.${index}.isPrimary`)}
onCheckedChange={(v) =>
setValue(`contacts.${index}.isPrimary`, !!v)
}
onCheckedChange={(v) => setValue(`contacts.${index}.isPrimary`, !!v)}
/>
<Label className="text-xs">Primary</Label>
</div>
@@ -281,72 +255,6 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<Separator />
{/* Proxy */}
<div className="space-y-4">
<h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wide">
Proxy Information
</h3>
<div className="flex items-center gap-2">
<Checkbox
id="isProxy"
checked={watch('isProxy')}
onCheckedChange={(v) => setValue('isProxy', !!v)}
/>
<Label htmlFor="isProxy">This is a proxy client</Label>
</div>
{isProxy && (
<div className="grid grid-cols-2 gap-4">
<div className="space-y-1">
<Label>Proxy Type</Label>
<Select
value={watch('proxyType') ?? ''}
onValueChange={(v) => setValue('proxyType', v)}
>
<SelectTrigger>
<SelectValue placeholder="Select type" />
</SelectTrigger>
<SelectContent>
<SelectItem value="broker">Broker</SelectItem>
<SelectItem value="representative">Representative</SelectItem>
<SelectItem value="family_member">Family Member</SelectItem>
<SelectItem value="legal_counsel">Legal Counsel</SelectItem>
<SelectItem value="other">Other</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-1">
<Label>Actual Owner Name</Label>
<Input
{...register('actualOwnerName')}
placeholder="Actual owner"
/>
</div>
</div>
)}
</div>
<Separator />
{/* Yacht Details */}
<div className="space-y-4">
<h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wide">
Yacht Details
</h3>
<div className="grid grid-cols-2 gap-4">
<div className="col-span-2 space-y-1">
<Label>Yacht Name</Label>
<Input {...register('yachtName')} placeholder="My Yacht" />
</div>
<div className="space-y-1">
<Label>Berth Size Desired</Label>
<Input {...register('berthSizeDesired')} placeholder="e.g. 30m" />
</div>
</div>
</div>
<Separator />
{/* Source & Preferences */}
<div className="space-y-4">
<h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wide">
@@ -357,7 +265,9 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<Label>Source</Label>
<Select
value={watch('source') ?? ''}
onValueChange={(v) => setValue('source', v as 'website' | 'manual' | 'referral' | 'broker')}
onValueChange={(v) =>
setValue('source', v as 'website' | 'manual' | 'referral' | 'broker')
}
>
<SelectTrigger>
<SelectValue placeholder="Select source" />
@@ -374,7 +284,9 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
<Label>Preferred Contact Method</Label>
<Select
value={watch('preferredContactMethod') ?? ''}
onValueChange={(v) => setValue('preferredContactMethod', v as 'email' | 'phone' | 'whatsapp')}
onValueChange={(v) =>
setValue('preferredContactMethod', v as 'email' | 'phone' | 'whatsapp')
}
>
<SelectTrigger>
<SelectValue placeholder="Select method" />
@@ -396,10 +308,7 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
</div>
<div className="col-span-2 space-y-1">
<Label>Source Details</Label>
<Input
{...register('sourceDetails')}
placeholder="Referred by John Doe"
/>
<Input {...register('sourceDetails')} placeholder="Referred by John Doe" />
</div>
</div>
</div>
@@ -409,18 +318,11 @@ export function ClientForm({ open, onOpenChange, client }: ClientFormProps) {
{/* Tags */}
<div className="space-y-2">
<Label>Tags</Label>
<TagPicker
selectedIds={tagIds}
onChange={(ids) => setValue('tagIds', ids)}
/>
<TagPicker selectedIds={tagIds} onChange={(ids) => setValue('tagIds', ids)} />
</div>
<SheetFooter>
<Button
type="button"
variant="outline"
onClick={() => onOpenChange(false)}
>
<Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
Cancel
</Button>
<Button type="submit" disabled={isSubmitting || mutation.isPending}>