From 7d014c64906c904694b30fa79f8a80021e1f93b0 Mon Sep 17 00:00:00 2001
From: Rebecca Hong <34019925+rebeccahongsf@users.noreply.github.com>
Date: Tue, 7 May 2024 09:02:06 -0700
Subject: [PATCH] Fixup action-link className (#6)

---
 src/components/elements/action-link.tsx |  4 ++--
 src/components/elements/button.tsx      |  2 +-
 src/components/elements/link.tsx        | 12 ++++++------
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/elements/action-link.tsx b/src/components/elements/action-link.tsx
index 3671655d..9c162570 100644
--- a/src/components/elements/action-link.tsx
+++ b/src/components/elements/action-link.tsx
@@ -10,9 +10,9 @@ type Props = HtmlHTMLAttributes<HTMLAnchorElement> & {
   href: string
 };
 
-const ActionLink = ({ children, ...props }: Props) => {
+const ActionLink = ({ children, className, ...props }: Props) => {
   return (
-    <Link {...props} className={twMerge("relative", props.className)}>
+    <Link {...props} className={twMerge("relative", className?.replace("link--action", ""))}>
       {children}
       <ArrowRightIcon width={20} className="ml-2 inline-block" />
     </Link>
diff --git a/src/components/elements/button.tsx b/src/components/elements/button.tsx
index e895a996..96aeabff 100644
--- a/src/components/elements/button.tsx
+++ b/src/components/elements/button.tsx
@@ -82,7 +82,7 @@ export const Button = ({
   return (
     <Link
       href={href}
-      className={twMerge(standardClasses, className)}
+      className={twMerge(standardClasses, className?.replace("button", ""))}
       {...props}
     >
       {children}
diff --git a/src/components/elements/link.tsx b/src/components/elements/link.tsx
index e754e9af..03f7b94b 100644
--- a/src/components/elements/link.tsx
+++ b/src/components/elements/link.tsx
@@ -12,7 +12,7 @@ type Props = HtmlHTMLAttributes<HTMLAnchorElement | HTMLButtonElement> & LinkPro
   href: string
 }
 
-const DrupalLink = ({href, className, children, ...props}: Props) => {
+const DrupalLink = ({href, children, ...props}: Props) => {
   // Make sure all links have a href.
   href = href || "#"
   const drupalBase: string = (process.env.NEXT_PUBLIC_DRUPAL_BASE_URL || "").replace(/\/$/, "");
@@ -21,7 +21,7 @@ const DrupalLink = ({href, className, children, ...props}: Props) => {
     href = href.replace(drupalBase, "").replace("<front>", "/");
   }
 
-  if (className?.includes("link--action")) {
+  if (props.className?.includes("link--action")) {
     return (
       <ActionLink href={href} {...props}>
         {children}
@@ -29,12 +29,12 @@ const DrupalLink = ({href, className, children, ...props}: Props) => {
     )
   }
 
-  if (className?.includes("button")) {
+  if (props.className?.includes("button")) {
     return (
       <Button
         href={href}
-        big={className.includes("--big")}
-        secondary={className.includes("--secondary")}
+        big={props.className.includes("--big")}
+        secondary={props.className.includes("--secondary")}
         {...props}
       >
         {children}
@@ -43,7 +43,7 @@ const DrupalLink = ({href, className, children, ...props}: Props) => {
   }
 
   return (
-    <Link href={href} className={className} {...props}>
+    <Link href={href} className={props.className} {...props}>
       {children}
       {href.startsWith("mailto") &&
         <EnvelopeIcon width={20} className="ml-4 inline-block"/>