8699f81879
Replaces every em-dash and en-dash with regular ASCII hyphens across comments, JSX strings, and dev-facing logs. Mostly cosmetic but stops the inconsistent mix that crept in over the last few months (some files used em-dashes in comments, others didn't, some used both). Bundles two small dashboard-layout tweaks that touch a couple of already-modified files: - (dashboard)/layout.tsx main padding goes from p-6 to pt-3 px-6 pb-6 so page content sits closer to the topbar. - Sidebar now receives the ports list it needs for the footer port switcher. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
104 lines
3.1 KiB
TypeScript
104 lines
3.1 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { useParams } from 'next/navigation';
|
|
import { format } from 'date-fns';
|
|
|
|
import {
|
|
Table,
|
|
TableHeader,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableRow,
|
|
} from '@/components/ui/table';
|
|
import { Badge } from '@/components/ui/badge';
|
|
import { EmptyState } from '@/components/shared/empty-state';
|
|
|
|
interface ClientCompaniesTabProps {
|
|
clientId: string;
|
|
companies: Array<{
|
|
membershipId: string;
|
|
role: string;
|
|
isPrimary: boolean;
|
|
startDate: string | Date;
|
|
company: {
|
|
id: string;
|
|
name: string;
|
|
legalName: string | null;
|
|
status: string;
|
|
};
|
|
}>;
|
|
}
|
|
|
|
function formatSince(startDate: string | Date): string {
|
|
const d = typeof startDate === 'string' ? new Date(startDate) : startDate;
|
|
if (Number.isNaN(d.getTime())) return '-';
|
|
return format(d, 'MMM d, yyyy');
|
|
}
|
|
|
|
export function ClientCompaniesTab({ clientId: _clientId, companies }: ClientCompaniesTabProps) {
|
|
const routeParams = useParams<{ portSlug: string }>();
|
|
const portSlug = routeParams?.portSlug ?? '';
|
|
|
|
if (companies.length === 0) {
|
|
return (
|
|
<EmptyState
|
|
title="No company memberships"
|
|
description="This client is not affiliated with any companies yet. Add a membership from a company's detail page."
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<h3 className="text-sm font-medium">Company affiliations</h3>
|
|
<div className="rounded-md border">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Company</TableHead>
|
|
<TableHead>Role</TableHead>
|
|
<TableHead>Primary</TableHead>
|
|
<TableHead>Since</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{companies.map((m) => (
|
|
<TableRow key={m.membershipId}>
|
|
<TableCell>
|
|
<Link
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
href={`/${portSlug}/companies/${m.company.id}` as any}
|
|
className="text-primary hover:underline"
|
|
>
|
|
{m.company.name}
|
|
</Link>
|
|
{m.company.legalName && (
|
|
<span className="ml-2 text-xs text-muted-foreground">
|
|
({m.company.legalName})
|
|
</span>
|
|
)}
|
|
</TableCell>
|
|
<TableCell className="capitalize">{m.role.replace('_', ' ')}</TableCell>
|
|
<TableCell>
|
|
{m.isPrimary ? (
|
|
<Badge variant="secondary" className="text-xs">
|
|
Primary
|
|
</Badge>
|
|
) : (
|
|
<span className="text-muted-foreground">-</span>
|
|
)}
|
|
</TableCell>
|
|
<TableCell className="text-muted-foreground text-sm">
|
|
{formatSince(m.startDate)}
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|