openstatus.dev
Openstatus
www.openstatus.dev
1import { Link } from "@/components/common/link";
2import { cn } from "@/lib/utils";
3import { ArrowUpRight, ChevronRight } from "lucide-react";
4
5export function TableCellLink({
6 value,
7 className,
8 ...props
9}: React.ComponentProps<typeof Link> & {
10 value: unknown;
11}) {
12 if (typeof value === "string") {
13 const isExternal = props.href?.toString().startsWith("http");
14 const externalProps = isExternal
15 ? { target: "_blank", rel: "noopener noreferrer" }
16 : {};
17 const Icon = isExternal ? ArrowUpRight : ChevronRight;
18 return (
19 <Link
20 className={cn(
21 "group/link flex w-full items-center justify-between gap-2 hover:underline",
22 className,
23 )}
24 {...externalProps}
25 {...props}
26 >
27 <span className="truncate">{value}</span>
28 <Icon className="size-4 flex-shrink-0 text-muted-foreground group-hover/link:text-foreground" />
29 </Link>
30 );
31 }
32 return <div className="text-muted-foreground">-</div>;
33}