Skip to content

Commit

Permalink
docs(www): run codemod to resolve Invalid <Link> with <a> child (#…
Browse files Browse the repository at this point in the history
  • Loading branch information
backlineint authored Jun 26, 2024
1 parent f56c243 commit c06b861
Show file tree
Hide file tree
Showing 9 changed files with 203 additions and 185 deletions.
17 changes: 9 additions & 8 deletions www/components/card.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,15 @@ interface CardProps extends LinkProps {

export function Card({ children, href, ...props }: CardProps) {
return (
<Link href={href} passHref {...props}>
<a
className={classNames(
"block p-6 bg-white group border border-gray-200 rounded-lg shadow-md card"
)}
>
{children}
</a>
<Link
href={href}
passHref
{...props}
className={classNames(
"block p-6 bg-white group border border-gray-200 rounded-lg shadow-md card"
)}
>
{children}
</Link>
)
}
Expand Down
97 changes: 50 additions & 47 deletions www/components/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -86,33 +86,33 @@ export function Layout({
>
<ul className="grid grid-flow-row gap-2 mb-8 auto-rows-max">
<li>
<Link href="/" passHref>
<a
className={classNames(
"text-sm font-medium hover:underline",
pathname === "/" ? "text-blue-700" : "text-gray-700"
)}
>
Home
</a>
<Link
href="/"
passHref
className={classNames(
"text-sm font-medium hover:underline",
pathname === "/" ? "text-blue-700" : "text-gray-700"
)}
>
Home
</Link>
</li>
{site.links.map((link, index) => {
const isActive =
pathname === link.href || link.activePathNames?.includes(pathname)
return (
<li key={index}>
<Link href={link.href} passHref>
<a
className={classNames(
"text-sm font-medium hover:underline",
isActive ? "text-blue-700" : "text-gray-900"
)}
target={link.external ? "_blank" : "_self"}
rel={link.external ? "noreferrer" : ""}
>
{link.title}
</a>
<Link
href={link.href}
passHref
className={classNames(
"text-sm font-medium hover:underline",
isActive ? "text-blue-700" : "text-gray-900"
)}
target={link.external ? "_blank" : "_self"}
rel={link.external ? "noreferrer" : ""}
>
{link.title}
</Link>
</li>
)
Expand Down Expand Up @@ -170,29 +170,32 @@ export function Layout({
<span className="sr-only">Toggle Menu</span>
</button>
<div className="flex items-center space-x-8">
<Link href="/" passHref>
<a className="items-center flex-shrink hidden font-semibold sm:flex sm:text-lg lg:text-base xl:text-lg">
{site.name}
</a>
<Link
href="/"
passHref
className="items-center flex-shrink hidden font-semibold sm:flex sm:text-lg lg:text-base xl:text-lg"
>
{site.name}
</Link>
<div className="flex-grow hidden grid-flow-col gap-6 mr-4 lg:grid lg:mr-4 lg:gap-4 xl:gap-6 auto-cols-max">
{site.links.map((link) => {
const isActive =
pathname === link.href ||
link.activePathNames?.includes(pathname)
return (
<Link key={link.href} href={link.href} passHref>
<a
className={classNames(
"hover:underline",
mode === "dark" ? "text-white" : "hover:text-black",
isActive ? "text-black" : "text-gray-600"
)}
target={link.external ? "_blank" : "_self"}
rel={link.external ? "noreferrer" : ""}
>
{link.title}
</a>
<Link
key={link.href}
href={link.href}
passHref
className={classNames(
"hover:underline",
mode === "dark" ? "text-white" : "hover:text-black",
isActive ? "text-black" : "text-gray-600"
)}
target={link.external ? "_blank" : "_self"}
rel={link.external ? "noreferrer" : ""}
>
{link.title}
</Link>
)
})}
Expand Down Expand Up @@ -276,17 +279,17 @@ export function Layout({
<Menu.Item key={version.version}>
{({ active }) =>
version.url ? (
<Link href={version.url} passHref>
<a
className={classNames(
"text-sm px-3 py-1 hover:bg-blue-50",
{
"bg-blue-50": active,
}
)}
>
{version.version}
</a>
<Link
href={version.url}
passHref
className={classNames(
"text-sm px-3 py-1 hover:bg-blue-50",
{
"bg-blue-50": active,
}
)}
>
{version.version}
</Link>
) : (
<span
Expand Down
64 changes: 34 additions & 30 deletions www/components/pager.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,39 +13,43 @@ export function Pager({ links }: PagerProps) {
return (
<div className="flex items-center justify-between mt-10 md:mt-14">
{prev ? (
<Link href={prev.href} passHref>
<a className="flex items-center px-4 py-3 leading-none text-gray-600 border rounded-md hover:text-black">
<svg
className="w-4 h-4 mr-2"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M19 12H5M12 19l-7-7 7-7" />
</svg>
{prev.title}
</a>
<Link
href={prev.href}
passHref
className="flex items-center px-4 py-3 leading-none text-gray-600 border rounded-md hover:text-black"
>
<svg
className="w-4 h-4 mr-2"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M19 12H5M12 19l-7-7 7-7" />
</svg>
{prev.title}
</Link>
) : null}
{next ? (
<Link href={next.href} passHref>
<a className="flex items-center px-4 py-3 ml-auto leading-none text-gray-600 border rounded-md hover:text-black">
{next.title}
<svg
className="w-4 h-4 ml-2"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M5 12h14M12 5l7 7-7 7" />
</svg>
</a>
<Link
href={next.href}
passHref
className="flex items-center px-4 py-3 ml-auto leading-none text-gray-600 border rounded-md hover:text-black"
>
{next.title}
<svg
className="w-4 h-4 ml-2"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<path d="M5 12h14M12 5l7 7-7 7" />
</svg>
</Link>
) : null}
</div>
Expand Down
61 changes: 31 additions & 30 deletions www/components/sidebar-nav.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,36 +35,37 @@ export function SidebarNavItem({ items, onLinkClick }: SidebarNavProps) {
return items?.length ? (
<div className="grid grid-flow-row text-sm auto-rows-max">
{items.map((item, index) => (
<Link key={index} href={item.href} passHref>
<a
className={classNames(
"px-2 py-2 flex items-center w-full rounded-md hover:underline text-black",
{
"bg-blue-50": asPath === item.href,
}
)}
onClick={onLinkClick}
target={item.external && "_blank"}
rel={item.external ? "noreferrer" : ""}
>
{item.title}{" "}
{item.external && (
<svg
xmlns="http://www.w3.org/2000/svg"
className="w-3 h-3 ml-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
strokeWidth="2"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/>
</svg>
)}
</a>
<Link
key={index}
href={item.href}
passHref
className={classNames(
"px-2 py-2 flex items-center w-full rounded-md hover:underline text-black",
{
"bg-blue-50": asPath === item.href,
}
)}
onClick={onLinkClick}
target={item.external && "_blank"}
rel={item.external ? "noreferrer" : ""}
>
{item.title}{" "}
{item.external && (
<svg
xmlns="http://www.w3.org/2000/svg"
className="w-3 h-3 ml-1"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
strokeWidth="2"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/>
</svg>
)}
</Link>
))}
</div>
Expand Down
12 changes: 7 additions & 5 deletions www/pages/blog/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default function BlogsPage({ blogs }: BlogsPageProps) {
<article key={blog.slug}>
<h2 className="text-2xl font-bold leading-tight sm:text-3xl md:text-3xl">
<Link href={blog.url} passHref>
<a>{blog.frontMatter.title}</a>
{blog.frontMatter.title}
</Link>
</h2>
<p className="mt-2 text-gray-700">
Expand All @@ -34,10 +34,12 @@ export default function BlogsPage({ blogs }: BlogsPageProps) {
<p className="my-4 text-gray-700">{blog.frontMatter.excerpt}</p>
) : null}

<Link href={blog.url} passHref>
<a className="text-sm text-blue-500 hover:text-black">
Read More →
</a>
<Link
href={blog.url}
passHref
className="text-sm text-blue-500 hover:text-black"
>
Read More →
</Link>
<hr className="py-6 mt-6" />
</article>
Expand Down
56 changes: 29 additions & 27 deletions www/pages/guides/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,35 +40,37 @@ export default function GuidesPage({ guides }: GuidesPageProps) {
) : null}
</div>
{guide.frontMatter.externalUrl ? (
<Link href={guide.frontMatter.externalUrl} passHref>
<a
className="text-sm text-blue-500 transition-colors"
target="_blank"
rel="nofollow"
>
<span className="absolute inset-0" />
<div className="flex items-center">
Read More{" "}
<svg
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="w-3 h-3 ml-2"
>
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3" />
</svg>
</div>
</a>
<Link
href={guide.frontMatter.externalUrl}
passHref
className="text-sm text-blue-500 transition-colors"
target="_blank"
rel="nofollow"
>
<span className="absolute inset-0" />
<div className="flex items-center">
Read More{" "}
<svg
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="w-3 h-3 ml-2"
>
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3" />
</svg>
</div>
</Link>
) : (
<Link href={guide.url} passHref>
<a className="text-sm text-blue-500 transition-colors">
<span className="absolute inset-0" />
Read More →
</a>
<Link
href={guide.url}
passHref
className="text-sm text-blue-500 transition-colors"
>
<span className="absolute inset-0" />
Read More →
</Link>
)}
</article>
Expand Down
Loading

0 comments on commit c06b861

Please sign in to comment.