Updated packages and added new test-build CI

Author: jamrce

.github/workflows/build-and-deploy.yml

@@ -5,6 +5,8 @@ name: GitHub Pages Deployment
 on:
   release:
     types: [published]
+  # Optional: Allow manual trigger
+  workflow_dispatch:
 
 jobs:
   build:
@@ -13,25 +15,39 @@ jobs:
 
     steps:
       # https://github.com/actions/checkout
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # a standard step for GitHub actions on Node
       # https://github.com/actions/setup-node
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          # update the Node version to meet your needs
-          node-version: 18
-          cache: npm
-          cache-dependency-path: ./editor-app
-
+          node-version: 22
+          cache: yarn
+          cache-dependency-path: ./editor-app/yarn.lock
+      
+      - name: Install dependencies
+        working-directory: ./editor-app
+        run: yarn install --frozen-lockfile
+      
+      - name: Run security audit
+        working-directory: ./editor-app
+        run: yarn audit --level moderate
+        continue-on-error: true  # Don't fail deployment on audit issues
+      
       - name: Build
         working-directory: ./editor-app
         run: |
-          npm i yarn
-          yarn install
           yarn build
           touch out/.nojekyll
-
+        env:
+          NODE_ENV: production
+      
+      - name: Verify build output
+        working-directory: ./editor-app
+        run: |
+          ls -la out/
+          echo "Build completed successfully"
+      
       - name: Deploy
         # https://github.com/JamesIves/github-pages-deploy-action
         uses: JamesIves/github-pages-deploy-action@v4

.github/workflows/test-build.yaml

@@ -0,0 +1,61 @@
+# .github/workflows/test-build.yml
+
+name: Test Build
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  test-build:
+
+    runs-on: ubuntu-latest
+
+    steps:
+      # https://github.com/actions/checkout
+      - uses: actions/checkout@v4
+      
+      # a standard step for GitHub actions on Node
+      # https://github.com/actions/setup-node
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: yarn
+          cache-dependency-path: ./editor-app/yarn.lock
+      
+      - name: Install dependencies
+        working-directory: ./editor-app
+        run: yarn install --frozen-lockfile
+      
+      - name: Run linting
+        working-directory: ./editor-app
+        run: yarn lint
+        continue-on-error: true
+
+      - name: Run security audit
+        working-directory: ./editor-app
+        run: yarn audit --level moderate
+        continue-on-error: true  # Don't fail deployment on audit issues
+      
+      - name: Test build
+        working-directory: ./editor-app
+        run: |
+          yarn build
+          echo "✅ Build successful"
+      
+      - name: Check build output
+        working-directory: ./editor-app
+        run: |
+          if [ ! -d "out" ]; then
+            echo "❌ Build output directory 'out' not found"
+            exit 1
+          fi
+          
+          if [ ! -f "out/index.html" ]; then
+            echo "❌ index.html not found in build output"
+            exit 1
+          fi
+          
+          echo "✅ Build output verified"

editor-app/components/ActivityDiagram.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect, MutableRefObject } from "react";
+import { useState, useEffect, MutableRefObject, JSX } from "react";
 import Breadcrumb from "react-bootstrap/Breadcrumb";
 import Row from "react-bootstrap/Row";
 import Col from "react-bootstrap/Col";

editor-app/components/Util.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { JSX } from "react";
 import Link from "next/link";
 import { Button, Col, Row } from "react-bootstrap";
 

editor-app/package.json

@@ -11,25 +11,25 @@
   },
   "dependencies": {
     "@apollo-protocol/hqdm-lib": "^0.0.2",
-    "@dnd-kit/core": "6.1.0",
-    "@dnd-kit/sortable": "8.0.0",
+    "@dnd-kit/core": "6.3.1",
+    "@dnd-kit/sortable": "10.0.0",
     "@dnd-kit/utilities": "3.2.2",
     "@types/d3": "^7.4.3",
-    "@types/node": "20.12.12",
-    "@types/react": "18.3.3",
-    "@types/react-dom": "18.3.0",
+    "@types/node": "24.0.14",
+    "@types/react": "19.1.8",
+    "@types/react-dom": "19.1.6",
     "bootstrap": "^5.3.3",
     "d3": "^7.9.0",
-    "eslint": "^8.0.0",
-    "eslint-config-next": "14.2.3",
+    "eslint": "^9.31.0",
+    "eslint-config-next": "15.4.1",
     "lodash": "^4.17.21",
-    "next": "14.2.15",
-    "react": "18.3.1",
+    "next": "15.4.1",
+    "react": "19.1.0",
     "react-bootstrap": "^2.10.2",
-    "react-dom": "18.3.1",
+    "react-dom": "19.1.0",
     "react-modal-image": "^2.6.0",
     "react-select": "^5.8.0",
-    "typescript": "5.4.5",
+    "typescript": "5.8.3",
     "uuidv4": "^6.2.13"
   }
 }

editor-app/tsconfig.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": ["dom", "dom.iterable", "es6"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -14,11 +14,16 @@
     "isolatedModules": true,
     "jsx": "preserve",
     "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
     "baseUrl": ".",
     "paths": {
       "@/*": ["./*"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
   "exclude": ["node_modules"]
 }