Add PureScript & Package Set version info (#280)

* Clearly indicate PureScript & package set version

* Update RELEASE.md on updating versions via script

* Add CI check for versions

* Add changelog entry

* Ensure CI catches purs version diff

* Update purs version back to 0.15.2

* Ensure CI check catches package set difference

* Update package set version to correct one

Author: JordanMartinez

.github/workflows/ci.yml

@@ -74,6 +74,18 @@ jobs:
           npm run build:production
           npm run bundle
 
+      - name: Check SharedConfig.purs versions
+        run: |
+          cd client
+          cp src/Try/SharedConfig.purs sharedConfig.out
+          node updateSharedConfigVersions.mjs sharedConfig.out
+          diff src/Try/SharedConfig.purs sharedConfig.out || {
+            echo 'PureScript and/or package set versions in "client/src/Try/SharedConfig.purs"'
+            echo 'do not match the versions extracted from "stack.yaml" and "staging/packages.dhall".'
+            echo 'Please run "cd client && npm run updateConfigVersions". CI will fail until then.'
+            exit 1
+          }
+
       - name: Build client assets
         if: github.event_name == 'release'
         run: |

CHANGELOG.md

@@ -7,6 +7,7 @@ Notable changes to this project are documented in this file. The format is based
 Breaking changes:
 
 New features:
+- Clearly indicate PureScript and package set version (#280 by @JordanMartinez)
 
 Bugfixes:
 - Stop double `main` invocation by updating `es-module-shims` to 1.5.6 (#279 by @JordanMartinez)

RELEASE.md

@@ -40,7 +40,13 @@ Update the package set by doing the following:
         $ spago ls packages | cut -f 1 -d ' ' | xargs spago install
         ```
 
-4. If any packages need NPM dependencies, you can try adding their shims to the import map in `client/public/frame.html`
+4. Update the `client/src/Try/SharedConfig.purs` file by running this command:
+
+        ```console
+        $ npm run updateConfigVersions
+        ```
+
+5. If any packages need NPM dependencies, you can try adding their shims to the import map in `client/public/frame.html`
     - Open up the `generator.jspm.io` URL in the comment
     - Use the 'Add Dependency' search bar to find the NPM dependency
         - If it exists but doesn't exist in that CDN, you can try another one or [open an issue on `jspm/project`](https://github.com/jspm/project#issue-queue-for-the-jspm-cdn)
@@ -49,7 +55,7 @@ Update the package set by doing the following:
     - Copy and paste the content into the `client/public/frame.html` file
     - Ensure `es-module-shims` has version `1.5.5` or greater.
 
-5. If `es-module-shims` releases a new version, you can calculate its SHA-384 via
+6. If `es-module-shims` releases a new version, you can calculate its SHA-384 via
 
         ```console
         $ ESM_VERSION=1.5.5

client/package.json

@@ -10,7 +10,8 @@
     "bundle": "esbuild --outfile=public/js/index.js --bundle --minify --platform=browser --format=iife --tree-shaking=true --footer:js=\"\n\nmain();\" client.js",
     "serve": "http-server public/ -o / --cors=\"Access-Control-Allow-Origin: *\" -c-1",
     "serve:dev": "npm run build:dev && npm run bundle && npm run serve",
-    "serve:production": "npm run build:production && npm run bundle && npm run serve"
+    "serve:production": "npm run build:production && npm run bundle && npm run serve",
+    "updateConfigVersions": "node updateSharedConfigVersions.mjs src/Try/SharedConfig.purs"
   },
   "devDependencies": {
     "esbuild": "^0.14.43",

client/public/css/index.css

@@ -263,10 +263,47 @@ iframe {
     margin-bottom: 10px;
 }
 
+
+footer {
+  background-color: #1d222d;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  gap: 5px;
+}
+
+  footer .footer-separator {
+    color: white;
+  }
+
+  footer .footer-link {
+    display: flex;
+    min-width: 300px;
+    gap: 2px;
+    color: white;
+  }
+
+    footer .footer-link a {
+      color: white;
+    }
+
+      footer .footer-link a:visited {
+        color: white;
+      }
+
 @media all and (max-width: 720px) {
   .no-mobile {
     display: none;
   }
+
+  footer {
+    flex-direction: column;
+    align-items: center;
+  }
+
+    footer .footer-link {
+      min-width: initial;
+    }
 }
 
 @media all and (min-width: 720px) {

client/src/Try/Container.purs

@@ -32,6 +32,7 @@ import Try.Gist (getGistById, tryLoadFileFromGist)
 import Try.GitHub (getRawGitHubFile)
 import Try.QueryString (getQueryStringMaybe)
 import Try.Session (createSessionIdIfNecessary, storeSession, tryRetrieveSession)
+import Try.SharedConfig as SharedConfig
 import Type.Proxy (Proxy(..))
 import Web.HTML (window)
 import Web.HTML.Window (alert)
@@ -220,6 +221,7 @@ component = H.mkComponent
           [ renderMenu
           , renderMobileBanner
           , renderEditor
+          , renderFooter
           ]
       ]
     where
@@ -386,6 +388,25 @@ component = H.mkComponent
             ]
         ]
 
+    renderFooter = do
+      let
+        footerLink linkPrefix linkText linkUrl =
+          HH.div
+            [ HP.class_ $ HH.ClassName "footer-link" ]
+            [ HH.span_
+              [ HH.text linkPrefix ]
+            , HH.a
+              [ HP.href linkUrl
+              , HP.target "_blank"
+              , HP.rel "noopener"
+              ]
+              [ HH.text linkText ]
+            ]
+      HH.footer_
+        [ footerLink "PureScript version:" SharedConfig.pursVersion SharedConfig.pursReleaseUrl
+        , footerLink "Package set version:" SharedConfig.packageSetVersion SharedConfig.packageSetPackageJsonUrl
+        ]
+
     renderCompiled = case _ of
       Left err ->
         renderPlaintext err

client/src/Try/SharedConfig.purs

@@ -0,0 +1,18 @@
+-- | Similar to the `Try.Config` module
+-- | except values below can be used in both
+-- | the dev and production environments
+module Try.SharedConfig where
+
+import Prelude
+
+pursVersion :: String
+pursVersion = "v0.15.2"
+
+pursReleaseUrl :: String
+pursReleaseUrl = "https://github.com/purescript/purescript/releases/tag/" <> pursVersion
+
+packageSetVersion :: String
+packageSetVersion = "0.15.2-20220531"
+
+packageSetPackageJsonUrl :: String
+packageSetPackageJsonUrl = "https://github.com/purescript/package-sets/blob/psc-" <> packageSetVersion <> "/packages.json"

client/updateSharedConfigVersions.mjs

@@ -0,0 +1,50 @@
+#!/usr/bin/env node
+
+// This script expects the current working directory to be `client`.
+// Call it using:
+//   node updateSharedConfigVersions.mjs src/Try/SharedConfig.purs
+
+import fs from "fs";
+import path from "path";
+import process from "process";
+
+if (process.argv.length <= 2) {
+  throw new Error("Script was run with 0 args. The first and only arg should be the path to the 'SharedConfig.purs' file.")
+}
+
+const sharedConfigPath = process.argv[2];
+
+const stackYamlPath = path.join("..", "stack.yaml");
+const stagingPackagesDhallPath = path.join("..", "staging", "packages.dhall");
+const stackYamlContent = fs.readFileSync(stackYamlPath, "utf-8");
+const packagesContent = fs.readFileSync(stagingPackagesDhallPath, "utf-8");
+
+const pursVersion = stackYamlContent.split("\n")
+  .reduce((acc, nextLine) => {
+    if (acc.found) return acc;
+    const matchResult = nextLine.match(/ +- purescript-(.+)/);
+    return matchResult
+      ? { found: true, value: matchResult[1] }
+      : acc;
+  }, { found: false })
+  .value;
+
+const packageSetVersion = packagesContent
+  .match(/https:\/\/github.com\/purescript\/package-sets\/releases\/download\/psc-([^\/]+)\/packages.dhall/)[1];
+
+if (!pursVersion) {
+  throw new Error("Failed to extract the PureScript version from the stack.yaml file. Cannot update SharedConfig.purs file.");
+}
+
+if (!packageSetVersion) {
+  throw new Error("Failed to extract the Package Set version from the staging/packages.dhall file. Cannot update SharedConfig.purs file.");
+}
+
+const sharedConfigContent = fs.readFileSync(sharedConfigPath, "utf-8");
+const newContent = sharedConfigContent.split("\n")
+  .map((line) => line
+    .replace(/pursVersion =.*/, `pursVersion = "v${pursVersion}"`)
+    .replace(/packageSetVersion =.*/, `packageSetVersion = "${packageSetVersion}"`)
+  )
+  .join("\n");
+fs.writeFileSync(sharedConfigPath, newContent);