Update ui dependencies

.gitattributes

@@ -1,2 +1 @@
-package-lock.json -diff
 * -text

.github/scripts/find-version.js

@@ -10,6 +10,7 @@ const findNextVersion = (tags, branch) => {
     if (version.preRelease == null || version.patch !== 0) {
       version.minor += 1;
       version.patch = 0;
+      version.preRelease = null
     }
   } else {
     // It's a patch.

.github/workflows/code-quality.yml

@@ -8,7 +8,7 @@ on:
       - "!main"
 
 env:
-  NODE_VERSION: "22.x"
+  NODE_VERSION: "22.5.1"
   RUST_VERSION: "1.82"
   SQLX_OFFLINE: true
   SQLX_VERSION: "0.8.2"
@@ -65,7 +65,7 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-node_modules-
       - name: Install node dependencies
-        run: cd ui && npm install
+        run: cd ui && npm ci
 
 
   check-ui:
@@ -107,7 +107,9 @@ jobs:
           path: ./ui/node_modules
           key: "${{ runner.os }}-node_modules-${{ env.NODE_VERSION }}-${{ hashFiles('./ui/package-lock.json') }}"
       - name: Run tests
-        run: cd ui && npm run test
+        run: |
+          cd ui
+          npm run test
 
 
   lint-ui:
@@ -128,7 +130,9 @@ jobs:
           path: ./ui/node_modules
           key: "${{ runner.os }}-node_modules-${{ env.NODE_VERSION }}-${{ hashFiles('./ui/package-lock.json') }}"
       - name: Run lint
-        run: cd ui && npm run lint
+        run: |
+          cd ui
+          npm run lint
 
 
   install-api:

.gitignore

@@ -9,7 +9,7 @@
 /secrets.txt
 
 # JetBrains IDE files
-/.idea/
+.idea/
 
 # Local Docker volumes
 /volumes/

api/src/database.rs

@@ -1,4 +1,3 @@
-use serde::Serialize;
 use sqlx::{
     postgres::{PgConnectOptions, PgPoolOptions},
     Connection, Executor, PgConnection, PgPool,

api/start.sh

@@ -1,4 +1,4 @@
-#!/bin/bash
+#!/usr/bin/bash
 
 SQLX_VERSION=0.8.2
 if [[ ! -f ~/.cargo/bin/sqlx ]] || [[ $(sqlx --version) != "sqlx-cli $SQLX_VERSION" ]]; then

docker-compose.yaml

@@ -19,20 +19,21 @@ services:
       - .env
 
   ui:
-    image: node:22
+    image: swissgeol-viewer-app/ui:local
+    build:
+      context: ./ui
+      dockerfile: DockerfileDev
     init: true
     ports:
       - "8000:8000"
-    environment:
-      NODE_ENV: development
-    working_dir: /app
-    command: ["sh", "-c", "npm ci && npm run start"]
     depends_on:
       - api
       - abbreviator
     volumes:
-      - ./ui:/app
-      - ui.node_modules:/app/node_modules
+      - ./:/app
+      - ui.node_modules:/app/ui/node_modules
+    tmpfs:
+      - /app/ui/dist
 
   minio:
     image: minio/minio:latest
@@ -84,4 +85,4 @@ volumes:
   db:
   api.cargo:
   api.target:
-  ui.node_modules:
+  ui.node_modules:

ui/.dockerignore

@@ -0,0 +1,2 @@
+/node_modules/
+/dist/

ui/.mocharc.json

@@ -1,5 +1,12 @@
 {
-  "spec": "src/test/**/*.ts",
+  "spec": "src/test/**/*.test.ts",
   "extension": ["ts", "js"],
-  "loader": "ts-node/esm"
+  "require": [
+    "ts-node/register/transpile-only",
+    "jsdom-global/register.js",
+    "./src/test/jquery.register.js"
+  ],
+  "ts-node": {
+    "transpileOnly": true
+  }
 }

ui/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:22-alpine as build
+FROM node:22.5.1-alpine as build
 
 WORKDIR /app
 COPY . .

ui/DockerfileDev

@@ -0,0 +1,14 @@
+FROM node:22.5.1-alpine AS build
+
+ENV NODE_ENV=development
+
+RUN apk add --no-cache git bash \
+  && npm update -g npm
+
+WORKDIR /app/ui
+COPY . .
+
+EXPOSE 8000
+
+ENTRYPOINT ["/bin/bash", "-c"]
+CMD ["./start.sh"]

ui/cypress.config.ts

@@ -1,8 +1,9 @@
-import { defineConfig } from 'cypress'
+import {defineConfig} from 'cypress';
 
 export default defineConfig({
-  e2e: {
-    setupNodeEvents(on, config) {},
-    baseUrl: 'http://localhost:8000',
-  },
-})
+    e2e: {
+        setupNodeEvents(_on, _config) {
+        },
+        baseUrl: 'http://localhost:8000',
+    },
+});

ui/cypress/e2e/page-load.cy.ts

@@ -1,15 +1,15 @@
 describe('Page load', () => {
   it('Navigation hint', () => {
-    (<any>cy).loadPage();
+    (cy as any).loadPage();
     cy.get('.ngm-nav-hint').should('be.visible');
     cy.get('.ngm-nav-hint', {timeout: 30000}).should('not.exist');
 
-    (<any>cy).loadPage();
+    (cy as any).loadPage();
     cy.get('.ngm-nav-hint').should('be.visible');
     cy.get('.ngm-nav-hint').click();
     cy.get('.ngm-nav-hint').should('not.exist');
 
-    (<any>cy).loadPage();
+    (cy as any).loadPage();
     cy.get('.ngm-nav-hint').should('be.visible');
     cy.get('body').trigger('keydown', {ctrlKey: true, keycode: 17, key: 'Control'});
     cy.get('.ngm-nav-hint').should('not.exist');

ui/eslint.config.mjs

@@ -0,0 +1,158 @@
+import globals from 'globals';
+import tsParser from '@typescript-eslint/parser';
+import path from 'node:path';
+import {fileURLToPath} from 'node:url';
+import js from '@eslint/js';
+import {FlatCompat} from '@eslint/eslintrc';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+});
+
+const sharedConfig = {
+    ignores: [
+        'node_modules/**',
+        'dist/**',
+    ],
+    languageOptions: {
+        globals: globals.browser,
+        ecmaVersion: 2018,
+        sourceType: 'module',
+        parser: tsParser,
+    },
+    rules: {
+        'array-bracket-spacing': 'error',
+        'comma-spacing': 'error',
+        'eqeqeq': ['error', 'always', {'null': 'ignore'}],
+        'key-spacing': 'error',
+        'keyword-spacing': 'error',
+        'no-duplicate-imports': 'off',
+        'no-multi-spaces': 'error',
+        'no-multiple-empty-lines': 'error',
+        'no-trailing-spaces': 'error',
+        'no-var': 'error',
+        'object-curly-spacing': 'error',
+        'object-shorthand': 'off',
+        'prefer-arrow-callback': 'error',
+        'prefer-const': 'error',
+
+        quotes: ['error', 'single', {
+            avoidEscape: true,
+        }],
+
+        semi: 'error',
+        'space-before-blocks': 'error',
+        'space-in-parens': 'error',
+        'space-infix-ops': 'error',
+        '@typescript-eslint/no-explicit-any': 'off',
+        '@typescript-eslint/no-empty-function': 'off',
+        '@typescript-eslint/explicit-module-boundary-types': 'off',
+
+        '@typescript-eslint/no-unused-vars': ['error', {
+            vars: 'all',
+            varsIgnorePattern: '^_',
+            args: 'after-used',
+            argsIgnorePattern: '^_',
+            caughtErrors: 'all',
+            caughtErrorsIgnorePattern: '^_',
+        }],
+
+        '@typescript-eslint/no-non-null-assertion': 'off',
+        '@typescript-eslint/ban-ts-comment': 'off',
+
+        // TODO enable this. It is disabled because we haven't gotten to fixing its issues.
+        '@typescript-eslint/no-unused-expressions': 'off',
+    }
+};
+
+const baseConfigs = compat.extends(
+    'eslint:recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+).map((config) => ({
+    ...config,
+    ignores: sharedConfig.ignores,
+    languageOptions: {
+        globals: {
+            ...globals.node,
+        },
+    },
+}));
+
+export default [
+    {
+        ignores: ['dist/**'],
+    },
+    ...baseConfigs.map((config) => ({
+        ...config,
+        ignores: [
+            ...sharedConfig.ignores,
+            'src/**',
+            'cypress/**',
+        ],
+        languageOptions: {
+            ...config.languageOptions,
+            globals: {
+                ...globals.node,
+            },
+        },
+        rules: {
+            ...config.rules,
+            ...sharedConfig.rules,
+        }
+    })),
+    ...baseConfigs.map((config) => ({
+        ...config,
+        files: ['src/**/*.ts', 'src/**/*.js'],
+        ignores: [
+            ...sharedConfig.ignores,
+            'src/test/**',
+        ],
+        languageOptions: {
+            ...config.languageOptions,
+            globals: {
+                ...globals.browser,
+            },
+        },
+        rules: {
+            ...config.rules,
+            ...sharedConfig.rules,
+        }
+    })),
+    ...baseConfigs.map((config) => ({
+        ...config,
+        files: ['src/test/**/*.ts', 'src/test/**/*.js'],
+        languageOptions: {
+            ...config.languageOptions,
+            globals: {
+                ...globals.mocha,
+            },
+        },
+    })),
+    {
+        ...sharedConfig,
+        files: ['src/**/*.ts', 'src/**/*.js'],
+        languageOptions: {
+            ...sharedConfig.languageOptions,
+            parserOptions: {
+                project: './tsconfig.json',
+            },
+        },
+    },
+    {
+        ...sharedConfig,
+        files: ['src/test/**/*.ts', 'src/test/**/*.js'],
+        languageOptions: {
+            ...sharedConfig.languageOptions,
+            parserOptions: {
+                project: './tsconfig.test.json',
+            },
+            globals: {
+                ...globals.mocha,
+            },
+        },
+    },
+];