From dbcf2d044ad11ca6451686ca783888e51f0e5765 Mon Sep 17 00:00:00 2001
From: Zachary Shilton <4624598+zchsh@users.noreply.github.com>
Date: Sun, 23 Jan 2022 12:18:42 -0500
Subject: [PATCH] website: link plugin version badges

---
 website/components/badge/index.tsx              | 7 +++++--
 website/components/remote-plugin-docs/server.js | 8 ++++++--
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/website/components/badge/index.tsx b/website/components/badge/index.tsx
index 358085806..313a259ef 100644
--- a/website/components/badge/index.tsx
+++ b/website/components/badge/index.tsx
@@ -9,18 +9,21 @@ interface BadgeProps {
   label: string
   iconSvg?: string
   theme?: BadgeTheme
+  href?: string
 }
 
 function Badge({
   theme = 'gray',
   label,
   iconSvg,
+  href,
 }: BadgeProps): React.ReactElement {
+  const Elem = href ? 'a' : 'div'
   return (
-    <div className={classnames(s.root, s[`theme-${theme}`])}>
+    <Elem href={href} className={classnames(s.root, s[`theme-${theme}`])}>
       {iconSvg ? <InlineSvg className={s.icon} src={iconSvg} /> : null}
       <span className={s.text}>{label}</span>
-    </div>
+    </Elem>
   )
 }
 
diff --git a/website/components/remote-plugin-docs/server.js b/website/components/remote-plugin-docs/server.js
index 04230c9ba..7845e6ce6 100644
--- a/website/components/remote-plugin-docs/server.js
+++ b/website/components/remote-plugin-docs/server.js
@@ -69,9 +69,13 @@ async function generateStaticProps({
     if (pluginData?.isHcpPackerReady) {
       badgesMdx.push(`<PluginBadge type="hcp_packer_ready" />`)
     }
-    // Add badge showing the latest release version number
+    // Add badge showing the latest release version number,
+    // and link this badge to the latest release
     if (latestReleaseTag) {
-      badgesMdx.push(`<Badge label="${latestReleaseTag}" theme="light-gray"/>`)
+      const href = `https://github.com/${pluginData.repo}/releases/tag/${latestReleaseTag}`
+      badgesMdx.push(
+        `<Badge href="${href}" label="${latestReleaseTag}" theme="light-gray"/>`
+      )
     }
     // If we have badges to add, inject them into the MDX
     if (badgesMdx.length > 0) {