use slightly more elegant way of formulating rel attribute of links

components/Link/Link.tsx

@@ -1,4 +1,5 @@
 import NextLink from "next/link";
+import objStr from "obj-str";
 import { styled, theme } from "../../lib/styles/stitches.config";
 import { baseUrl } from "../../lib/config";
 import type { ComponentProps } from "react";
@@ -49,7 +50,11 @@ const Link = ({ href, rel, target, prefetch = false, underline = true, openInNew
       <StyledLink
         href={href}
         target={target || "_blank"}
-        rel={`${rel || ""} noopener ${isExternal ? "noreferrer" : ""}`.trim()}
+        rel={objStr({
+          [`${rel}`]: rel, // prepend whatever string is passed via optional `rel` prop
+          noopener: true,
+          noreferrer: isExternal, // don't add "noreferrer" if link isn't external, and only opening in a new tab
+        })}
         underline={underline}
         {...rest}
       />

package.json

@@ -20,7 +20,7 @@
     "@fontsource/comic-neue": "4.5.8",
     "@fontsource/inter": "4.5.11",
     "@fontsource/roboto-mono": "4.5.7",
-    "@giscus/react": "^2.1.1",
+    "@giscus/react": "^2.2.0",
     "@hcaptcha/react-hcaptcha": "^1.4.4",
     "@novnc/novnc": "github:novnc/novnc#cdfb33665195eb9a73fb00feb6ebaccd1068cd50",
     "@octokit/graphql": "^5.0.0",
@@ -45,6 +45,7 @@
     "next": "12.2.4-canary.8",
     "next-mdx-remote": "^4.1.0",
     "next-seo": "^5.5.0",
+    "obj-str": "^1.1.0",
     "p-map": "^5.5.0",
     "p-memoize": "^7.1.0",
     "prop-types": "^15.8.1",

yarn.lock

@@ -1018,12 +1018,12 @@
   resolved "https://registry.yarnpkg.com/@fontsource/roboto-mono/-/roboto-mono-4.5.7.tgz#69a89b679ab962ea3591438f35833b09f0f8980f"
   integrity sha512-1uBjM95BEz7zJlmmnpNAM5afMvIxx0wqr86eA76vRqZw8OF5wmsRqYfF3caHuVarBH9/AGN7t9h+3UXK8fjq/Q==
 
-"@giscus/react@^2.1.1":
+"@giscus/react@^2.2.0":
-  version "2.1.1"
+  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/@giscus/react/-/react-2.1.1.tgz#8f0e07d1db5b7b1b9106c1c5c8b6f0a334d8b138"
+  resolved "https://registry.yarnpkg.com/@giscus/react/-/react-2.2.0.tgz#b5fcec12ea19ecbf832d44996346f21a0ae50621"
-  integrity sha512-YTZBbOILVKkWg0kUy+SRlkM6InSRWG7mefVEDcHQmC2saD1Voci16hT7cUqZPie3O1IG9M4yXIU4LxKWvxxE5g==
+  integrity sha512-MXjKAQyO85ZdC8OVApNQsJhPvTJcuUf5GmQw2KdvNcBVivUpVrA+NUppdwsrI+lK6jEX4ZMVOCnbJ5GaQddaAA==
   dependencies:
-    giscus "^1.1.1"
+    giscus "^1.2.0"
 
 "@hcaptcha/react-hcaptcha@^1.4.4":
   version "1.4.4"
@@ -2037,7 +2037,7 @@ braces@^3.0.2:
   dependencies:
     fill-range "^7.0.1"
 
-browserslist@^4.20.2, browserslist@^4.21.2:
+browserslist@^4.20.2, browserslist@^4.21.3:
   version "4.21.3"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.3.tgz#5df277694eb3c48bc5c4b05af3e8b7e09c5a6d1a"
   integrity sha512-898rgRXLAyRkM1GryrrBHGkqA5hlpkV5MhtZwg9QXeiyLUYs2k00Un05aX5l2/yJIOObYKOpS2JNo8nJDE7fWQ==
@@ -2226,22 +2226,22 @@ copy-to-clipboard@^3.3.1:
     toggle-selection "^1.0.6"
 
 core-js-compat@^3.21.0, core-js-compat@^3.22.1:
-  version "3.24.0"
+  version "3.24.1"
-  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.24.0.tgz#885958fac38bf3f4464a90f2663b4620f6aee6e3"
+  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.24.1.tgz#d1af84a17e18dfdd401ee39da9996f9a7ba887de"
-  integrity sha512-F+2E63X3ff/nj8uIrf8Rf24UDGIz7p838+xjEp+Bx3y8OWXj+VTPPZNCtdqovPaS9o7Tka5mCH01Zn5vOd6UQg==
+  integrity sha512-XhdNAGeRnTpp8xbD+sR/HFDK9CbeeeqXT6TuofXh3urqEevzkWmLRgrVoykodsw8okqo2pu1BOmuCKrHx63zdw==
   dependencies:
-    browserslist "^4.21.2"
+    browserslist "^4.21.3"
     semver "7.0.0"
 
 core-js-pure@^3.20.2:
-  version "3.24.0"
+  version "3.24.1"
-  resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.24.0.tgz#10eeb90dbf0d670a6b22b081aecc7deb2faec7e1"
+  resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.24.1.tgz#8839dde5da545521bf282feb7dc6d0b425f39fd3"
-  integrity sha512-uzMmW8cRh7uYw4JQtzqvGWRyC2T5+4zipQLQdi2FmiRqP83k3d6F3stv2iAlNhOs6cXN401FCD5TL0vvleuHgA==
+  integrity sha512-r1nJk41QLLPyozHUUPmILCEMtMw24NG4oWK6RbsDdjzQgg9ZvrUsPBj1MnG0wXXp1DCDU6j+wUvEmBSrtRbLXg==
 
 core-js@^3.1.3:
-  version "3.24.0"
+  version "3.24.1"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.24.0.tgz#4928d4e99c593a234eb1a1f9abd3122b04d3ac57"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.24.1.tgz#cf7724d41724154010a6576b7b57d94c5d66e64f"
-  integrity sha512-IeOyT8A6iK37Ep4kZDD423mpi6JfPRoPUdQwEWYiGolvn4o6j2diaRzNfDfpTdu3a5qMbrGUzKUpYpRY8jXCkQ==
+  integrity sha512-0QTBSYSUZ6Gq21utGzkfITDylE8jWC9Ne1D2MrhvlsZBI1x39OdDIVbzSqtgMndIy6BlHxBXpMGqzZmnztg2rg==
 
 cosmiconfig@^7.0.1:
   version "7.0.1"
@@ -3002,10 +3002,10 @@ get-symbol-description@^1.0.0:
     call-bind "^1.0.2"
     get-intrinsic "^1.1.1"
 
-giscus@^1.1.1:
+giscus@^1.2.0:
-  version "1.1.1"
+  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/giscus/-/giscus-1.1.1.tgz#32e4d6a8d76b0a0eb312b8c9b1fe476115483a65"
+  resolved "https://registry.yarnpkg.com/giscus/-/giscus-1.2.0.tgz#c94477a1c571abc4ac6dca656da7be46f880a708"
-  integrity sha512-WE0cjvf/OZ58EpYzdX8c1minxroSIXRSUy6APNQeaSwQBHwL6DjLH0Cn9n/D/LPlE8d3jxzy3sBFE6A00q586g==
+  integrity sha512-IpfWvU0/hYbMGQKuoPlED8wWmluRYIOjtrBCnL7logsWjMpPRxiAC2pUIC0+SC0pDMOqXrk1onTYMHgwgRpRzg==
   dependencies:
     lit "^2.2.8"
 
@@ -4423,6 +4423,11 @@ nth-check@^2.0.1:
   dependencies:
     boolbase "^1.0.0"
 
+obj-str@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/obj-str/-/obj-str-1.1.0.tgz#9df09178a4889ad7693ff1d25c872d67f2688d07"
+  integrity sha512-iQNCv4NPzzVSnG4nVmkBsBwSq3+Z5/X/Yi4omFpzALC4ZbLXd4QByOFqWd+Khh2nQnbzhsklRxbDwhYKHotrYA==
+
 object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"