Add link to TypeScript's release notes on playground navbar

Author: ark120202

src/pages/play/Playground.tsx

@@ -171,23 +171,33 @@ function OutputPane() {
     );
 }
 
+function PlaygroundNavbar() {
+    const tstlLink = "https://github.com/TypeScriptToLua/TypeScriptToLua/blob/master/CHANGELOG.md";
+    const tsMajor = tsVersion.split(".")[0];
+    const tsMinor = tsVersion.split(".")[1];
+    const tsLink = `https://www.typescriptlang.org/docs/handbook/release-notes/typescript-${tsMajor}-${tsMinor}.html`;
+
+    return (
+        <nav className={styles.navbar}>
+            <div className={styles.navbarVersions}>
+                TSTL{" "}
+                <a href={tstlLink} target="_blank" rel="noopener">
+                    <b>v{tstlVersion}</b>
+                </a>
+                <br />
+                &nbsp;&nbsp;TS{" "}
+                <a href={tsLink} target="_blank" rel="noopener">
+                    <b>v{tsVersion}</b>
+                </a>
+            </div>
+        </nav>
+    );
+}
+
 export default function Playground() {
     return (
         <>
-            <nav className={styles.navbar}>
-                <div className={styles.navbarVersion}>
-                    TSTL{" "}
-                    <a
-                        href="https://github.com/TypeScriptToLua/TypeScriptToLua/blob/master/CHANGELOG.md"
-                        target="_blank"
-                        rel="noopener"
-                    >
-                        <b>v{tstlVersion}</b>
-                    </a>
-                    <br />
-                    &nbsp;&nbsp;TS <b>v{tsVersion}</b>
-                </div>
-            </nav>
+            <PlaygroundNavbar />
             <div className={styles.content}>
                 <EditorContextProvider>
                     <InputPane />

src/pages/play/styles.module.scss

@@ -40,7 +40,7 @@ $navbar-height: 50px;
     align-items: center;
 }
 
-.navbarVersion {
+.navbarVersions {
     line-height: 1.25;
     font-size: 14px;
     font-family: monospace;