feat: UI dockerization tweaks

Author: Ajcgd

compose.yaml

@@ -11,24 +11,6 @@ services:
     env_file:
       - .env
 
-  cadvisor:
-    image: gcr.io/cadvisor/cadvisor:latest
-    container_name: cadvisor
-    networks:
-      - monitoring
-    ports:
-      - "8081:8080"
-    volumes:
-      - /:/rootfs:ro
-      - /var/run:/var/run:ro
-      - /sys:/sys:ro
-      - /var/lib/docker/:/var/lib/docker:ro
-      - /var/run/docker.sock:/var/run/docker.sock:ro
-    profiles:
-      - dev
-      - prod
-
-  # TODO Change to latest
   fhir-module:
     image: ghcr.io/bbmri-cz/fhir-module:latest
     container_name: fhir-module
@@ -39,7 +21,7 @@ services:
       - fhir-integration
       - monitoring
     ports:
-      - "5001:5000"
+      - "5000:5000"
     environment:
       BLAZE_URL: "http://test-blaze:8080/fhir"
       MIABIS_BLAZE_URL: "http://miabis-blaze:8080/fhir"
@@ -53,7 +35,7 @@ services:
       - fhir-logs:/var/log/fhir-module
 
   fhir-ui:
-    image: ghcr.io/bbmri-cz/fhir-ui:local
+    image: ghcr.io/bbmri-cz/fhir-ui:latest
     container_name: fhir-ui
     profiles:
       - dev
@@ -69,6 +51,7 @@ services:
       - ui-data:/app/data
     depends_on:
       - fhir-module
+    restart: unless-stopped
 
   prometheus:
     image: prom/prometheus:latest

ui/fhir-place/Dockerfile

@@ -17,13 +17,22 @@ COPY . .
 
 # Generate database schema and build the application
 RUN npm run db:generate
+RUN mkdir -p /app/data
+
+# Create and initialize the database during build
+RUN npm run db:migrate
+RUN npm run db:init
+
 RUN npm run build
 
 # Production stage
 FROM node:18-alpine AS runner
 
 WORKDIR /app
 
+# Install tsx for TypeScript execution
+RUN npm install -g tsx
+
 # Create a non-root user
 RUN addgroup -g 1001 -S nodejs
 RUN adduser -S nextjs -u 1001
@@ -36,12 +45,20 @@ COPY --from=builder /app/.next/static ./.next/static
 # Copy package.json for runtime dependencies
 COPY --from=builder /app/package.json ./package.json
 
-# Copy database migration files if they exist
+# Copy database migration files and scripts
 COPY --from=builder /app/drizzle ./drizzle
 COPY --from=builder /app/src/scripts ./src/scripts
+COPY --from=builder /app/src/lib ./src/lib
+
+# Copy startup script
+COPY start.sh /app/start.sh
+
+# Create data directory for SQLite database
+RUN mkdir -p /app/data
 
 # Set correct permissions
 RUN chown -R nextjs:nodejs /app
+RUN chmod +x /app/start.sh
 USER nextjs
 
 # Expose port
@@ -50,5 +67,5 @@ EXPOSE 3000
 ENV PORT=3000
 ENV HOSTNAME="0.0.0.0"
 
-# Start the application
-CMD ["node", "server.js"] 
+# Start the application with database initialization
+CMD ["/app/start.sh"] 

ui/fhir-place/README.md

@@ -1,36 +1,75 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+# FHIR Place UI
 
-## Getting Started
+A Next.js application for managing FHIR data with authentication and SQLite database.
 
-First, run the development server:
+## Features
 
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
-```
+- User authentication with NextAuth.js
+- SQLite database for data persistence
+- Modern UI with Tailwind CSS
+- Docker support for containerized deployment
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+## Development
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+### Prerequisites
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
+- Node.js 18+
+- npm or yarn
 
-## Learn More
+### Local Development
 
-To learn more about Next.js, take a look at the following resources:
+1. Install dependencies:
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+   ```bash
+   npm install
+   ```
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+2. Initialize the database:
 
-## Deploy on Vercel
+   ```bash
+   npm run db:init
+   ```
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+3. Start the development server:
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+   ```bash
+   npm run dev
+   ```
+
+4. Open [http://localhost:3000](http://localhost:3000) in your browser.
+
+## Docker Deployment
+
+The application is configured to run in Docker containers with the main `compose.yaml` file.
+
+### Environment Variables
+
+The following environment variables are required:
+
+- `NEXTAUTH_SECRET`: Secret key for NextAuth.js (change in production)
+- `AUTH_TRUST_HOST`: Set to `true` for Docker deployment
+- `NODE_ENV`: Set to `production` for Docker
+- `PORT`: Application port (default: 3000)
+
+### Running with Docker Compose
+
+1. From the project root, run:
+
+   ```bash
+   docker-compose --profile dev up fhir-ui
+   ```
+
+2. The UI will be available at [http://localhost:3000](http://localhost:3000)
+
+### Database
+
+The SQLite database is stored in the `/app/data` directory and persisted using Docker volumes. The database will be automatically initialized on first run.
+
+## Available Scripts
+
+- `npm run dev`: Start development server
+- `npm run build`: Build for production
+- `npm run start`: Start production server
+- `npm run db:init`: Initialize database with seed data
+- `npm run db:generate`: Generate database schema
+- `npm run db:migrate`: Run database migrations

ui/fhir-place/auth.ts

@@ -91,7 +91,7 @@ const config = {
   session: {
     strategy: "jwt" as const,
   },
-  secret: process.env.AUTH_SECRET,
+  secret: process.env.NEXTAUTH_SECRET,
 };
 
 export const { handlers, signIn, signOut, auth } = NextAuth(config);

ui/fhir-place/drizzle.config.ts

@@ -5,6 +5,6 @@ export default defineConfig({
   out: "./drizzle",
   dialect: "sqlite",
   dbCredentials: {
-    url: "./database.sqlite",
+    url: "./data/database.sqlite",
   },
 });

ui/fhir-place/src/actions/backend/backend-control.ts

@@ -6,7 +6,7 @@ export interface BackendActionResult {
   data?: unknown;
 }
 
-const BACKEND_BASE_URL = process.env.BACKEND_API_URL || "http://localhost:5001";
+const BACKEND_BASE_URL = process.env.BACKEND_API_URL || "http://localhost:5000";
 
 async function callBackendAPI(
   endpoint: string,

ui/fhir-place/src/lib/auth.ts

@@ -10,6 +10,7 @@ import {
   DatabaseError,
 } from "./errors";
 import { validatePassword } from "./password-validation";
+import crypto from "crypto";
 
 export interface CreateUserData {
   username: string;

ui/fhir-place/src/lib/db.ts

@@ -3,7 +3,7 @@ import { drizzle } from "drizzle-orm/better-sqlite3";
 import * as schema from "./schema";
 import path from "path";
 
-const dbPath = path.join(process.cwd(), "database.sqlite");
+const dbPath = path.join(process.cwd(), "data", "database.sqlite");
 const sqlite = new Database(dbPath);
 const db = drizzle(sqlite, { schema });
 

ui/fhir-place/start.sh

@@ -0,0 +1,5 @@
+#!/bin/sh
+
+# Start the application
+echo "Starting Next.js application..."
+node server.js