112 lines
4.1 KiB
TypeScript
112 lines
4.1 KiB
TypeScript
|
import { redirect } from 'next/navigation';
|
||
|
|
import { Anchor } from 'lucide-react';
|
||
|
|
import type { Metadata } from 'next';
|
||
|
|
|
||
|
|
import { getPortalSession } from '@/lib/portal/auth';
|
||
|
|
import { getClientInterests } from '@/lib/services/portal.service';
|
||
|
|
import { Badge } from '@/components/ui/badge';
|
||
|
|
|
||
|
|
export const metadata: Metadata = { title: 'Interests' };
|
||
|
|
|
||
|
|
const STAGE_LABELS: Record<string, string> = {
|
||
|
|
open: 'Open',
|
||
|
|
details_sent: 'Details Sent',
|
||
|
|
in_communication: 'In Communication',
|
||
|
|
visited: 'Visited',
|
||
|
|
signed_eoi_nda: 'EOI / NDA Signed',
|
||
|
|
deposit_10pct: 'Deposit Received',
|
||
|
|
contract: 'Contract Stage',
|
||
|
|
completed: 'Completed',
|
||
|
|
};
|
||
|
|
|
||
|
|
const STAGE_COLORS: Record<string, 'default' | 'secondary' | 'destructive' | 'outline'> = {
|
||
|
|
open: 'secondary',
|
||
|
|
details_sent: 'secondary',
|
||
|
|
in_communication: 'default',
|
||
|
|
visited: 'default',
|
||
|
|
signed_eoi_nda: 'default',
|
||
|
|
deposit_10pct: 'default',
|
||
|
|
contract: 'default',
|
||
|
|
completed: 'outline',
|
||
|
|
};
|
||
|
|
|
||
|
|
export default async function PortalInterestsPage() {
|
||
|
|
const session = await getPortalSession();
|
||
|
|
if (!session) redirect('/portal/login');
|
||
|
|
|
||
|
|
const interests = await getClientInterests(session.clientId, session.portId);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="space-y-6">
|
||
|
|
<div>
|
||
|
|
<h1 className="text-2xl font-semibold text-gray-900">Berth Interests</h1>
|
||
|
|
<p className="text-sm text-gray-500 mt-1">
|
||
|
|
Your berth enquiries and applications
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{interests.length === 0 ? (
|
||
|
|
<div className="bg-white rounded-lg border p-12 text-center">
|
||
|
|
<Anchor className="h-10 w-10 text-gray-300 mx-auto mb-3" />
|
||
|
|
<p className="text-gray-500 font-medium">No interests on file</p>
|
||
|
|
<p className="text-sm text-gray-400 mt-1">
|
||
|
|
Contact your port representative to discuss available berths.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
) : (
|
||
|
|
<div className="space-y-3">
|
||
|
|
{interests.map((interest) => (
|
||
|
|
<div
|
||
|
|
key={interest.id}
|
||
|
|
className="bg-white rounded-lg border p-5"
|
||
|
|
>
|
||
|
|
<div className="flex items-start justify-between gap-4">
|
||
|
|
<div className="flex-1 min-w-0">
|
||
|
|
<div className="flex items-center gap-2 mb-1">
|
||
|
|
{interest.berthMooringNumber ? (
|
||
|
|
<span className="font-medium text-gray-900">
|
||
|
|
Berth {interest.berthMooringNumber}
|
||
|
|
</span>
|
||
|
|
) : (
|
||
|
|
<span className="font-medium text-gray-900">General Interest</span>
|
||
|
|
)}
|
||
|
|
{interest.berthArea && (
|
||
|
|
<span className="text-sm text-gray-400">— {interest.berthArea}</span>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
{interest.leadCategory && (
|
||
|
|
<p className="text-sm text-gray-500 capitalize">
|
||
|
|
{interest.leadCategory.replace(/_/g, ' ')}
|
||
|
|
</p>
|
||
|
|
)}
|
||
|
|
<div className="flex flex-wrap gap-2 mt-2 text-xs text-gray-400">
|
||
|
|
{interest.dateFirstContact && (
|
||
|
|
<span>
|
||
|
|
First contact:{' '}
|
||
|
|
{new Date(interest.dateFirstContact).toLocaleDateString('en-US', {
|
||
|
|
year: 'numeric',
|
||
|
|
month: 'short',
|
||
|
|
day: 'numeric',
|
||
|
|
})}
|
||
|
|
</span>
|
||
|
|
)}
|
||
|
|
{interest.eoiStatus && (
|
||
|
|
<span>EOI: {interest.eoiStatus.replace(/_/g, ' ')}</span>
|
||
|
|
)}
|
||
|
|
{interest.contractStatus && (
|
||
|
|
<span>Contract: {interest.contractStatus.replace(/_/g, ' ')}</span>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<Badge variant={STAGE_COLORS[interest.pipelineStage] ?? 'default'}>
|
||
|
|
{STAGE_LABELS[interest.pipelineStage] ?? interest.pipelineStage}
|
||
|
|
</Badge>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|