fix(configurator): get the actual latest firmware version

Author: chmanie

.github/workflows/release.yml

@@ -290,6 +290,10 @@ jobs:
           # Restore CNAME
           cp temp-preserve/CNAME gh-pages/CNAME 2>/dev/null || true
 
+          # Update version.json with latest firmware version
+          FP_VERSION="${{ needs.detect-changes.outputs.faderpunk_version }}"
+          echo "{\"firmware\":\"${FP_VERSION}\"}" > gh-pages/version.json
+
           cd gh-pages
           git checkout gh-pages
           git config user.name "github-actions[bot]"
@@ -298,6 +302,27 @@ jobs:
           git commit -m "Deploy configurator v${VERSION} and update landing page" || echo "No changes"
           git push origin gh-pages
 
+  # --- Update version.json on GitHub Pages (for landing page runtime check) ---
+  update-version-json:
+    needs: [detect-changes, release]
+    if: needs.detect-changes.outputs.faderpunk == 'true' && needs.detect-changes.outputs.configurator != 'true'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout gh-pages branch
+        uses: actions/checkout@v6
+        with:
+          ref: gh-pages
+      - name: Write version.json
+        run: |
+          echo '{"firmware":"${{ needs.detect-changes.outputs.faderpunk_version }}"}' > version.json
+      - name: Commit and push
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+          git add version.json
+          git commit -m "Update firmware version to v${{ needs.detect-changes.outputs.faderpunk_version }}" || echo "No changes"
+          git push origin gh-pages
+
   # --- Publish libfp to crates.io ---
   publish-libfp:
     needs: [detect-changes, release]

configurator/src/landing/App.tsx

@@ -3,8 +3,11 @@ import { compare, major, minor } from "semver";
 
 const FADERPUNK_VENDOR_ID = 0xf569;
 const FADERPUNK_PRODUCT_ID = 0x1;
-const FIRMWARE_LATEST_VERSION = __FIRMWARE_LATEST_VERSION__;
-const VERSION_PATH = `/${major(FIRMWARE_LATEST_VERSION)}.${minor(FIRMWARE_LATEST_VERSION)}/`;
+const BUILD_TIME_VERSION = __FIRMWARE_LATEST_VERSION__;
+
+function versionPath(version: string) {
+  return `/${major(version)}.${minor(version)}/`;
+}
 
 type State =
   | { status: "idle" }
@@ -19,14 +22,27 @@ type State =
 
 export default function App() {
   const [state, setState] = useState<State>({ status: "idle" });
+  const [latestVersion, setLatestVersion] = useState(BUILD_TIME_VERSION);
   const webUsbSupported = !!navigator.usb;
 
+  // Fetch latest firmware version from version.json (falls back to build-time constant)
+  useEffect(() => {
+    fetch("/version.json")
+      .then((r) => (r.ok ? r.json() : Promise.reject()))
+      .then((data: { firmware: string }) => {
+        if (data.firmware) setLatestVersion(data.firmware);
+      })
+      .catch(() => {});
+  }, []);
+
   // Redirect hash routes to the versioned deployment
   useEffect(() => {
     if (window.location.hash) {
-      window.location.replace(VERSION_PATH + window.location.hash);
+      window.location.replace(
+        versionPath(latestVersion) + window.location.hash,
+      );
     }
-  }, []);
+  }, [latestVersion]);
 
   async function connectAndRedirect() {
     setState({ status: "connecting" });
@@ -57,7 +73,7 @@ export default function App() {
       // Determine target path for the matching configurator
       let configuratorPath: string;
 
-      if (compare(deviceVersion, FIRMWARE_LATEST_VERSION) > 0) {
+      if (compare(deviceVersion, latestVersion) > 0) {
         // Device version is newer than latest stable → beta
         configuratorPath = "/beta/";
       } else if (compare(deviceVersion, "1.7.0") < 0) {
@@ -68,7 +84,7 @@ export default function App() {
       }
 
       // Firmware is outdated → show update choice
-      if (compare(deviceVersion, FIRMWARE_LATEST_VERSION) < 0) {
+      if (compare(deviceVersion, latestVersion) < 0) {
         setState({
           status: "update-available",
           currentVersion: deviceVersion,
@@ -142,13 +158,13 @@ export default function App() {
 
         <div className="mt-4 flex items-center justify-between gap-4">
           <a
-            href={VERSION_PATH + "#/troubleshooting"}
+            href={versionPath(latestVersion) + "#/troubleshooting"}
             className="cursor-pointer text-center text-gray-400 underline hover:text-[#d4d4d8]"
           >
             Trouble connecting?
           </a>
           <a
-            href={VERSION_PATH + "#/about"}
+            href={versionPath(latestVersion) + "#/about"}
             className="cursor-pointer text-center text-gray-400 underline hover:text-[#d4d4d8]"
           >
             What is this?
@@ -177,14 +193,15 @@ export default function App() {
               </span>
               . Version{" "}
               <span className="text-pink-fp font-semibold">
-                v{FIRMWARE_LATEST_VERSION}
+                v{latestVersion}
               </span>{" "}
               is available.
             </p>
             <div className="flex justify-center gap-3">
               <button
                 onClick={() => {
-                  window.location.href = VERSION_PATH + "#/update";
+                  window.location.href =
+                    versionPath(latestVersion) + "#/update";
                 }}
                 className="cursor-pointer rounded-sm bg-white px-6 py-2 text-xs font-semibold text-black transition-opacity hover:opacity-90"
               >