[dyad] Added 'nofollow' warning to links - wrote 1 file(s)
This commit is contained in:
@@ -12,7 +12,13 @@ import {
|
||||
} from "@/components/ui/table";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
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";
|
||||
|
||||
interface LinksDisplayProps {
|
||||
@@ -88,44 +94,64 @@ export function LinksDisplay({ links }: LinksDisplayProps) {
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{filteredLinks.map((link, index) => (
|
||||
<TableRow key={index}>
|
||||
<TableCell className="max-w-xs truncate">
|
||||
<a
|
||||
href={link.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-2 hover:underline"
|
||||
>
|
||||
{link.type === "external" ? (
|
||||
<ExternalLink className="h-4 w-4 flex-shrink-0" />
|
||||
) : (
|
||||
<LinkIcon className="h-4 w-4 flex-shrink-0" />
|
||||
)}
|
||||
<span className="truncate">{link.href}</span>
|
||||
</a>
|
||||
</TableCell>
|
||||
<TableCell>{link.text || "No anchor text"}</TableCell>
|
||||
<TableCell className="text-center">
|
||||
<Badge variant="secondary" className="capitalize">
|
||||
{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>
|
||||
))}
|
||||
{filteredLinks.map((link, index) => {
|
||||
const isMissingNoFollow =
|
||||
link.type === "external" && !link.rel.includes("nofollow");
|
||||
return (
|
||||
<TableRow key={index}>
|
||||
<TableCell className="max-w-xs truncate">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<a
|
||||
href={link.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center gap-2 hover:underline min-w-0"
|
||||
>
|
||||
{link.type === "external" ? (
|
||||
<ExternalLink className="h-4 w-4 flex-shrink-0" />
|
||||
) : (
|
||||
<LinkIcon className="h-4 w-4 flex-shrink-0" />
|
||||
)}
|
||||
<span className="truncate">{link.href}</span>
|
||||
</a>
|
||||
{isMissingNoFollow && (
|
||||
<TooltipProvider>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<AlertTriangle className="h-4 w-4 text-orange-500 flex-shrink-0" />
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
<p>
|
||||
External link without 'nofollow' attribute.
|
||||
</p>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
"-"
|
||||
)}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableCell>
|
||||
<TableCell>{link.text || "No anchor text"}</TableCell>
|
||||
<TableCell className="text-center">
|
||||
<Badge variant="secondary" className="capitalize">
|
||||
{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>
|
||||
</Table>
|
||||
</Card>
|
||||
|
||||
Reference in New Issue
Block a user