From 66bbc8f9af738b0e6e182ec51487e31ce3ba9448 Mon Sep 17 00:00:00 2001
From: kstargod <kbagga2004@gmail.com>
Date: Wed, 13 Nov 2024 23:37:24 -0500
Subject: [PATCH] frontend-yaml

---
 .github/workflows/frontend.yaml | 75 +++++++++++++++++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 .github/workflows/frontend.yaml

diff --git a/.github/workflows/frontend.yaml b/.github/workflows/frontend.yaml
new file mode 100644
index 0000000..f38bf55
--- /dev/null
+++ b/.github/workflows/frontend.yaml
@@ -0,0 +1,75 @@
+on:
+  push:
+    branches:
+      - main
+      - develop
+    paths:
+      - frontend/**
+
+jobs:
+  react_test_and_lint:
+    name: Test and Lint React app
+    runs-on: self-hosted
+    steps:
+      - name: Checkout the files
+        uses: actions/checkout@v2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: '20.3.1'
+
+      # Caching dependencies to speed up subsequent runs
+      - name: Restore cached dependencies
+        id: cache-restore
+        uses: actions/cache@v3
+        with:
+          path: ./frontend/node_modules
+          key: npm-${{ hashFiles('frontend/package-lock.json') }}
+          restore-keys: |
+            npm-
+
+      - name: Install dependencies
+        if: steps.cache-restore.outputs.cache-hit != 'true'
+        run: |
+          cd frontend
+          npm ci --ignore-scripts
+
+      # Run tests if they are set up (assuming `npm test` is configured in package.json)
+      - name: Test with Jest
+        run: |
+          cd frontend
+          npm run test -- --watchAll=false
+
+      # Run ESLint for code quality
+      - name: Run ESLint
+        run: |
+          cd frontend
+          npm run lint
+
+      # Build the app to ensure there are no build errors
+      - name: Build the Vite app
+        run: |
+          cd frontend
+          npm run build
+
+  # Optional Docker build job if containerization is required
+  docker_build:
+    name: Build Docker Image
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout the files
+        uses: actions/checkout@v2
+
+      - name: Build Docker Image
+        run: |
+          docker build -t react-app:latest frontend/
+
+      - name: Push Docker Image
+        env:
+          DOCKER_USERNAME: ${{ secrets.DOCKER_USERNAME }}
+          DOCKER_PASSWORD: ${{ secrets.DOCKER_PASSWORD }}
+        run: |
+          echo "$DOCKER_PASSWORD" | docker login -u "$DOCKER_USERNAME" --password-stdin
+          docker tag react-app:latest your-docker-repo/react-app:latest
+          docker push your-docker-repo/react-app:latest