refactor: use compose from uselagoon/lagoon

.dockerignore

@@ -7,7 +7,13 @@ README.md
 **/yarn-error.log
 **/.gitignore
 node_modules
+cypress_cache
+
 build
 
 # Envs
-**/.env.local
+**/.env.local
+
+lagoon-core.*
+Makefile
+cypress/screenshots

.github/workflows/ui-workflow.yaml

@@ -20,6 +20,11 @@ jobs:
     - name: Checkout Repository
       uses: actions/checkout@v4
 
+    - name: Set up Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: '20.13.1'
+
     - name: Formatting check
       run: |
         yarn add prettier@3.1.1 @trivago/prettier-plugin-sort-imports
@@ -32,6 +37,11 @@ jobs:
     - name: Checkout Repository
       uses: actions/checkout@v4
 
+    - name: Set up Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: '20.13.1'
+
     - name: Linting
       run: |
         yarn add typescript
@@ -49,17 +59,17 @@ jobs:
     - name: Set up Node.js
       uses: actions/setup-node@v4
       with:
-        node-version: '20'
+        node-version: '20.13.1'
 
     - name: Build and start Lagoon-minimal
       run: |
-        cd test
-        make up
+        make test-with-api
 
     - name: Start ui
       env:
-        GRAPHQL_API: http://0.0.0.0:33000/graphql
-        KEYCLOAK_API: http://0.0.0.0:38088/auth
+        GRAPHQL_API: http://localhost:3000/graphql
+        KEYCLOAK_API: http://localhost:8088/auth
+        NODE_PORT: 3003
       run: |
         yarn install
         yarn build
@@ -70,26 +80,37 @@ jobs:
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
+        wait-on: 'http://localhost:3003'
         command: yarn cypress:runRbac
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_ui: http://localhost:3003
 
     - name: Run General Cypress Tests
       uses: cypress-io/github-action@v6
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
+        wait-on: 'http://localhost:3003'
         command: yarn cypress:runGeneral
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_ui: http://localhost:3003
 
     - name: Run Organization Cypress Tests
       uses: cypress-io/github-action@v6
       with:
         config-file: ./cypress/cypress.config.ts
         auto-cancel-after-failures: 1
-        wait-on: 'http://localhost:3000'
+        wait-on: 'http://localhost:3003'
         command: yarn cypress:runOrganizations
+      env:
+        cypress_api: http://localhost:3000/graphql
+        cypress_keycloak: http://localhost:8088/auth
+        cypress_ui: http://localhost:3003
 
     - name: Stop Docker containers
       run: |
-        cd test
-        make down
+        make test-api-down

.gitignore

@@ -15,6 +15,9 @@ build-storybook.log
 .env
 .python-version
 docker-compose.override.yml
+cypress_cache
+lagoon-core.*
+cypress/screenshots
 
 # ts linter
 *.tsbuildinfo

Makefile

@@ -0,0 +1,57 @@
+# upstream
+CI_BUILD_TAG ?= lagoon-ui
+CORE_REPO=https://github.com/uselagoon/lagoon.git
+CORE_TREEISH=make-export-refactoring
+CYPRESS_BASE=cypress/base:20.13.1
+
+.PHONY: yarn-start-ui
+yarn-start-ui:
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& yarn install \
+    && yarn build \
+    && yarn start \
+
+# run-cypress:
+.PHONY: start-ui
+start-ui: test-with-api
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& export NODE_ENV=production \
+	&& export NODE_PORT=3003 \
+	&& docker compose -p $(CI_BUILD_TAG) --compatibility up --build -d ui
+
+.PHONY: test-with-api
+test-with-api:
+	export LAGOON_CORE=$$(mktemp -d ./lagoon-core.XXX) \
+	&& export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& git clone $(CORE_REPO) "$$LAGOON_CORE" \
+	&& cd "$$LAGOON_CORE" \
+	&& git checkout $(CORE_TREEISH) \
+	&& IMAGE_REPO=testlagoon IMAGE_REPO_TAG=main COMPOSE_STACK_NAME=core-$(CI_BUILD_TAG) $(MAKE) compose-api-logs-development
+
+.PHONY: run-cypress-with-test-api
+run-cypress-with-test-api: start-ui
+	$(MAKE) run-cypress
+
+.PHONY: run-cypress
+run-cypress:
+	export GRAPHQL_API=http://localhost:3000/graphql \
+	&& export KEYCLOAK_API=http://localhost:8088/auth \
+	&& export UI_URL=http://localhost:3003 \
+	&& docker run --rm -it --network host --name ct-$(CI_BUILD_TAG) \
+		--volume "$$(pwd):/workdir" -w /workdir \
+		-e cypress_api=$$GRAPHQL_API \
+		-e cypress_keycloak=$$KEYCLOAK_API \
+		-e cypress_url=$$UI_URL \
+		--entrypoint=/bin/bash $(CYPRESS_BASE) ./cypress/run.sh
+
+.PHONY: test-api-down
+test-api-down:
+	docker-compose -p core-$(CI_BUILD_TAG) --compatibility down -v --remove-orphans
+
+.PHONY: down
+down:
+	$(MAKE) test-api-down
+	docker-compose -p $(CI_BUILD_TAG) --compatibility down -v --remove-orphans

cypress/run.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+# create cache for repeat runs
+mkdir -p /workdir/cypress_cache
+ln -s /workdir/cypress_cache /root/.cache
+
+yarn --frozen-lockfile
+# run the tests
+yarn cypress:runRbac && yarn cypress:runGeneral && yarn cypress:runOrganizations

docker-compose.yml

@@ -13,6 +13,8 @@ x-environment: &default-environment
   GRAPHQL_API: "${GRAPHQL_API:-http://0.0.0.0:3000/graphql}"
   KEYCLOAK_API: "${KEYCLOAK_API:-http://0.0.0.0:8088/auth}"
   LAGOON_UI_TOURS_ENABLED: enabled
+  NODE_ENV: "${NODE_ENV}"
+  NODE_PORT: "${NODE_PORT:-3003}"
 
 services:
   ui:

server.js

@@ -2,7 +2,8 @@ const express = require('express');
 const next = require('next');
 
 const dev = process.env.NODE_ENV !== 'production';
-const port = dev ? 3003 : 3000;
+const node_port = process.env.NODE_PORT !== 3000;
+const port = node_port ? 3003 : 3000;
 const app = next({
   dev,
   dir: 'src',