[dyad] Added 'nofollow' warning to links - wrote 1 file(s)

This commit is contained in:
[dyad]
2026-01-20 16:26:30 +01:00
parent a04c53bae4
commit d742339c1d

View File

@@ -12,7 +12,13 @@ import {
} from "@/components/ui/table"; } from "@/components/ui/table";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { ExternalLink, Link as LinkIcon } from "lucide-react"; import { ExternalLink, Link as LinkIcon, AlertTriangle } from "lucide-react";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import type { LinkData } from "@/app/actions"; import type { LinkData } from "@/app/actions";
interface LinksDisplayProps { interface LinksDisplayProps {
@@ -88,44 +94,64 @@ export function LinksDisplay({ links }: LinksDisplayProps) {
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
{filteredLinks.map((link, index) => ( {filteredLinks.map((link, index) => {
<TableRow key={index}> const isMissingNoFollow =
<TableCell className="max-w-xs truncate"> link.type === "external" && !link.rel.includes("nofollow");
<a return (
href={link.href} <TableRow key={index}>
target="_blank" <TableCell className="max-w-xs truncate">
rel="noopener noreferrer" <div className="flex items-center justify-between gap-2">
className="flex items-center gap-2 hover:underline" <a
> href={link.href}
{link.type === "external" ? ( target="_blank"
<ExternalLink className="h-4 w-4 flex-shrink-0" /> rel="noopener noreferrer"
) : ( className="flex items-center gap-2 hover:underline min-w-0"
<LinkIcon className="h-4 w-4 flex-shrink-0" /> >
)} {link.type === "external" ? (
<span className="truncate">{link.href}</span> <ExternalLink className="h-4 w-4 flex-shrink-0" />
</a> ) : (
</TableCell> <LinkIcon className="h-4 w-4 flex-shrink-0" />
<TableCell>{link.text || "No anchor text"}</TableCell> )}
<TableCell className="text-center"> <span className="truncate">{link.href}</span>
<Badge variant="secondary" className="capitalize"> </a>
{link.type} {isMissingNoFollow && (
</Badge> <TooltipProvider>
</TableCell> <Tooltip>
<TableCell className="text-center"> <TooltipTrigger>
{link.rel ? ( <AlertTriangle className="h-4 w-4 text-orange-500 flex-shrink-0" />
<div className="flex justify-center gap-1"> </TooltipTrigger>
{link.rel.split(" ").map((r) => ( <TooltipContent>
<Badge key={r} variant="outline"> <p>
{r} External link without 'nofollow' attribute.
</Badge> </p>
))} </TooltipContent>
</Tooltip>
</TooltipProvider>
)}
</div> </div>
) : ( </TableCell>
"-" <TableCell>{link.text || "No anchor text"}</TableCell>
)} <TableCell className="text-center">
</TableCell> <Badge variant="secondary" className="capitalize">
</TableRow> {link.type}
))} </Badge>
</TableCell>
<TableCell className="text-center">
{link.rel ? (
<div className="flex justify-center gap-1">
{link.rel.split(" ").map((r) => (
<Badge key={r} variant="outline">
{r}
</Badge>
))}
</div>
) : (
"-"
)}
</TableCell>
</TableRow>
);
})}
</TableBody> </TableBody>
</Table> </Table>
</Card> </Card>