refactor: use Link component for articles (#425)

ArdentHQ · Nov 9, 2023 · e4396ff · e4396ff
1 parent eb87d03
commit e4396ff
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/resources/js/Components/Articles/ArticleCard/ArticleCard.tsx b/resources/js/Components/Articles/ArticleCard/ArticleCard.tsx
@@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";
 import { ArticleErrorImage } from "./ArticleErrorImage";
 import { FeaturedCollections } from "@/Components/Articles/Article.blocks";
 import { Img } from "@/Components/Image";
+import { Link } from "@/Components/Link";
 import { useAuth } from "@/Contexts/AuthContext";
 import { type DateFormat } from "@/Types/enums";
 import { formatTimestamp } from "@/Utils/dates";
@@ -24,7 +25,7 @@ export const ArticleCard = ({
     const isLargeVariant = variant === "large";
 
     return (
-        <a
+        <Link
             data-testid="ArticleCard"
             href={route("articles.view", article.slug)}
             className={cn(
@@ -106,6 +107,6 @@ export const ArticleCard = ({
                     variant={variant}
                 />
             </div>
-        </a>
+        </Link>
     );
 };
diff --git a/resources/js/Components/Articles/ArticleListItem/ArticleListItem.tsx b/resources/js/Components/Articles/ArticleListItem/ArticleListItem.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from "react-i18next";
 import { FeaturedCollections } from "@/Components/Articles/Article.blocks";
 import { Img } from "@/Components/Image";
+import { Link } from "@/Components/Link";
 import { useAuth } from "@/Contexts/AuthContext";
 import { type DateFormat } from "@/Types/enums";
 import { formatTimestamp } from "@/Utils/dates";
@@ -10,7 +11,7 @@ export const ArticleListItem = ({ article }: { article: App.Data.Articles.Articl
     const { user } = useAuth();
 
     return (
-        <a
+        <Link
             data-testid="ArticleListItem"
             href={route("articles.view", article.slug)}
             className="transition-default group flex space-x-3  bg-white p-6 ring-theme-primary-100 hover:ring dark:border-theme-dark-700 dark:bg-theme-dark-900 dark:hover:ring-theme-dark-500 lg:rounded-lg lg:border lg:border-theme-secondary-300 "
@@ -47,6 +48,6 @@ export const ArticleListItem = ({ article }: { article: App.Data.Articles.Articl
                     </div>
                 </div>
             </div>
-        </a>
+        </Link>
     );
 };