Initial commit: Port Nimara CRM (Layers 0-4)

Full CRM rebuild with Next.js 15, TypeScript, Tailwind, Drizzle ORM, PostgreSQL, Redis, BullMQ, MinIO, and Socket.io. Includes 461 source files covering clients, berths, interests/pipeline, documents/EOI, expenses/invoices, email, notifications, dashboard, admin, and client portal. CI/CD via Gitea Actions with Docker builds. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-26 11:52:51 +01:00
commit 67d7e6e3d5
572 changed files with 86496 additions and 0 deletions
--- a/src/components/berths/berth-form.tsx
+++ b/src/components/berths/berth-form.tsx
@@ -0,0 +1,305 @@
+'use client';
+
+import { useState } from 'react';
+import { useForm } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { toast } from 'sonner';
+
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import {
+  Sheet,
+  SheetContent,
+  SheetHeader,
+  SheetTitle,
+  SheetFooter,
+} from '@/components/ui/sheet';
+import { Separator } from '@/components/ui/separator';
+import { Switch } from '@/components/ui/switch';
+import { TagPicker } from '@/components/shared/tag-picker';
+import { apiFetch } from '@/lib/api/client';
+import { updateBerthSchema, type UpdateBerthInput } from '@/lib/validators/berths';
+
+interface BerthFormProps {
+  berth: {
+    id: string;
+    mooringNumber: string;
+    area: string | null;
+    status: string;
+    lengthFt: string | null;
+    lengthM: string | null;
+    widthFt: string | null;
+    widthM: string | null;
+    draftFt: string | null;
+    draftM: string | null;
+    widthIsMinimum: boolean | null;
+    price: string | null;
+    priceCurrency: string;
+    tenureType: string;
+    tenureYears: number | null;
+    tenureStartDate: string | null;
+    tenureEndDate: string | null;
+    powerCapacity: string | null;
+    voltage: string | null;
+    mooringType: string | null;
+    access: string | null;
+    berthApproved: boolean | null;
+    tags: Array<{ id: string; name: string; color: string }>;
+  };
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+
+export function BerthForm({ berth, open, onOpenChange }: BerthFormProps) {
+  const queryClient = useQueryClient();
+  const [tagIds, setTagIds] = useState<string[]>(berth.tags.map((t) => t.id));
+
+  const {
+    register,
+    handleSubmit,
+    setValue,
+    watch,
+    formState: { errors, isSubmitting },
+    reset,
+  } = useForm<UpdateBerthInput>({
+    resolver: zodResolver(updateBerthSchema),
+    defaultValues: {
+      area: berth.area ?? undefined,
+      lengthFt: berth.lengthFt ? Number(berth.lengthFt) : undefined,
+      lengthM: berth.lengthM ? Number(berth.lengthM) : undefined,
+      widthFt: berth.widthFt ? Number(berth.widthFt) : undefined,
+      widthM: berth.widthM ? Number(berth.widthM) : undefined,
+      draftFt: berth.draftFt ? Number(berth.draftFt) : undefined,
+      draftM: berth.draftM ? Number(berth.draftM) : undefined,
+      widthIsMinimum: berth.widthIsMinimum ?? false,
+      price: berth.price ? Number(berth.price) : undefined,
+      priceCurrency: berth.priceCurrency,
+      tenureType: berth.tenureType as 'permanent' | 'fixed_term',
+      tenureYears: berth.tenureYears ?? undefined,
+      tenureStartDate: berth.tenureStartDate ?? undefined,
+      tenureEndDate: berth.tenureEndDate ?? undefined,
+      powerCapacity: berth.powerCapacity ?? undefined,
+      voltage: berth.voltage ?? undefined,
+      mooringType: berth.mooringType ?? undefined,
+      access: berth.access ?? undefined,
+      berthApproved: berth.berthApproved ?? false,
+    },
+  });
+
+  const tagMutation = useMutation({
+    mutationFn: (ids: string[]) =>
+      apiFetch(`/api/v1/berths/${berth.id}/tags`, {
+        method: 'PUT',
+        body: { tagIds: ids },
+      }),
+  });
+
+  async function onSubmit(data: UpdateBerthInput) {
+    try {
+      await apiFetch(`/api/v1/berths/${berth.id}`, {
+        method: 'PATCH',
+        body: data,
+      });
+      await tagMutation.mutateAsync(tagIds);
+      queryClient.invalidateQueries({ queryKey: ['berths'] });
+      queryClient.invalidateQueries({ queryKey: ['berth', berth.id] });
+      toast.success('Berth updated');
+      onOpenChange(false);
+    } catch (err: unknown) {
+      const message = err instanceof Error ? err.message : 'Failed to update berth';
+      toast.error(message);
+    }
+  }
+
+  const tenureType = watch('tenureType');
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent className="w-[480px] sm:w-[540px] overflow-y-auto">
+        <SheetHeader>
+          <SheetTitle>Edit Berth {berth.mooringNumber}</SheetTitle>
+        </SheetHeader>
+
+        <form onSubmit={handleSubmit(onSubmit)} className="space-y-6 py-6">
+          {/* Basic Info */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Basic Info
+            </h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="space-y-2">
+                <Label htmlFor="area">Area</Label>
+                <Input id="area" {...register('area')} placeholder="e.g. Marina A" />
+              </div>
+              <div className="space-y-2">
+                <Label htmlFor="mooringType">Mooring Type</Label>
+                <Input id="mooringType" {...register('mooringType')} />
+              </div>
+            </div>
+            <div className="space-y-2">
+              <Label htmlFor="access">Access</Label>
+              <Input id="access" {...register('access')} />
+            </div>
+            <div className="flex items-center gap-2">
+              <Switch
+                id="berthApproved"
+                checked={watch('berthApproved') ?? false}
+                onCheckedChange={(v) => setValue('berthApproved', v)}
+              />
+              <Label htmlFor="berthApproved">Berth Approved</Label>
+            </div>
+          </div>
+
+          <Separator />
+
+          {/* Dimensions */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Dimensions
+            </h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="space-y-2">
+                <Label>Length (ft)</Label>
+                <Input type="number" step="0.1" {...register('lengthFt')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Length (m)</Label>
+                <Input type="number" step="0.1" {...register('lengthM')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Width (ft)</Label>
+                <Input type="number" step="0.1" {...register('widthFt')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Width (m)</Label>
+                <Input type="number" step="0.1" {...register('widthM')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Draft (ft)</Label>
+                <Input type="number" step="0.1" {...register('draftFt')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Draft (m)</Label>
+                <Input type="number" step="0.1" {...register('draftM')} />
+              </div>
+            </div>
+            <div className="flex items-center gap-2">
+              <Switch
+                id="widthIsMinimum"
+                checked={watch('widthIsMinimum') ?? false}
+                onCheckedChange={(v) => setValue('widthIsMinimum', v)}
+              />
+              <Label htmlFor="widthIsMinimum">Width is minimum</Label>
+            </div>
+          </div>
+
+          <Separator />
+
+          {/* Price */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Price
+            </h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="space-y-2">
+                <Label>Price</Label>
+                <Input type="number" step="0.01" {...register('price')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Currency</Label>
+                <Input {...register('priceCurrency')} placeholder="USD" maxLength={3} />
+              </div>
+            </div>
+          </div>
+
+          <Separator />
+
+          {/* Tenure */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Tenure
+            </h3>
+            <div className="space-y-2">
+              <Label>Tenure Type</Label>
+              <Select
+                value={tenureType}
+                onValueChange={(v) => setValue('tenureType', v as 'permanent' | 'fixed_term')}
+              >
+                <SelectTrigger>
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="permanent">Permanent</SelectItem>
+                  <SelectItem value="fixed_term">Fixed Term</SelectItem>
+                </SelectContent>
+              </Select>
+            </div>
+            {tenureType === 'fixed_term' && (
+              <div className="grid grid-cols-3 gap-4">
+                <div className="space-y-2">
+                  <Label>Years</Label>
+                  <Input type="number" {...register('tenureYears')} />
+                </div>
+                <div className="space-y-2">
+                  <Label>Start Date</Label>
+                  <Input type="date" {...register('tenureStartDate')} />
+                </div>
+                <div className="space-y-2">
+                  <Label>End Date</Label>
+                  <Input type="date" {...register('tenureEndDate')} />
+                </div>
+              </div>
+            )}
+          </div>
+
+          <Separator />
+
+          {/* Infrastructure */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Infrastructure
+            </h3>
+            <div className="grid grid-cols-2 gap-4">
+              <div className="space-y-2">
+                <Label>Power Capacity</Label>
+                <Input {...register('powerCapacity')} />
+              </div>
+              <div className="space-y-2">
+                <Label>Voltage</Label>
+                <Input {...register('voltage')} />
+              </div>
+            </div>
+          </div>
+
+          <Separator />
+
+          {/* Tags */}
+          <div className="space-y-4">
+            <h3 className="text-sm font-medium text-muted-foreground uppercase tracking-wider">
+              Tags
+            </h3>
+            <TagPicker selectedIds={tagIds} onChange={setTagIds} />
+          </div>
+
+          <SheetFooter>
+            <Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
+              Cancel
+            </Button>
+            <Button type="submit" disabled={isSubmitting}>
+              {isSubmitting ? 'Saving...' : 'Save Changes'}
+            </Button>
+          </SheetFooter>
+        </form>
+      </SheetContent>
+    </Sheet>
+  );
+}