- CallSpineEntry.tsx: drop the dead `hasAudio` prop + the early `return null` that sat between hooks in InlinePlayer (React #310 risk). Parent already gates the mount on audio presence. - NodeCard.tsx + nodes/page.tsx: pending-node card no longer double-fires. NodeCard gains `linkToDetail` (default true); the pending branch passes false so the wrapping onClick (open config modal) isn't swallowed by the inner <Link> navigation. List view unchanged. - trips/page.tsx: TripCard badge now buckets on end_date >= today, matching the list's own upcoming/past split — an in-progress trip no longer shows a "Past" badge under "Upcoming". - trips/page.tsx, NodeConfigModal.tsx, nodes/[id]/page.tsx: tall modals get `p-4` on the overlay + `max-h-[90vh] overflow-y-auto` on the panel so they don't clip on short viewports (incidents' CreateModal pattern). - lib/types.ts: IncidentRecord.units / vehicles are optional now, matching Firestore (older docs omit them); incidents/[id] gains a `?? []` guard. Untypechecked (no node/npm locally). next build in deploy.yml gates it. Full list of remaining items in server-26 #109. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
70 lines
2.6 KiB
TypeScript
70 lines
2.6 KiB
TypeScript
import Link from "next/link";
|
|
import { StatusBadge } from "@/components/StatusBadge";
|
|
import type { NodeRecord, SystemRecord } from "@/lib/types";
|
|
|
|
interface Props {
|
|
node: NodeRecord;
|
|
system?: SystemRecord;
|
|
/**
|
|
* When false, the card renders without its `/nodes/[id]` Link wrapper so a
|
|
* parent click handler can take the interaction (pending nodes open the
|
|
* config modal instead of navigating). Defaults to true.
|
|
*/
|
|
linkToDetail?: boolean;
|
|
}
|
|
|
|
export function NodeCard({ node, system, linkToDetail = true }: Props) {
|
|
const lastSeen = node.last_seen
|
|
? new Date(node.last_seen).toLocaleTimeString()
|
|
: "never";
|
|
|
|
const body = (
|
|
<div className="bg-gray-900 border border-gray-800 rounded-lg p-4 hover:border-gray-600 transition-colors cursor-pointer">
|
|
<div className="flex items-start justify-between mb-3">
|
|
<div>
|
|
<p className="font-mono font-semibold text-white">{node.name}</p>
|
|
<p className="text-xs text-gray-500 font-mono">{node.node_id}</p>
|
|
</div>
|
|
<StatusBadge status={node.status} />
|
|
</div>
|
|
<div className="space-y-1 text-xs font-mono text-gray-400">
|
|
<div className="flex justify-between">
|
|
<span>System</span>
|
|
<span className="text-gray-300">{system?.name ?? "Unassigned"}</span>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<span>Location</span>
|
|
<span className="text-gray-300">
|
|
{node.lat != null && node.lon != null
|
|
? `${node.lat.toFixed(4)}, ${node.lon.toFixed(4)}`
|
|
: "Unknown"}
|
|
</span>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<span>Last seen</span>
|
|
<span className="text-gray-300">{lastSeen}</span>
|
|
</div>
|
|
</div>
|
|
{!node.configured && (
|
|
<div className="mt-3 text-xs text-indigo-400 font-mono border-t border-gray-800 pt-2">
|
|
⚠ Needs configuration
|
|
</div>
|
|
)}
|
|
{node.is_overridden && (
|
|
<div className="mt-3 text-xs text-yellow-500 font-mono border-t border-gray-800 pt-2 flex justify-between">
|
|
<span>⚠ Local Override</span>
|
|
{node.override_timeout_at ? (
|
|
<span className="text-gray-500">
|
|
Resets: {new Date(node.override_timeout_at).toLocaleTimeString()}
|
|
</span>
|
|
) : (
|
|
<span className="text-gray-500">Permanent</span>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
|
|
return linkToDetail ? <Link href={`/nodes/${node.node_id}`}>{body}</Link> : body;
|
|
}
|