harbor test v

Reviewed-on: Abdulbari/sgeUpdated#13

.gitea/workflows/sgeupdated.yml

@@ -0,0 +1,29 @@
+name: sgeUpdated CI/CD
+
+on:
+  pull_request:
+    types:
+      - closed     # Fires when a PR is closed (either merged or manually closed)
+    branches:
+      - main       # Only when PR targets main
+
+jobs:
+  deploy:
+    if: github.event.pull_request.merged == true    # Run only if the PR was merged (not just closed)
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Setup SSH
+        run: |
+          mkdir -p ~/.ssh/
+          echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_rsa
+          chmod 600 ~/.ssh/id_rsa
+          ssh-keyscan ${{ secrets.SERVER_HOST }} >> ~/.ssh/known_hosts
+
+      - name: Run deploy script on server
+        run: |
+          ssh ${{ secrets.SERVER_USER }}@${{ secrets.SERVER_HOST }} << 'EOF'
+            echo "✅ PR merged into main — running deploy script.."
+            cd /home/ubuntu/Bgreen/sgeUpdated
+            ./deploy.sh
+          EOF

config.conf

@@ -0,0 +1,24 @@
+# SGE Application Configuration
+# This file contains configuration for both backend and frontend
+
+# Database Configuration
+SPRING_DATASOURCE_URL=jdbc:postgresql://bgreen-database:5432/sge
+SPRING_DATASOURCE_USERNAME=sge
+SPRING_DATASOURCE_PASSWORD=147
+
+# Server Configuration
+SERVER_PORT=8080
+
+# Mail Configuration
+MAIL_HOSTNAME=mail.spacemail.com
+MAIL_SMTP_PORT=465
+MAIL_ADDRESS=info@blc-css.com
+MAIL_PASSWORD=123456Bb@
+
+# React Application Configuration
+# API Configuration
+API_PROTOCOL=http
+API_HOST=bgreen-backend
+
+# Application URLs
+APP_SURVEY_BASE_URL=https://bgreen.blc-css.com

deploy.sh

@@ -0,0 +1,110 @@
+#!/bin/bash
+set -euo pipefail
+
+cd /home/ubuntu/Bgreen/sgeUpdated
+
+# -----------------------
+# Harbor settings
+# -----------------------
+HARBOR_REGISTRY="10.150.1.166"
+HARBOR_PROJECT="bgreen"
+
+BACKEND_IMAGE_REPO="${HARBOR_REGISTRY}/${HARBOR_PROJECT}/bgreen-backend"
+FRONTEND_IMAGE_REPO="${HARBOR_REGISTRY}/${HARBOR_PROJECT}/bgreen-frontend"
+
+# Tag images with git commit (better than latest; enables rollback)
+VERSION="$(git rev-parse --short HEAD)"
+
+echo "📦 Fetching latest changes from origin/main..."
+git fetch myfork main
+
+# Detect which files changed between local HEAD and the latest remote version
+CHANGED_FILES=$(git diff --name-only HEAD myfork/main || true)
+
+if [ -z "$CHANGED_FILES" ]; then
+  echo "✅ No file changes detected between HEAD and origin/main."
+else
+  echo "🪶 Changed files:"
+  echo "$CHANGED_FILES"
+fi
+
+# Update to the latest version
+git reset --hard myfork/main
+
+BACKEND_CHANGED=false
+FRONTEND_CHANGED=false
+
+# Check if backend folder changed (excluding README.md)
+if echo "$CHANGED_FILES" | grep "^sge-backend/" | grep -qv "README.md$"; then
+  BACKEND_CHANGED=true
+fi
+
+# Check if frontend folder changed (excluding README.md)
+if echo "$CHANGED_FILES" | grep "^sge-frontend/" | grep -qv "README.md$"; then
+  FRONTEND_CHANGED=true
+fi
+
+# -----------------------
+# Backend section
+# -----------------------
+if [ "$BACKEND_CHANGED" = true ]; then
+  echo "⚡ Backend changes detected."
+
+  cd sge-backend
+  echo "Running Maven build..."
+  /opt/apache-maven-3.9.11/bin/mvn clean install -DskipTests
+
+  echo "🐳 Building backend Docker image..."
+  docker build -t "${BACKEND_IMAGE_REPO}:${VERSION}" .
+
+  echo "📤 Pushing backend image to Harbor..."
+  docker push "${BACKEND_IMAGE_REPO}:${VERSION}"
+
+  echo "📥 Pulling backend image from Harbor (to ensure registry is source of truth)..."
+  docker pull "${BACKEND_IMAGE_REPO}:${VERSION}"
+
+  cd ..
+
+  echo "🚀 Recreating backend container using Harbor image..."
+  VERSION="$VERSION" docker compose up -d bgreen-backend
+
+else
+  echo "✅ No backend changes."
+fi
+
+# -----------------------
+# Frontend section
+# -----------------------
+if [ "$FRONTEND_CHANGED" = true ]; then
+  echo "⚡ Frontend changes detected."
+  cd sge-frontend
+
+  # Check if package.json or package-lock.json changed
+  if echo "$CHANGED_FILES" | grep -qE "^sge-frontend/(package\.json|package-lock\.json)$"; then
+    echo "📦 package.json changed. Running 'npm install' and 'npm run build'..."
+    npm install
+    npm run build
+  else
+    echo "📦 only code changes. Running 'npm run build'..."
+    npm run build
+  fi
+
+  echo "🐳 Building frontend Docker image..."
+  docker build -t "${FRONTEND_IMAGE_REPO}:${VERSION}" .
+
+  echo "📤 Pushing frontend image to Harbor..."
+  docker push "${FRONTEND_IMAGE_REPO}:${VERSION}"
+
+  echo "📥 Pulling frontend image from Harbor (to ensure registry is source of truth)..."
+  docker pull "${FRONTEND_IMAGE_REPO}:${VERSION}"
+
+  cd ..
+
+  echo "🚀 Recreating frontend container using Harbor image..."
+  VERSION="$VERSION" docker compose up -d bgreen-frontend
+
+else
+  echo "✅ No frontend changes."
+fi
+
+echo "✅ Deployment complete."

deploy.sh.save

@@ -0,0 +1,69 @@
+#!/bin/bash
+set -euo pipefail
+
+export GIT_SSH_COMMAND="ssh -i ~/.ssh/deploy_id_rsa -o StrictHostKeyC
+
+cd /home/ubuntu/Bgreen/sgeUpdated
+
+echo "📦 Fetching latest changes from origin/main..."
+git fetch origin main
+
+# Detect which files changed between local HEAD and the latest remote version
+CHANGED_FILES=$(git diff --name-only HEAD origin/main || true)
+
+if [ -z "$CHANGED_FILES" ]; then
+  echo "✅ No file changes detected between HEAD and origin/main."
+else
+  echo "🪶 Changed files:"
+  echo "$CHANGED_FILES"
+fi
+
+# Update to the latest version
+git reset --hard origin/main
+
+BACKEND_CHANGED=false
+FRONTEND_CHANGED=false
+
+# Check if backend folder changed
+if echo "$CHANGED_FILES" | grep -q "^sge-backend/"; then
+  BACKEND_CHANGED=true
+fi
+
+# Check if frontend folder changed
+if echo "$CHANGED_FILES" | grep -q "^sge-frontend/"; then
+  FRONTEND_CHANGED=true
+fi
+
+# -----------------------
+# Backend section
+# -----------------------
+if [ "$BACKEND_CHANGED" = true ]; then
+  echo "⚡ Backend changes detected."
+  cd sge-backend
+  echo "Running Maven build..."
+  /opt/apache-maven-3.9.11/bin/mvn clean install -DskipTests
+  cd ..
+  echo "Rebuilding backend Docker container..."
+  docker compose up -d --build bgreen-backend
+else
+  echo "✅ No backend changes."
+fi
+
+# -----------------------
+# Frontend section
+# -----------------------
+if [ "$FRONTEND_CHANGED" = true ]; then
+  echo "⚡ Frontend changes detected."
+  cd sge-frontend
+  echo "Running npm build..."
+  npm install
+  npm run build
+  cd ..
+  echo "Rebuilding frontend Docker container..."
+  docker compose up -d --build bgreen-frontend
+else
+  echo "✅ No frontend changes."
+fi
+
+echo "✅ Deployment complete."
+

docker-compose.yml

@@ -1,5 +1,5 @@
 services:
-  backend:
+  bgreen-backend:
     build:
       context: ./sge-backend
       dockerfile: Dockerfile
@@ -13,7 +13,7 @@ services:
       - database
     restart: unless-stopped  
 
-  frontend:
+  bgreen-frontend:
     build:
       context: ./sge-frontend
       dockerfile: Dockerfile

sge-backend/README.md

@@ -0,0 +1 @@
+## CI/CD Pipeline Check v23

sge-backend/pom.xml

@@ -6,12 +6,12 @@
     <parent>
         <groupId>org.springframework.boot</groupId>
         <artifactId>spring-boot-starter-parent</artifactId>
-        <version>2.5.4</version>
+        <version>2.5.5</version>
         <relativePath />
     </parent>
     <groupId>com.sgs</groupId>
     <artifactId>sgs</artifactId>
-    <version>0.0.1-SNAPSHOT</version>
+    <version>0.0.2-SNAPSHOT</version>
     <name>sgs</name>
     <description>SGS project for Spring Boot</description>
     <properties>

sge-frontend/README.md

@@ -1,104 +1,108 @@
-# SGE System Frontend
+# SGE System Frontend
-
+
-## Overview
+## Overview
-
+
-The frontend of the SGE System is a modern web application built with **React**, providing an interactive and user-friendly interface. It communicates with the backend API to deliver a seamless experience for users.
+The frontend of the SGE System is a modern web application built with **React**, providing an interactive and user-friendly interface. It communicates with the backend API to deliver a seamless experience for users.
-
+
-## Technology Stack
+## Technology Stack
-
+
-- **React** – UI library
+- **React** – UI library
-- **React Router** – Routing
+- **React Router** – Routing
-- **i18n** – Internationalization
+- **i18n** – Internationalization
-- **Docker** – Containerization
+- **Docker** – Containerization
-
+
-## Repository Structure
+## Repository Structure
-
+
-```
+```
-SGE/
+SGE/
-├── sge-backend/           # Backend source code
+├── sge-backend/           # Backend source code
-├── sge-frontend/          # Frontend source code
+├── sge-frontend/          # Frontend source code
-├── config.conf            # Centralized configuration file (see below)
+├── config.conf            # Centralized configuration file (see below)
-├── docker-compose.yml     # Docker Compose file (see below)
+├── docker-compose.yml     # Docker Compose file (see below)
-```
+```
-
+
-## Setup and Installation
+## Setup and Installation
-
+
-### Prerequisites
+### Prerequisites
-
+
-- **Node.js** (v14.0.0 required) and npm
+- **Node.js** (v14.0.0 required) and npm
-- **Docker** (for containerized deployment)
+- **Docker** (for containerized deployment)
-
+
-#### Node.js Version Management
+#### Node.js Version Management
-
+
-If you need to switch Node versions, use nvm:
+If you need to switch Node versions, use nvm:
-
+
-```sh
+```sh
-nvm install v14.0.0
+nvm install v14.0.0
-nvm use v14.0.0
+nvm use v14.0.0
-unset NODE_OPTIONS
+unset NODE_OPTIONS
-```
+```
-
+
-### Frontend Setup
+### Frontend Setup
-
+
-#### Local Development
+#### Local Development
-
+
-1. Clone the repository and navigate to the frontend directory:
+1. Clone the repository and navigate to the frontend directory:
-
+
-   ```sh
+   ```sh
-   git clone <repository-url>
+   git clone <repository-url>
-   cd SGE/sge-frontend
+   cd SGE/sge-frontend
-   ```
+   ```
-
+
-2. Ensure `config.conf` is in the project root (`SGE/`).  
+2. Ensure `config.conf` is in the project root (`SGE/`).  
-   You can either:
+   You can either:
-
+
-   - Manually set environment variables from `config.conf`
+   - Manually set environment variables from `config.conf`
-   - Or configure your IDE to load variables from `config.conf`
+   - Or configure your IDE to load variables from `config.conf`
-
+
-3. Install dependencies:
+3. Install dependencies:
-
+
-   ```sh
+   ```sh
-   npm install
+   npm install
-   ```
+   ```
-
+
-4. Start the development server:
+4. Start the development server:
-   ```sh
+   ```sh
-   npm start
+   npm start
-   ```
+   ```
-
+
-#### Docker Deployment
+#### Docker Deployment
-
+
-1. Ensure both `config.conf` and `docker-compose.yml` are in the project root (`SGE/`).
+1. Ensure both `config.conf` and `docker-compose.yml` are in the project root (`SGE/`).
-2. From the root directory, build and run the frontend (and backend) using Docker:
+2. From the root directory, build and run the frontend (and backend) using Docker:
-   ```sh
+   ```sh
-   docker-compose up --build
+   docker-compose up --build
-   ```
+   ```
-
+
-## Configuration Management
+## Configuration Management
-
+
-The SGE System uses a centralized `config.conf` file for all environment variables.  
+The SGE System uses a centralized `config.conf` file for all environment variables.  
-**Location:** Place `config.conf` in the root directory of your project, alongside `docker-compose.yml`.
+**Location:** Place `config.conf` in the root directory of your project, alongside `docker-compose.yml`.
-
+
-This file contains environment variables for both backend and frontend components, including:
+This file contains environment variables for both backend and frontend components, including:
-
+
-- API connection settings
+- API connection settings
-- Mail configuration
+- Mail configuration
-- Application URLs
+- Application URLs
-
+
-When running with Docker, environment variables are automatically loaded from `config.conf` via the `env_file` directive in `docker-compose.yml`.
+When running with Docker, environment variables are automatically loaded from `config.conf` via the `env_file` directive in `docker-compose.yml`.
-
+
-For local development, you can either:
+For local development, you can either:
-
+
-- Use the same `config.conf` file and manually set the environment variables
+- Use the same `config.conf` file and manually set the environment variables
-- Configure your IDE to load these variables from the file
+- Configure your IDE to load these variables from the file
-
+
-Refer to the backend README for more details on configuration options and structure.
+Refer to the backend README for more details on configuration options and structure.
-
+
-## Integration with Backend
+## Integration with Backend
-
+
-The frontend expects the backend API to be available at the host and port specified in `config.conf` (`API_PROTOCOL`, `API_HOST`, `SERVER_PORT`).  
+The frontend expects the backend API to be available at the host and port specified in `config.conf` (`API_PROTOCOL`, `API_HOST`, `SERVER_PORT`).  
-Ensure both services are configured consistently.
+Ensure both services are configured consistently.
-
+
-## License
+## License
-
+
-[Insert your license information here]
+[Insert your license information here]
+
+## CI/CD Testing v20
+
+

sge-frontend/nginx.conf

@@ -1,39 +1,32 @@
 server {
     listen       80;
     server_name  bgreen.blc-css.com;
-
     root   /usr/share/nginx/html;
     index  index.html index.htm;
-
     location / {
         try_files $uri /index.html;
     }
-
     location /api/v1/graphql {
         proxy_pass http://bgreen-backend:8080/api/v1/graphql;
         proxy_set_header Host $host;
         proxy_set_header X-Real-IP $remote_addr;
     }
-
     location /api/v1/upload {
         proxy_pass http://bgreen-backend:8080/upload;
         proxy_set_header Host $host;
         proxy_set_header X-Real-IP $remote_addr;
     }
-
 #    location /api/v1/datacenter {
 #        proxy_pass http://backend:8080/api/v1/datacenter;
 #        proxy_set_header Host $host;
 #        proxy_set_header X-Real-IP $remote_addr;
 #    }
-
     # Hata durumlarında da index.html'i sun
     error_page 404 /index.html;
-
     gzip on;
     gzip_vary on;
     gzip_min_length 10240;
     gzip_proxied any;
     gzip_types text/plain text/css text/xml text/javascript application/javascript application/json application/xml application/rss+xml application/atom+xml image/svg+xml;
     gzip_comp_level 5;
-}
+}

sge-frontend/package.json

@@ -1,131 +1,131 @@
-{
+{
-  "name": "sgs-web",
+  "name": "sgs-web",
-  "version": "1.0.0",
+  "version": "1.0.1",
-  "private": true,
+  "private": true,
-  "dependencies": {
+  "dependencies": {
-    "@apollo/client": "^3.13.8",
+    "@apollo/client": "^3.13.8",
-    "@casl/react": "4.0.0",
+    "@casl/react": "4.0.0",
-    "@emotion/react": "^11.11.1",
+    "@emotion/react": "^11.11.1",
-    "@emotion/styled": "^11.10.6",
+    "@emotion/styled": "^11.10.6",
-    "@mui/icons-material": "^5.2.4",
+    "@mui/icons-material": "^5.2.4",
-    "@mui/material": "^5.2.4",
+    "@mui/material": "^5.2.4",
-    "animate.css": "4.1.1",
+    "animate.css": "4.1.1",
-    "axios": "^0.21.1",
+    "axios": "^0.21.1",
-    "bootstrap": "4.5.2",
+    "bootstrap": "4.5.2",
-    "chart.js": "^4.3.0",
+    "chart.js": "^4.3.0",
-    "chartjs-plugin-datalabels": "^2.2.0",
+    "chartjs-plugin-datalabels": "^2.2.0",
-    "classnames": "2.2.6",
+    "classnames": "2.2.6",
-    "dotenv": "^14.3.2",
+    "dotenv": "^14.3.2",
-    "file-saver": "^2.0.5",
+    "file-saver": "^2.0.5",
-    "graphql": "^16.11.0",
+    "graphql": "^16.11.0",
-    "html2canvas": "^1.4.1",
+    "html2canvas": "^1.4.1",
-    "i18next": "^22.4.14",
+    "i18next": "^22.4.14",
-    "i18next-browser-languagedetector": "^7.0.1",
+    "i18next-browser-languagedetector": "^7.0.1",
-    "i18next-http-backend": "^2.2.0",
+    "i18next-http-backend": "^2.2.0",
-    "jquery": "^3.7.1",
+    "jquery": "^3.7.1",
-    "jspdf": "^2.5.1",
+    "jspdf": "^2.5.1",
-    "jwt-decode": "^3.1.2",
+    "jwt-decode": "^3.1.2",
-    "leaflet": "^1.6.0",
+    "leaflet": "^1.6.0",
-    "material-react-table": "^1.14.0",
+    "material-react-table": "^1.14.0",
-    "moment": "2.29.1",
+    "moment": "2.29.1",
-    "notistack": "^2.0.8",
+    "notistack": "^2.0.8",
-    "postcss-rtl": "1.5.0",
+    "postcss-rtl": "1.5.0",
-    "prop-types": "15.7.2",
+    "prop-types": "15.7.2",
-    "react": "17.0.1",
+    "react": "17.0.1",
-    "react-bootstrap": "^2.10.6",
+    "react-bootstrap": "^2.10.6",
-    "react-chartjs-2": "^5.2.0",
+    "react-chartjs-2": "^5.2.0",
-    "react-color": "^2.19.3",
+    "react-color": "^2.19.3",
-    "react-data-table-component": "^7.5.0",
+    "react-data-table-component": "^7.5.0",
-    "react-datepicker": "^4.16.0",
+    "react-datepicker": "^4.16.0",
-    "react-dom": "17.0.1",
+    "react-dom": "17.0.1",
-    "react-feather": "~2.0.3",
+    "react-feather": "~2.0.3",
-    "react-i18next": "^12.2.0",
+    "react-i18next": "^12.2.0",
-    "react-intl": "6.0.5",
+    "react-intl": "6.0.5",
-    "react-leaflet": "^3.2.5",
+    "react-leaflet": "^3.2.5",
-    "react-paginate": "8.2.0",
+    "react-paginate": "8.2.0",
-    "react-perfect-scrollbar": "^1.5.5",
+    "react-perfect-scrollbar": "^1.5.5",
-    "react-redux": "7.2.2",
+    "react-redux": "7.2.2",
-    "react-router-dom": "^5.2.0",
+    "react-router-dom": "^5.2.0",
-    "react-scroll-up": "1.3.7",
+    "react-scroll-up": "1.3.7",
-    "react-select": "4.0.2",
+    "react-select": "4.0.2",
-    "react-toastify": "^7.0.3",
+    "react-toastify": "^7.0.3",
-    "reactstrap": "9.2.3",
+    "reactstrap": "9.2.3",
-    "redux": "4.0.5",
+    "redux": "4.0.5",
-    "redux-debounced": "0.5.0",
+    "redux-debounced": "0.5.0",
-    "redux-thunk": "2.3.0",
+    "redux-thunk": "2.3.0",
-    "styled-components": "^5.3.6",
+    "styled-components": "^5.3.6",
-    "sweetalert2": "11.0.0",
+    "sweetalert2": "11.0.0",
-    "sweetalert2-react-content": "4.2.0",
+    "sweetalert2-react-content": "4.2.0",
-    "swiper": "6.0.4",
+    "swiper": "6.0.4",
-    "uuid": "^9.0.0",
+    "uuid": "^9.0.0",
-    "web-vitals": "^1.0.1",
+    "web-vitals": "^1.0.1",
-    "websocket": "^1.0.34",
+    "websocket": "^1.0.34",
-    "wnumb": "1.2.0",
+    "wnumb": "1.2.0",
-    "xlsx": "^0.18.5",
+    "xlsx": "^0.18.5",
-    "yarn": "1.21.1",
+    "yarn": "1.21.1",
-    "yup": "0.32.8"
+    "yup": "0.32.8"
-  },
+  },
-  "scripts": {
+  "scripts": {
-    "start": "react-app-rewired start",
+    "start": "react-app-rewired start",
-    "build:dev": "react-app-rewired build --mode development",
+    "build:dev": "react-app-rewired build --mode development",
-    "build:prod": "react-app-rewired build --mode production",
+    "build:prod": "react-app-rewired build --mode production",
-    "build": "react-app-rewired build",
+    "build": "react-app-rewired build",
-    "test": "react-scripts test",
+    "test": "react-scripts test",
-    "eject": "react-scripts eject",
+    "eject": "react-scripts eject",
-    "lint": "eslint src/**/*.js src/**/*.jsx",
+    "lint": "eslint src/**/*.js src/**/*.jsx",
-    "lint:fix": "eslint src/**/*.js --fix"
+    "lint:fix": "eslint src/**/*.js --fix"
-  },
+  },
-  "eslintConfig": {
+  "eslintConfig": {
-    "extends": [
+    "extends": [
-      "react-app",
+      "react-app",
-      "react-app/jest"
+      "react-app/jest"
-    ]
+    ]
-  },
+  },
-  "browserslist": {
+  "browserslist": {
-    "production": [
+    "production": [
-      ">0.2%",
+      ">0.2%",
-      "not dead",
+      "not dead",
-      "not op_mini all"
+      "not op_mini all"
-    ],
+    ],
-    "development": [
+    "development": [
-      "last 1 chrome version",
+      "last 1 chrome version",
-      "last 1 firefox version",
+      "last 1 firefox version",
-      "last 1 safari version"
+      "last 1 safari version"
-    ]
+    ]
-  },
+  },
-  "devDependencies": {
+  "devDependencies": {
-    "@babel/core": "^7.27.1",
+    "@babel/core": "^7.27.1",
-    "@babel/plugin-proposal-class-properties": "^7.18.6",
+    "@babel/plugin-proposal-class-properties": "^7.18.6",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
+    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/preset-env": "^7.27.1",
+    "@babel/preset-env": "^7.27.1",
-    "@babel/preset-react": "^7.27.1",
+    "@babel/preset-react": "^7.27.1",
-    "@craco/craco": "^7.1.0",
+    "@craco/craco": "^7.1.0",
-    "@swc/core": "^1.11.24",
+    "@swc/core": "^1.11.24",
-    "@types/leaflet": "^1.7.5",
+    "@types/leaflet": "^1.7.5",
-    "@types/sortablejs": "^1.10.6",
+    "@types/sortablejs": "^1.10.6",
-    "babel-eslint": "^10.1.0",
+    "babel-eslint": "^10.1.0",
-    "babel-loader": "^10.0.0",
+    "babel-loader": "^10.0.0",
-    "babel-plugin-styled-components": "^2.1.4",
+    "babel-plugin-styled-components": "^2.1.4",
-    "core-js": "^3.42.0",
+    "core-js": "^3.42.0",
-    "eslint": "^8.48.0",
+    "eslint": "^8.48.0",
-    "eslint-config-react-app": "^7.0.1",
+    "eslint-config-react-app": "^7.0.1",
-    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-react": "^7.33.0",
+    "eslint-plugin-react": "^7.33.0",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-hooks": "^4.6.0",
-    "react-app-rewire-postcss": "^3.0.2",
+    "react-app-rewire-postcss": "^3.0.2",
-    "react-app-rewired": "^2.2.1",
+    "react-app-rewired": "^2.2.1",
-    "react-error-overlay": "^6.0.9",
+    "react-error-overlay": "^6.0.9",
-    "react-loadable": "^5.5.0",
+    "react-loadable": "^5.5.0",
-    "react-scripts": "^5.0.1",
+    "react-scripts": "^5.0.1",
-    "sass": "^1.81.0",
+    "sass": "^1.81.0",
-    "sass-loader": "^8.0.2",
+    "sass-loader": "^8.0.2",
-    "swc-loader": "^0.2.6",
+    "swc-loader": "^0.2.6",
-    "typescript": "^4.9.5",
+    "typescript": "^4.9.5",
-    "webpack": "^5.96.1"
+    "webpack": "^5.96.1"
-  },
+  },
-  "resolutions": {
+  "resolutions": {
-    "react-error-overlay": "6.0.9"
+    "react-error-overlay": "6.0.9"
-  },
+  },
-  "homepage": ""
+  "homepage": ""
-}
+}

sge-frontend/src/views/Communication.js

@@ -1,218 +1,218 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
-import {
+import {
-  Button,
+  Button,
-  Card,
+  Card,
-  CardHeader,
+  CardHeader,
-  CardTitle,
+  CardTitle,
-  Col,
+  Col,
-  Modal,
+  Modal,
-  ModalBody,
+  ModalBody,
-  ModalHeader,
+  ModalHeader,
-  Row,
+  Row,
-  UncontrolledTooltip, // Add UncontrolledTooltip import
+  UncontrolledTooltip, // Add UncontrolledTooltip   import
-} from "reactstrap";
+} from "reactstrap";
-import { Edit, Mail, Phone, MapPin } from "react-feather"; // Import Mail, Phone, MapPin
+import { Edit, Mail, Phone, MapPin } from "react-feather"; // Import Mail, Phone, MapPin
-
+
-import { useSnackbar } from "notistack";
+import { useSnackbar } from "notistack";
-import { useTranslation } from "react-i18next";
+import { useTranslation } from "react-i18next";
-import { useDispatch, useSelector } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
-import { permissionCheck } from "../components/permission-check";
+import { permissionCheck } from "../components/permission-check";
-import {
+import {
-  getMailSettings,
+  getMailSettings,
-  clearMailSuccess,
+  clearMailSuccess,
-  clearMailError,
+  clearMailError,
-} from "../redux/actions/mailSettings";
+} from "../redux/actions/mailSettings";
-import MailSettings from "./MailSettings";
+import MailSettings from "./MailSettings";
-import SpinnerComponent from "../@core/components/spinner/Fallback-spinner";
+import SpinnerComponent from "../@core/components/spinner/Fallback-spinner";
-
+
-// Import custom styles for the communication page
+// Import custom styles for the communication page
-import "../assets/scss/pages/communication.scss";
+import "../assets/scss/pages/communication.scss";
-
+
-function Communication() {
+function Communication() {
-  const { t } = useTranslation();
+  const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useDispatch();
-  const { enqueueSnackbar } = useSnackbar();
+  const { enqueueSnackbar } = useSnackbar();
-  const { currentSettings, loading, success, error } = useSelector(
+  const { currentSettings, loading, success, error } = useSelector(
-    // Add loading to useSelector
+    // Add loading to useSelector
-    (state) => state.mailSettings
+    (state) => state.mailSettings
-  );
+  );
-  const [showMailModal, setShowMailModal] = useState(false);
+  const [showMailModal, setShowMailModal] = useState(false);
-
+
-  useEffect(() => {
+  useEffect(() => {
-    // Load mail settings once when component mounts
+    // Load mail settings once when component mounts
-    dispatch(getMailSettings());
+    dispatch(getMailSettings());
-  }, [dispatch]);
+  }, [dispatch]);
-
+
-  useEffect(() => {
+  useEffect(() => {
-    if (success) {
+    if (success) {
-      enqueueSnackbar(t("Warnings.updatedSuccessfully"), {
+      enqueueSnackbar(t("Warnings.updatedSuccessfully"), {
-        variant: "success",
+        variant: "success",
-      });
+      });
-      dispatch(clearMailSuccess());
+      dispatch(clearMailSuccess());
-    }
+    }
-  }, [success, enqueueSnackbar, t, dispatch]);
+  }, [success, enqueueSnackbar, t, dispatch]);
-
+
-  useEffect(() => {
+  useEffect(() => {
-    if (error) {
+    if (error) {
-      const errorMessage =
+      const errorMessage =
-        error?.graphQLErrors?.[0]?.message ||
+        error?.graphQLErrors?.[0]?.message ||
-        error?.message ||
+        error?.message ||
-        t("Warnings.genericUpdateFailed");
+        t("Warnings.genericUpdateFailed");
-
+
-      enqueueSnackbar(errorMessage, {
+      enqueueSnackbar(errorMessage, {
-        variant: "error",
+        variant: "error",
-      });
+      });
-      dispatch(clearMailError());
+      dispatch(clearMailError());
-    }
+    }
-  }, [error, enqueueSnackbar, t, dispatch]);
+  }, [error, enqueueSnackbar, t, dispatch]);
-
+
-  // Get email address from settings or use default from environment variable
+  // Get email address from settings or use default from environment variable
-  const defaultEmail = process.env.REACT_APP_DEFAULT_EMAIL || "";
+  const defaultEmail = process.env.REACT_APP_DEFAULT_EMAIL || "";
-  // Use default email if currentSettings is null or emailAddress is null
+  // Use default email if currentSettings is null or emailAddress is null
-  const emailAddress = currentSettings?.emailAddress || defaultEmail;
+  const emailAddress = currentSettings?.emailAddress || defaultEmail;
-  const handleEmailClick = () => {
+  const handleEmailClick = () => {
-    if (emailAddress) {
+    if (emailAddress) {
-      window.location.href = `mailto:${emailAddress}`;
+      window.location.href = `mailto:${emailAddress}`;
-    }
+    }
-  };
+  };
-
+
-  const handleCloseModal = () => {
+  const handleCloseModal = () => {
-    setShowMailModal(false);
+    setShowMailModal(false);
-  };
+  };
-
+
-  return (
+  return (
-    <div style={{ marginTop: "2%" }}>
+    <div style={{ marginTop: "2%" }}>
-      {loading && !currentSettings ? (
+      {loading && !currentSettings ? (
-        <div
+        <div
-          style={{
+          style={{
-            display: "flex",
+            display: "flex",
-            justifyContent: "center",
+            justifyContent: "center",
-            alignItems: "center",
+            alignItems: "center",
-            minHeight: 200,
+            minHeight: 200,
-          }}
+          }}
-        >
+        >
-          <SpinnerComponent />
+          <SpinnerComponent />
-        </div>
+        </div>
-      ) : (
+      ) : (
-        <>
+        <>
-          {permissionCheck("settings_access") && (
+          {permissionCheck("settings_access") && (
-            <>
+            <>
-              <Modal
+              <Modal
-                isOpen={showMailModal}
+                isOpen={showMailModal}
-                toggle={handleCloseModal}
+                toggle={handleCloseModal}
-                className="modal-dialog-centered"
+                className="modal-dialog-centered"
-                size="lg"
+                size="lg"
-              >
+              >
-                <ModalHeader toggle={handleCloseModal}>
+                <ModalHeader toggle={handleCloseModal}>
-                  {t("MailSettings.editMailInfo")}
+                  {t("MailSettings.editMailInfo")}
-                </ModalHeader>
+                </ModalHeader>
-                <ModalBody>
+                <ModalBody>
-                  <MailSettings closeModal={handleCloseModal} />
+                  <MailSettings closeModal={handleCloseModal} />
-                </ModalBody>
+                </ModalBody>
-              </Modal>
+              </Modal>
-            </>
+            </>
-          )}
+          )}
-          <Card className="border-bottom">
+          <Card className="border-bottom">
-            <CardHeader className="border-bottom">
+            <CardHeader className="border-bottom">
-              <CardTitle tag="h2" className="row ml-md-2 align-items-center">
+              <CardTitle tag="h2" className="row ml-md-2 align-items-center">
-                {t("Contact.contactInfo")}
+                {t("Contact.contactInfo")}
-              </CardTitle>
+              </CardTitle>
-            </CardHeader>
+            </CardHeader>
-            <Row>
+            <Row>
-              <Col className="pl-md-5 pl-2 col-md-6 col-12">
+              <Col className="pl-md-5 pl-2 col-md-6 col-12">
-                <Row className="mx-0 mt-1">
+                <Row className="mx-0 mt-1">
-                  <Col sm="6" md="5" className="mr-2">
+                  <Col sm="6" md="5" className="mr-2">
-                    <div className="email-container d-flex align-items-center justify-content-between">
+                    <div className="email-container d-flex align-items-center justify-content-between">
-                      <div>
+                      <div>
-                        <h4>
+                        <h4>
-                          <Mail size={16} className="mr-1" />{" "}
+                          <Mail size={16} className="mr-1" />{" "}
-                          {t("Contact.contactEmail")}
+                          {t("Contact.contactEmail")}
-                        </h4>{" "}
+                        </h4>{" "}
-                        {/* Add Mail icon */}
+                        {/* Add Mail icon */}
-                        <p
+                        <p
-                          style={{
+                          style={{
-                            color: emailAddress ? "blue" : "inherit",
+                            color: emailAddress ? "blue" : "inherit",
-                            textDecoration: emailAddress ? "underline" : "none",
+                            textDecoration: emailAddress ? "underline" : "none",
-                            cursor: emailAddress ? "pointer" : "default",
+                            cursor: emailAddress ? "pointer" : "default",
-                          }}
+                          }}
-                          onClick={handleEmailClick}
+                          onClick={handleEmailClick}
-                        >
+                        >
-                          {emailAddress ||
+                          {emailAddress ||
-                            defaultEmail ||
+                            defaultEmail ||
-                            t("MailSettings.notConfigured")}
+                            t("MailSettings.notConfigured")}
-                        </p>
+                        </p>
-                      </div>
+                      </div>
-                      {permissionCheck("settings_access") && (
+                      {permissionCheck("settings_access") && (
-                        <>
+                        <>
-                          {" "}
+                          {" "}
-                          {/* Wrap button and tooltip in fragment */}
+                          {/* Wrap button and tooltip in fragment */}
-                          <Button
+                          <Button
-                            color="flat-primary"
+                            color="flat-primary"
-                            className="btn-icon"
+                            className="btn-icon"
-                            onClick={() => setShowMailModal(true)}
+                            onClick={() => setShowMailModal(true)}
-                            id="edit-email-btn" // Add id for tooltip
+                            id="edit-email-btn" // Add id for tooltip
-                          >
+                          >
-                            <Edit size={18} />
+                            <Edit size={18} />
-                          </Button>
+                          </Button>
-                          <UncontrolledTooltip
+                          <UncontrolledTooltip
-                            placement="top"
+                            placement="top"
-                            target="edit-email-btn" // Target the button id
+                            target="edit-email-btn" // Target the button id
-                            timeout={150} // Add timeout prop to fix the warning
+                            timeout={150} // Add timeout prop to fix the warning
-                          >
+                          >
-                            {t("MailSettings.editMailInfo")}{" "}
+                            {t("MailSettings.editMailInfo")}{" "}
-                            {/* Tooltip text */}
+                            {/* Tooltip text */}
-                          </UncontrolledTooltip>
+                          </UncontrolledTooltip>
-                        </>
+                        </>
-                      )}
+                      )}
-                    </div>
+                    </div>
-                  </Col>
+                  </Col>
-                  <Col sm="6" md="5" className="mr-2">
+                  <Col sm="6" md="5" className="mr-2">
-                    <div className="telephone-container">
+                    <div className="telephone-container">
-                      <h4>
+                      <h4>
-                        <Phone size={16} className="mr-1" />{" "}
+                        <Phone size={16} className="mr-1" />{" "}
-                        {t("Contact.contactPhoneNumber")}
+                        {t("Contact.contactPhoneNumber")}
-                      </h4>{" "}
+                      </h4>{" "}
-                      {/* Add Phone icon */}
+                      {/* Add Phone icon */}
-                      <p>+90 507 750 00 41</p>
+                      <p>+90 507 750 00 41</p>
-                    </div>
+                    </div>
-                  </Col>
+                  </Col>
-                </Row>
+                </Row>
-                <Row className="mx-0 mt-4">
+                <Row className="mx-0 mt-4">
-                  <Col sm="6" md="5" className="mr-2">
+                  <Col sm="6" md="5" className="mr-2">
-                    <div className="address-container">
+                    <div className="address-container">
-                      <h4>
+                      <h4>
-                        <MapPin size={16} className="mr-1" />{" "}
+                        <MapPin size={16} className="mr-1" />{" "}
-                        {t("Contact.contactAddress")}
+                        {t("Contact.contactAddress")}
-                      </h4>{" "}
+                      </h4>{" "}
-                      {/* Add MapPin icon */}
+                      {/* Add MapPin icon */}
-                      <address>
+                      <address>
-                        Central Office: 4995 sokak no:3, Alacaatlı Mahallesi,
+                        Central Office: 4995 sokak no:3, Alacaatlı Mahallesi,
-                        Daire No: A2 06810 Çankaya/Ankara
+                        Daire No: A2 06820 Çankaya/Ankara
-                      </address>
+                      </address>
-                    </div>
+                    </div>
-                  </Col>
+                  </Col>
-                </Row>
+                </Row>
-              </Col>
+              </Col>
-              <Col className="pl-md-5 pl-2 col-md-6 col-12 pb-2 border-left">
+              <Col className="pl-md-5 pl-2 col-md-6 col-12 pb-2 border-left">
-                <Row className="mx-0 mt-1">
+                <Row className="mx-0 mt-1">
-                  <div className="address-map w-100">
+                  <div className="address-map w-100">
-                    <div className="responsive-map-container">
+                    <div className="responsive-map-container">
-                      <iframe
+                      <iframe
-                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3063.1752741150003!2d32.658217075858445!3d39.847904971536735!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14d33eef6ee44755%3A0x77faea5f08f32c60!2zTUVBIEfDnFpFTEJBSMOHRU0!5e0!3m2!1sen!2str!4v1741165773414!5m2!1sen!2str"
+                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3063.1752741150003!2d32.658217075858445!3d39.847904971536735!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14d33eef6ee44755%3A0x77faea5f08f32c60!2zTUVBIEfDnFpFTEJBSMOHRU0!5e0!3m2!1sen!2str!4v1741165773414!5m2!1sen!2str"
-                        allowFullScreen=""
+                        allowFullScreen=""
-                        loading="lazy"
+                        loading="lazy"
-                        referrerPolicy="no-referrer-when-downgrade"
+                        referrerPolicy="no-referrer-when-downgrade"
-                      ></iframe>
+                      ></iframe>
-                    </div>
+                    </div>
-                  </div>
+                  </div>
-                </Row>
+                </Row>
-              </Col>
+              </Col>
-            </Row>
+            </Row>
-          </Card>
+          </Card>
-        </>
+        </>
-      )}
+      )}
-    </div>
+    </div>
-  );
+  );
-}
+}
-
+
-export default Communication;
+export default Communication;