Make communities page subscribe buttons look like links

src/shared/components/common/subscribe-button.tsx

@@ -13,6 +13,7 @@ interface SubscribeButtonProps {
   onFollow: MouseEventHandler;
   onUnFollow: MouseEventHandler;
   loading?: boolean;
+  isLink?: boolean;
 }
 
 export function SubscribeButton({
@@ -23,6 +24,7 @@ export function SubscribeButton({
   onFollow,
   onUnFollow,
   loading = false,
+  isLink = false,
 }: SubscribeButtonProps) {
   let i18key: NoOptionI18nKeys;
 
@@ -44,14 +46,19 @@ export function SubscribeButton({
     }
   }
 
-  const buttonClass = "btn d-block mb-2 w-100";
+  const buttonClass = classNames(
+    "btn",
+    isLink ? "btn-link d-inline-block" : "d-block mb-2 w-100",
+  );
 
   if (!UserService.Instance.myUserInfo) {
     return (
       <>
         <button
           type="button"
-          className={classNames(buttonClass, "btn-secondary")}
+          className={classNames(buttonClass, {
+            "btn-secondary": !isLink,
+          })}
           data-bs-toggle="modal"
           data-bs-target="#remoteFetchModal"
         >
@@ -65,10 +72,9 @@ export function SubscribeButton({
   return (
     <button
       type="button"
-      className={classNames(
+      className={classNames(buttonClass, {
-        buttonClass,
+        [`btn-${subscribed === "Pending" ? "warning" : "secondary"}`]: !isLink,
-        `btn-${subscribed === "Pending" ? "warning" : "secondary"}`,
+      })}
-      )}
       onClick={subscribed === "NotSubscribed" ? onFollow : onUnFollow}
     >
       {loading ? (

src/shared/components/community/communities.tsx

@@ -192,6 +192,7 @@ export class Communities extends Component<any, CommunitiesState> {
                               },
                               this.handleFollow,
                             )}
+                            isLink
                           />
                         </td>
                       </tr>