Add GitHub release publishing

Author: hiqqs

.github/workflows/ci.yml

@@ -28,4 +28,4 @@ jobs:
         run: npm run build
 
       - name: Run Themis tests
-        run: npx themis test
+        run: npm run test

.github/workflows/release.yml

@@ -0,0 +1,41 @@
+name: Release
+
+on:
+  push:
+    tags:
+      - "v*"
+  workflow_dispatch:
+
+permissions:
+  contents: write
+
+jobs:
+  publish:
+    runs-on: windows-latest
+
+    steps:
+      - name: Check out repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Lint
+        run: npm run lint
+
+      - name: Build
+        run: npm run build
+
+      - name: Run Themis tests
+        run: npm run test
+
+      - name: Build and publish Windows installer
+        run: npm run release:ci
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

README.md

@@ -15,7 +15,9 @@ The application lets teams:
 
 ## Version
 
-Current app version: `0.2.2`
+Current app version: `0.2.3`
+
+For releases, keep the `package.json` version and Git tag aligned. Example: `0.2.3` in `package.json` should be released as `v0.2.3`.
 
 ## Development
 
@@ -60,11 +62,24 @@ That command runs the app build first, then packages the Electron app with `elec
 
 After it finishes, look in the `release` folder for:
 
-- `Code Release Tracker Setup 0.2.2.exe`: the Windows installer
+- `Code Release Tracker Setup 0.2.3.exe`: the Windows installer
 - `win-unpacked`: the unpacked app directory
 
 To install locally, run the installer `.exe` and follow the setup wizard. You can also use the unpacked folder directly if you want to test the app without installing it.
 
+## App Updates
+
+Published Windows installers are stored in the repository's GitHub Releases. The app checks that release feed on startup when running from a packaged Windows build, and prompts you to restart after a downloaded update is ready.
+
+To publish a new Windows release from CI or a tag build, use:
+
+```powershell
+npm run release:ci
+```
+
+If you just want to build the installer locally without publishing it, use `npm run dist:win`.
+Do not run `npm run release:ci` locally; it is meant for GitHub Actions publishing only.
+
 ## Project Structure
 
 - `src/App.tsx`: main application UI and state management

electron.cjs

@@ -1,8 +1,11 @@
-const { app, BrowserWindow, ipcMain } = require("electron");
+const { app, BrowserWindow, dialog, ipcMain } = require("electron");
+const { autoUpdater } = require("electron-updater");
 const path = require("path");
+const { pathToFileURL } = require("url");
 
 const isDev = !app.isPackaged;
 const WINDOW_TITLE = "Code Release Tracker";
+const SPLASH_IMAGE = path.join(__dirname, "src", "assets", "codeReleaseTrackerBg.png");
 const WINDOW_ICON = path.join(
   __dirname,
   "src",
@@ -12,6 +15,153 @@ const WINDOW_ICON = path.join(
 
 app.setName(WINDOW_TITLE);
 
+function setupAutoUpdater() {
+  if (process.platform !== "win32" || !app.isPackaged) {
+    return;
+  }
+
+  autoUpdater.autoDownload = true;
+  autoUpdater.autoInstallOnAppQuit = true;
+
+  autoUpdater.on("update-available", (info) => {
+    console.log(`Update available: ${info.version}`);
+  });
+
+  autoUpdater.on("update-not-available", (info) => {
+    console.log(`No update available: ${info.version}`);
+  });
+
+  autoUpdater.on("error", (error) => {
+    console.error("Auto-update error:", error);
+  });
+
+  autoUpdater.on("update-downloaded", async (info) => {
+    const result = await dialog.showMessageBox({
+      type: "info",
+      buttons: ["Restart now", "Later"],
+      defaultId: 0,
+      cancelId: 1,
+      title: WINDOW_TITLE,
+      message: "A new version of Code Release Tracker is ready to install.",
+      detail: `Version ${info.version} has been downloaded. Restart now to finish installing the update.`,
+    });
+
+    if (result.response === 0) {
+      autoUpdater.quitAndInstall();
+    }
+  });
+
+  autoUpdater.checkForUpdates().catch((error) => {
+    console.error("Failed to check for updates:", error);
+  });
+}
+
+function createSplashWindow() {
+  const splashImageUrl = pathToFileURL(SPLASH_IMAGE).href;
+  const splash = new BrowserWindow({
+    width: 760,
+    height: 440,
+    frame: false,
+    resizable: false,
+    movable: true,
+    maximizable: false,
+    minimizable: false,
+    fullscreenable: false,
+    show: true,
+    skipTaskbar: true,
+    backgroundColor: "#040611",
+    autoHideMenuBar: true,
+    webPreferences: {
+      contextIsolation: true,
+    },
+  });
+
+  splash.setMenuBarVisibility(false);
+  splash.loadURL(
+    `data:text/html;charset=UTF-8,${encodeURIComponent(`
+      <!doctype html>
+      <html lang="en">
+        <head>
+          <meta charset="UTF-8" />
+          <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+          <title>${WINDOW_TITLE}</title>
+          <style>
+            :root {
+              color-scheme: dark;
+              font-family: "Segoe UI", system-ui, sans-serif;
+            }
+
+            html, body {
+              width: 100%;
+              height: 100%;
+              margin: 0;
+            }
+
+            body {
+              display: grid;
+              place-items: center;
+              background:
+                linear-gradient(180deg, rgba(4, 6, 17, 0.18), rgba(4, 6, 17, 0.82)),
+                url("${splashImageUrl}") center/cover no-repeat;
+              overflow: hidden;
+            }
+
+            .panel {
+              display: grid;
+              gap: 12px;
+              justify-items: center;
+              padding: 18px 22px;
+              border: 1px solid rgba(255, 255, 255, 0.14);
+              border-radius: 18px;
+              background: rgba(5, 6, 15, 0.58);
+              box-shadow: 0 20px 80px rgba(0, 0, 0, 0.45);
+              backdrop-filter: blur(10px);
+            }
+
+            .title {
+              margin: 0;
+              font-size: 18px;
+              font-weight: 700;
+              letter-spacing: 0.06em;
+              text-transform: uppercase;
+            }
+
+            .subtitle {
+              margin: 0;
+              color: rgba(248, 250, 252, 0.76);
+              font-size: 13px;
+            }
+
+            .spinner {
+              width: 22px;
+              height: 22px;
+              border: 2px solid rgba(248, 250, 252, 0.22);
+              border-top-color: #f8fafc;
+              border-radius: 50%;
+              animation: spin 0.9s linear infinite;
+            }
+
+            @keyframes spin {
+              to {
+                transform: rotate(360deg);
+              }
+            }
+          </style>
+        </head>
+        <body>
+          <div class="panel" aria-label="Loading Code Release Tracker">
+            <div class="spinner" aria-hidden="true"></div>
+            <p class="title">Code Release Tracker</p>
+            <p class="subtitle">Loading releases and workspace state...</p>
+          </div>
+        </body>
+      </html>
+    `)}`,
+  );
+
+  return splash;
+}
+
 function createWindow() {
   const window = new BrowserWindow({
     width: 1440,
@@ -24,6 +174,7 @@ function createWindow() {
     frame: false,
     titleBarStyle: "hidden",
     autoHideMenuBar: true,
+    show: false,
     webPreferences: {
       preload: path.join(__dirname, "preload.js"),
       nodeIntegration: false,
@@ -44,6 +195,10 @@ function createWindow() {
     window.webContents.send("window:maximized-changed", false);
   });
 
+  window.once("ready-to-show", () => {
+    window.show();
+  });
+
   if (isDev) {
     window.loadURL("http://localhost:5173");
   } else {
@@ -55,6 +210,19 @@ function createWindow() {
   return window;
 }
 
+function launchApplicationWindow() {
+  const splashWindow = createSplashWindow();
+  const mainWindow = createWindow();
+
+  mainWindow.once("ready-to-show", () => {
+    if (!splashWindow.isDestroyed()) {
+      splashWindow.close();
+    }
+  });
+
+  return mainWindow;
+}
+
 app.whenReady().then(() => {
   ipcMain.on("window:minimize", (event) => {
     BrowserWindow.fromWebContents(event.sender)?.minimize();
@@ -75,11 +243,12 @@ app.whenReady().then(() => {
     BrowserWindow.fromWebContents(event.sender)?.close();
   });
 
-  createWindow();
+  launchApplicationWindow();
+  setupAutoUpdater();
 
   app.on("activate", () => {
     if (BrowserWindow.getAllWindows().length === 0) {
-      createWindow();
+      launchApplicationWindow();
     }
   });
 });