Merge pull request #256 from NFDI4Chem/development

Development

Author: vcnainala

.github/workflows/prod-build.yml

@@ -0,0 +1,79 @@
+# This worklflow will perform following actions when a release is published:
+# - Fetch Latest release.
+# - Build the latest docker image in production.
+# - Build release and commit to repo.
+# - Push the docker image to Github Artifact Registry-Prod.
+# - Rollout latest docker image to GKE.
+# 
+# Maintainers:
+#   - name: Nisha Sharma
+#   - email: [email protected]
+
+name : Build and Deploy to Prod
+
+on:
+  push:
+    branches: [prod-helm-deploy]
+
+env:
+  DEPLOYMENT_NAME: nmrxiv-nmrium
+  DOCKER_HUB_USERNAME : ${{ secrets.DOCKER_HUB_USERNAME  }}
+  DOCKER_HUB_PASSWORD : ${{ secrets.DOCKER_HUB_PASSWORD  }}
+  REPOSITORY_NAME: nmrium-react-wrapper
+  REPOSITORY_NAMESPACE: nfdi4chem
+
+jobs:
+  setup-build-publish-deploy-prod:
+    name: Deploy to prod
+    if: github.ref == 'refs/heads/prod-helm-deploy'
+    runs-on: ubuntu-latest
+    steps:
+    - name: Checkout
+      uses: actions/[email protected]
+
+    # Login to Docker Hub
+    - name: Log in to Docker Hub
+      uses: docker/login-action@f4ef78c080cd8ba55a85445d5b36e214a81df20a
+      with:
+        username: ${{ env.DOCKER_HUB_USERNAME  }}
+        password: ${{ env.DOCKER_HUB_PASSWORD  }}
+      
+    #Fetch latest release
+    - name: Fetch latest release
+      id: fetch-latest-release
+      uses: InsonusK/[email protected]
+      with:
+        myToken: ${{ github.token }}
+        exclude_types: "draft|prerelease"
+        view_top: 10
+    - name: "Print release name"
+      run: |
+        echo "tag_name: ${{ steps.fetch-latest-release.outputs.tag_name }}"
+
+    #Build and push Docker image to Docker Hub    
+    - name: Build and push Docker image
+      uses: docker/build-push-action@v4
+      with:
+        context: .
+        file: ./Dockerfile.prod
+        push: true
+        build-args: |
+          RELEASE_VERSION=${{ steps.fetch-latest-release.outputs.tag_name }}
+        tags: ${{ env.REPOSITORY_NAMESPACE }}/${{ env.REPOSITORY_NAME }}:${{ steps.fetch-latest-release.outputs.tag_name }}, ${{ env.REPOSITORY_NAMESPACE }}/${{ env.REPOSITORY_NAME }}:latest
+        username: ${{ env.DOCKER_HUB_USERNAME  }}
+        password: ${{ env.DOCKER_HUB_PASSWORD  }}
+
+    # Build npm for release
+    - name: Build npm
+      run: |-
+        npm install
+        # Build for main distribution
+        VITE_BUILD_OUT_DIR=dist npm run build
+        # Build for specific version
+        VITE_BUILD_OUT_DIR=releases/${{ steps.fetch-latest-release.outputs.tag_name }} npm run build
+      
+    # Commit
+    - name: Commit to repo
+      uses: EndBug/[email protected]
+      with: 
+        default_author: github_actions

.gitignore

@@ -9,9 +9,6 @@
 # testing
 /coverage
 
-# production
-/build
-
 /lib
 /lib-cjs
 
@@ -34,3 +31,6 @@ yarn.lock
 
 /test-results
 /playwright-report
+
+build/
+dist/

.ncurc.yml

@@ -0,0 +1,6 @@
+# Do not update to React 19 because some packages not compatible with React 19
+reject:
+  - react
+  - react-dom
+  - '@types/react'
+  - '@types/react-dom'

Dockerfile

@@ -1,5 +1,6 @@
 # build environment
-FROM node:22-alpine as build
+FROM node:22-alpine3.18 AS build
+
 WORKDIR /app
 ENV PATH /app/node_modules/.bin:$PATH
 COPY package.json ./
@@ -12,7 +13,7 @@ RUN npm run build
 
 # production environment
 FROM nginx:stable-alpine
-COPY --from=build /app/build /usr/share/nginx/html
+COPY --from=build /app/dist /usr/share/nginx/html
 COPY nginx/nginx.conf /etc/nginx/conf.d/default.conf
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]

Dockerfile.dev

@@ -1,23 +1,40 @@
-# build environment
-FROM node:22-alpine3.18 as build
+# Build stage
+FROM node:22-alpine3.18 AS builder
 
-# ARG RELEASE_VERSION
-# ENV RELEASE_VERSION=${RELEASE_VERSION}
+# Declare build argument
+ARG RELEASE_VERSION
+ENV RELEASE_VERSION=${RELEASE_VERSION}
 
 WORKDIR /app
-ENV PATH /app/node_modules/.bin:$PATH
+ENV PATH=/app/node_modules/.bin:$PATH
+
+# Install dependencies first
 COPY package.json ./
 RUN export NODE_OPTIONS=--max-old-space-size=8192
 RUN npm i --silent
 RUN npm i react-scripts@latest -g --silent
+
+# Copy source and build
 COPY . ./
-RUN echo "export default { version: '$RELEASE_VERSION' };" > src/versionInfo.ts
-RUN npm run build -- --outDir=build
-RUN npm run build -- --outDir=build/releases/v0.0.1
+RUN echo "export default { version: '${RELEASE_VERSION}' };" > src/versionInfo.ts
 
-# production environment
+# Create releases directory and build
+RUN mkdir -p /app/releases/${RELEASE_VERSION} && \
+    npm run build && \
+    cp -r dist/* /app/releases/${RELEASE_VERSION}/
+
+# Production stage
 FROM nginx:stable-alpine
-COPY --from=build /app/build /usr/share/nginx/html
+
+# Copy built files from builder
+COPY --from=builder /app/dist /usr/share/nginx/html
+COPY --from=builder /app/releases/${RELEASE_VERSION} /usr/share/nginx/html
+
+# Copy nginx configuration
 COPY nginx/nginx.conf /etc/nginx/conf.d/default.conf
+
+# Expose port 80
 EXPOSE 80
+
+# Start nginx
 CMD ["nginx", "-g", "daemon off;"]

Dockerfile.prod

@@ -0,0 +1,46 @@
+services:
+  # Development environment
+  nmrium-dev:
+    container_name: nmrium-dev
+    build:
+      context: .
+      dockerfile: Dockerfile.dev
+    restart: always
+    networks:
+      - nmrium-network
+    environment:
+      - NODE_ENV=development
+      - CHOKIDAR_USEPOLLING=true
+
+  # Production environment
+  nmrium-prod:
+    container_name: nmrium-prod
+    build:
+      context: .
+      dockerfile: Dockerfile.prod
+      args:
+        - RELEASE_VERSION=latest
+    ports:
+      - "80:80"
+    restart: always
+    networks:
+      - nmrium-network
+
+  # Nginx reverse proxy
+  nginx-proxy:
+    container_name: nginx-proxy
+    image: nginx:stable-alpine
+    ports:
+      - "8080:80"  # Dev environment on port 8080
+      - "8081:81"  # Prod environment on port 8081
+    volumes:
+      - ./nginx/proxy.conf:/etc/nginx/conf.d/default.conf
+    depends_on:
+      - nmrium-dev
+      - nmrium-prod
+    networks:
+      - nmrium-network
+
+networks:
+  nmrium-network:
+    driver: bridge 

README.old.md

@@ -1,16 +1,43 @@
 version: '3.7'
 
 services:
+  # Development environment
+  nmrium-dev:
+    container_name: nmrium-dev
+    image: nfdi4chem/nmrium-react-wrapper:dev-latest
+    restart: always
+    networks:
+      - nmrium-network
+    environment:
+      - NODE_ENV=development
+      - CHOKIDAR_USEPOLLING=true
 
-  sample:
-    container_name: nmrium-rw
-    build:
-      context: .
-      dockerfile: Dockerfile
-    volumes:
-      - '.:/app'
-      - '/app/node_modules'
-    ports:
-      - 3001:3000
+  # Production environment
+  nmrium-prod:
+    container_name: nmrium-prod
+    image: nfdi4chem/nmrium-react-wrapper:latest
+    restart: always
+    networks:
+      - nmrium-network
     environment:
-      - CHOKIDAR_USEPOLLING=true
+      - NODE_ENV=production
+      - RELEASE_VERSION=latest
+
+  # Nginx reverse proxy
+  nginx-proxy:
+    container_name: nginx-proxy
+    image: nginx:stable-alpine
+    ports:
+      - "8080:80"  # Dev environment on port 8080
+      - "8081:81"  # Prod environment on port 8081
+    volumes:
+      - ./nginx/proxy.conf:/etc/nginx/conf.d/default.conf
+    depends_on:
+      - nmrium-dev
+      - nmrium-prod
+    networks:
+      - nmrium-network
+
+networks:
+  nmrium-network:
+    driver: bridge 

docker-compose.local.yml

@@ -7,13 +7,11 @@ export default [
         ignores: [
             'dist',
             'build',
-            'coverage',
-            'lib',
-            'lib-cjs',
+            'releases',
             'node_modules',
             'playwright-report',
             'public',
-            'vite.config.ts'
+            'vite.config.ts',
         ],
     },
     ...ts,