[dyad] Added 'nofollow' warning to links - wrote 1 file(s)
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user