Mrc 6647 ci docker

.dockerignore

@@ -0,0 +1,17 @@
+Dockerfile
+.dockerignore
+.git
+.gitignore
+.gitattributes
+README.md
+.npmrc
+.prettierrc
+.eslintrc.cjs
+.graphqlrc
+.editorconfig
+.svelte-kit
+.vscode
+node_modules
+build
+package
+**/.env

.github/workflows/build-push.yml

@@ -0,0 +1,38 @@
+name: build and push docker image
+on:
+  push:
+    branches:
+      - main
+      - 'releases/*'
+  pull_request:
+    branches:
+      - '*'
+env:
+  BRANCH_NAME: ${{ github.head_ref || github.ref_name }}
+  IMAGE_NAME: ghcr.io/mrc-ide/mint-frontend
+
+jobs:
+  build-push:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v5
+
+      - name: Log in to GitHub Container Registry
+        uses: docker/login-action@v2
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Build and push Docker image
+        uses: docker/build-push-action@v6
+        with:
+          context: .
+          push: true
+          tags: |
+            ${{ env.IMAGE_NAME }}:${{ env.BRANCH_NAME }}
+            ${{ env.BRANCH_NAME == 'main' && format('{0}:latest', env.IMAGE_NAME) || '' }}

.github/workflows/test.yml

@@ -0,0 +1,61 @@
+name: test workflow
+on:
+  push:
+    branches:
+      - main
+      - 'releases/*'
+  pull_request:
+    branches:
+      - '*'
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v5
+      - name: Set up Node.js 22.x
+        uses: actions/setup-node@v5
+        with:
+          node-version: 22.x
+          cache: 'npm'
+          cache-dependency-path: package-lock.json
+      - name: Install dependencies
+        run: npm ci
+      - name: Run format + lint checks
+        run: npm run lint
+      - name: check svelte-check
+        run: npm run check
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps
+      - name: Run unit tests
+        run: npm run test:unit:coverage
+      - name: Upload coverage to Codecov
+        uses: codecov/codecov-action@v5
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+          slug: mrc-ide/mint-v2
+          fail_ci_if_error: true
+  e2e-tests:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [22.x]
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v5
+      - name: Set up Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Start dependencies
+        run: ./scripts/run_dependencies.sh
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps
+      - name: Run Playwright tests
+        run: npm run test:e2e
+      - name: Stop dependencies
+        if: ${{ always() }}
+        run: ./scripts/stop_dependencies.sh

.gitignore

@@ -23,3 +23,4 @@ Thumbs.db
 # Vite
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*
+coverage

Dockerfile

@@ -0,0 +1,16 @@
+FROM node:22-slim AS builder
+WORKDIR /app
+COPY package*.json ./
+RUN npm ci
+COPY . .
+RUN npm run build
+RUN npm prune --omit=dev
+
+FROM builder AS runtime
+WORKDIR /app
+COPY --from=builder /app/build build/
+COPY --from=builder /app/node_modules node_modules/
+COPY package.json .
+EXPOSE 3000
+ENV NODE_ENV=production
+CMD ["node", "build"]

README.md

@@ -76,3 +76,30 @@ npx shadcn-svelte@latest add [component-name]
 ```
 
 These components will be added to `src/lib/components/ui/` and automatically registered in the SvelteKit app.
+
+## Docker
+
+#### Using Docker Compose
+
+A `compose.yml` file is provided to run the application along with its dependencies (Redis and Mintr API).
+
+1. **Start services**:
+
+   ```sh
+   docker-compose up
+   ```
+
+2. **Access the application**:
+   Wait for mint-frontend to be ready. Open your browser and navigate to `http://127.0.0.1:3000`.
+3. **Stop services**:
+
+   ```sh
+   docker-compose down
+   ```
+
+## Environment Variables
+
+Environment variables can be set in a `.env` file in the root directory or added to the environment. Example variables include:
+
+- `FRONTEND_REF`: Git reference for the frontend image (default: `main`)
+- `API_REF`: Git reference for the Mintr API image (default: `main`)

compose.yml

@@ -0,0 +1,37 @@
+services:
+  mint-redis:
+    image: redis:8.0
+    ports:
+      - 6379:6379
+    volumes:
+      - mint-data:/data
+    container_name: mint-redis
+  mint-frontend:
+    image: ghcr.io/mrc-ide/mint-frontend:${FRONTEND_REF:-main}
+    pull_policy: always
+    ports:
+      - 127.0.0.1:3000:3000
+    environment:
+      - REDIS_URL=redis://mint-redis:6379
+      - PUBLIC_MINTR_URL=http://mintr:8888
+      - ORIGIN=http://127.0.0.1:3000
+    depends_on:
+      mint-redis:
+        condition: service_started
+      mintr:
+        condition: service_healthy
+        restart: true
+  mintr:
+    image: ghcr.io/mrc-ide/mintr:${API_REF:-main}
+    container_name: mintr
+    healthcheck:
+      test: curl -f http://localhost:8888/ || exit 1
+      start_period: 1m
+      start_interval: 10s
+      interval: 1m
+      timeout: 30s
+      retries: 5
+    ports:
+      - 8888:8888
+volumes:
+  mint-data:

e2e/demo.test.ts

@@ -2,6 +2,5 @@ import { expect, test } from '@playwright/test';
 
 test('home page has expected h1', async ({ page }) => {
 	await page.goto('/');
-	await expect(page.locator('h1')).toBeVisible();
 	await expect(page.getByText('Mint')).toBeVisible();
 });