Merge pull request #31 from Doble-Technologies/test-deploy

Test deploy

.github/workflows/api-container.yml

@@ -1,95 +1,101 @@
-name: API Deployment Container
+name: API Deployment Container
-on:
+on:
-  workflow_dispatch: {}
+  workflow_dispatch: {}
-  pull_request:
+  pull_request:
-    branches:
+    branches:
-      - main
+      - main
-    types:
+    types:
-      - opened
+      - opened
-      - reopened
+      - reopened
-      - synchronize
+      - synchronize
-      - ready_for_review
+      - ready_for_review
-  push:
+    paths:
-    branches:
+      - api/**
-      - main
+  push:
-    paths:
+    branches:
-      - api/**
+      - main
-jobs:
+    paths:
-  determine-workflow:
+      - api/**
-    runs-on: 'ubuntu-latest'
+jobs:
-    outputs:
+  determine-workflow:
-      workflow_type: ${{ steps.workflow.outputs.workflow_type }}
+    runs-on: 'ubuntu-latest'
-      workflow_envs: ${{ steps.workflow.outputs.workflow_envs }}
+    outputs:
-      release_type: ${{ steps.workflow.outputs.release_type }}
+      workflow_type: ${{ steps.workflow.outputs.workflow_type }}
-      current_version: ${{ steps.version.outputs.current_version }}
+      workflow_envs: ${{ steps.workflow.outputs.workflow_envs }}
-    steps:
+      release_type: ${{ steps.workflow.outputs.release_type }}
-      - name: Checkout Code
+      current_version: ${{ steps.version.outputs.current_version }}
-        uses: actions/checkout@v4
+    steps:
-      - name: Determine Workflow
+      - name: Checkout Code
-        id: workflow
+        uses: actions/checkout@v4
-        shell: bash
+      - name: Determine Workflow
-        run: |
+        id: workflow
-          event=${{ github.event_name }}
+        shell: bash
-          workflow_type='dev';
+        run: |
-          workflow_envs='["dev"]'
+          event=${{ github.event_name }}
-          if [[ $event == 'workflow_dispatch' && '${{ github.ref_name }}' == 'main' ]];
+          workflow_type='dev';
-          then
+          workflow_envs='["dev"]'
-            echo "in if statement"
+          if [[ $event == 'workflow_dispatch' && '${{ github.ref_name }}' == 'main' ]];
-            workflow_type='release';
+          then
-            workflow_envs='["prod"]'
+            echo "in if statement"
-          fi
+            workflow_type='release';
-
+            workflow_envs='["prod"]'
-          echo "workflow_type=$workflow_type" >> $GITHUB_OUTPUT
+          fi
-          echo "workflow_envs=$workflow_envs" >> $GITHUB_OUTPUT
+
-
+          echo "workflow_type=$workflow_type" >> $GITHUB_OUTPUT
-          echo "Running $workflow_type pipeline in environments: $workflow_envs" >> $GITHUB_STEP_SUMMARY
+          echo "workflow_envs=$workflow_envs" >> $GITHUB_OUTPUT
-      - name: Extract Version
+
-        id: version
+          echo "Running $workflow_type pipeline in environments: $workflow_envs" >> $GITHUB_STEP_SUMMARY
-        shell: bash
+      - name: Extract Version
-        run: |
+        id: version
-          version=$(jq -r '.version' api/package.json)
+        shell: bash
-          echo "current_version=$version" >> "$GITHUB_OUTPUT"
+        run: |
-  nonprod-deploy:
+          version=$(jq -r '.version' api/package.json)
-    needs: determine-workflow
+          echo "current_version=$version" >> "$GITHUB_OUTPUT"
-    if: needs.determine-workflow.outputs.workflow_type != 'release'
+  nonprod-deploy:
-    strategy:
+    needs: determine-workflow
-      max-parallel: 1
+    if: needs.determine-workflow.outputs.workflow_type != 'release'
-      matrix:
+    strategy:
-        env: ${{ fromJson(needs.determine-workflow.outputs.workflow_envs) }}
+      max-parallel: 1
-    uses: ./.github/workflows/api-deploy-nonprod.yml
+      matrix:
-    with:
+        env: ${{ fromJson(needs.determine-workflow.outputs.workflow_envs) }}
-      environments: ${{ matrix.env }}
+    uses: ./.github/workflows/api-deploy-nonprod.yml
-      workflow_type: ${{ needs.determine-workflow.outputs.workflow_type }}
+    with:
-      branch: ${{ github.head_ref || github.ref_name }}
+      environments: ${{ matrix.env }}
-      current_version: ${{ needs.determine-workflow.outputs.current_version }}
+      workflow_type: ${{ needs.determine-workflow.outputs.workflow_type }}
-    secrets:
+      branch: ${{ github.head_ref || github.ref_name }}
-      DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
+      current_version: ${{ needs.determine-workflow.outputs.current_version }}
-      DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
+    secrets:
-      TEST: ${{ secrets.TEST }}
+      DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
-      COOLIFY_WEBHOOK_API: ${{ secrets.COOLIFY_WEBHOOK_API }}
+      DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
-      COOLIFY_TOKEN: ${{ secrets.COOLIFY_TOKEN }}
+      TEST: ${{ secrets.TEST }}
-    permissions:
+      TEAMCITY_API_ID: ${{ secrets.TEAMCITY_API_ID }}
-      contents: read
+      TEAMCITY_URL: ${{ secrets.TEAMCITY_URL }}
-      packages: write
+      TEAMCITY_USERNAME: ${{ secrets.TEAMCITY_USERNAME }}
-  prod-deploy:
+      TEAMCITY_PASSWORD: ${{ secrets.TEAMCITY_PASSWORD }}
-    needs: determine-workflow
+    permissions:
-    if: needs.determine-workflow.outputs.workflow_type == 'release'
+      contents: read
-    strategy:
+      packages: write
-      max-parallel: 1
+  prod-deploy:
-      matrix:
+    needs: determine-workflow
-        env: ${{ fromJson(needs.determine-workflow.outputs.workflow_envs) }}
+    if: needs.determine-workflow.outputs.workflow_type == 'release'
-    uses: ./.github/workflows/api-deploy-prod.yml
+    strategy:
-    with:
+      max-parallel: 1
-      environments: ${{ matrix.env }}
+      matrix:
-      workflow_type: ${{ needs.determine-workflow.outputs.workflow_type }}
+        env: ${{ fromJson(needs.determine-workflow.outputs.workflow_envs) }}
-      branch: ${{ github.head_ref || github.ref_name }}
+    uses: ./.github/workflows/api-deploy-prod.yml
-      current_version: ${{ needs.determine-workflow.outputs.current_version }}
+    with:
-    secrets:
+      environments: ${{ matrix.env }}
-      DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
+      workflow_type: ${{ needs.determine-workflow.outputs.workflow_type }}
-      DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
+      branch: ${{ github.head_ref || github.ref_name }}
-      TEST: ${{ secrets.TEST }}
+      current_version: ${{ needs.determine-workflow.outputs.current_version }}
-      COOLIFY_WEBHOOK_API: ${{ secrets.COOLIFY_WEBHOOK_API }}
+    secrets:
-      COOLIFY_TOKEN: ${{ secrets.COOLIFY_TOKEN }}
+      DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
-    permissions:
+      DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
-      contents: read
+      TEST: ${{ secrets.TEST }}
-      packages: write
+      TEAMCITY_API_ID: ${{ secrets.TEAMCITY_API_ID }}
+      TEAMCITY_URL: ${{ secrets.TEAMCITY_URL }}
+      TEAMCITY_USERNAME: ${{ secrets.TEAMCITY_USERNAME }}
+      TEAMCITY_PASSWORD: ${{ secrets.TEAMCITY_PASSWORD }}
+    permissions:
+      contents: read
+      packages: write

.github/workflows/api-deploy-nonprod.yml

@@ -22,8 +22,10 @@ on:
       DOCKERHUB_USER: {}
       DOCKERHUB_TOKEN: {}
       TEST: {}
-      COOLIFY_WEBHOOK_API: {}
+      TEAMCITY_API_ID: {}
-      COOLIFY_TOKEN: {}
+      TEAMCITY_URL: {}
+      TEAMCITY_USERNAME: {}
+      TEAMCITY_PASSWORD: {}
 jobs:
   check-inputs:
     runs-on: 'ubuntu-latest'
@@ -31,17 +33,29 @@ jobs:
     steps:
       - name: Check secrets present
         run: |
-          if [[ -z "${{ secrets.COOLIFY_WEBHOOK_API }}" ]]; then
+          if [[ -z "${{ secrets.TEAMCITY_API_ID }}" ]]; then
-            echo "COOLIFY_WEBHOOK_API secret is empty or missing"
+            echo "TEAMCITY_API_ID secret is empty or missing"
             exit 1
           else
-            echo "COOLIFY_WEBHOOK_API secret is set"
+            echo "TEAMCITY_API_ID secret is set"
           fi
-          if [[ -z "${{ secrets.COOLIFY_TOKEN }}" ]]; then
+          if [[ -z "${{ secrets.TEAMCITY_URL }}" ]]; then
-            echo "COOLIFY_TOKEN secret is empty or missing"
+            echo "TEAMCITY_URL secret is empty or missing"
             exit 1
           else
-            echo "COOLIFY_TOKEN secret is set"
+            echo "TEAMCITY_URL secret is set"
+          fi
+          if [[ -z "${{ secrets.TEAMCITY_USERNAME }}" ]]; then
+            echo "TEAMCITY_USERNAME secret is empty or missing"
+            exit 1
+          else
+            echo "TEAMCITY_USERNAME secret is set"
+          fi
+          if [[ -z "${{ secrets.TEAMCITY_PASSWORD }}" ]]; then
+            echo "TEAMCITY_PASSWORD secret is empty or missing"
+            exit 1
+          else
+            echo "TEAMCITY_PASSWORD secret is set"
           fi
           if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
             echo "DOCKERHUB_USER secret is empty or missing"
@@ -88,7 +102,12 @@ jobs:
       contents: read
       packages: write
     steps:
-      - name: Deploy to Coolify
+      - name: Deploy to Team City
         run: |
-          curl '${{ secrets.COOLIFY_WEBHOOK_API }}' --header 'Authorization: Bearer ${{ secrets.COOLIFY_TOKEN }}'
+          curl -u ${{ secrets.TEAMCITY_USERNAME }}:${{ secrets.TEAMCITY_PASSWORD }} \
-    
+               -X POST \
+               -H "Content-Type: application/json" \
+               -d '{"buildType": {"id": "${{ secrets.TEAMCITY_API_ID }}"}}' \
+               "${{ secrets.TEAMCITY_URL }}/httpAuth/app/rest/buildQueue" > /dev/null
+
+

.github/workflows/api-deploy-prod.yml

@@ -1,94 +1,111 @@
-name: API Deployment Production
+name: API Deployment Production
-on:
+on:
-  workflow_call:
+  workflow_call:
-    inputs:
+    inputs:
-      environments:
+      environments:
-        type: string
+        type: string
-        description: An optional list of environments to deploy to.
+        description: An optional list of environments to deploy to.
-        default: 'prod'
+        default: 'prod'
-      workflow_type:
+      workflow_type:
-        type: string
+        type: string
-        description: An optional string for workflow types.
+        description: An optional string for workflow types.
-        default: 'prod'
+        default: 'prod'
-      branch:
+      branch:
-        type: string
+        type: string
-        description: An optional string to define which branch to checkout.
+        description: An optional string to define which branch to checkout.
-        default: 'main'
+        default: 'main'
-      current_version:
+      current_version:
-        type: string
+        type: string
-        description: Current Version of the package.json.
+        description: Current Version of the package.json.
-        default: '0.0.0'
+        default: '0.0.0'
-    secrets:
+    secrets:
-      DOCKERHUB_USER: {}
+      DOCKERHUB_USER: {}
-      DOCKERHUB_TOKEN: {}
+      DOCKERHUB_TOKEN: {}
-      TEST: {}
+      TEST: {}
-      COOLIFY_WEBHOOK_API: {}
+      TEAMCITY_API_ID: {}
-      COOLIFY_TOKEN: {}
+      TEAMCITY_URL: {}
-jobs:
+      TEAMCITY_USERNAME: {}
-  check-inputs:
+      TEAMCITY_PASSWORD: {}
-    runs-on: 'ubuntu-latest'
+jobs:
-    environment: ${{ inputs.environments }}
+  check-inputs:
-    steps:
+    runs-on: 'ubuntu-latest'
-      - name: Check secrets present
+    environment: ${{ inputs.environments }}
-        run: |
+    steps:
-          if [[ -z "${{ secrets.COOLIFY_WEBHOOK_API }}" ]]; then
+      - name: Check secrets present
-            echo "COOLIFY_WEBHOOK_API secret is empty or missing"
+        run: |
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_API_ID }}" ]]; then
-          else
+            echo "TEAMCITY_API_ID secret is empty or missing"
-            echo "COOLIFY_WEBHOOK_API secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.COOLIFY_TOKEN }}" ]]; then
+            echo "TEAMCITY_API_ID secret is set"
-            echo "COOLIFY_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_URL }}" ]]; then
-          else
+            echo "TEAMCITY_URL secret is empty or missing"
-            echo "COOLIFY_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
+            echo "TEAMCITY_URL secret is set"
-            echo "DOCKERHUB_USER secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_USERNAME }}" ]]; then
-          else
+            echo "TEAMCITY_USERNAME secret is empty or missing"
-            echo "DOCKERHUB_USER secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
+            echo "TEAMCITY_USERNAME secret is set"
-            echo "DOCKERHUB_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_PASSWORD }}" ]]; then
-          else
+            echo "TEAMCITY_PASSWORD secret is empty or missing"
-            echo "DOCKERHUB_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          echo "Current Version: ${{inputs.current_version}}"
+            echo "TEAMCITY_PASSWORD secret is set"
-  build:
+          fi
-    needs: check-inputs
+          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
-    if: needs.check-inputs.result == 'success' && inputs.workflow_type == 'release'
+            echo "DOCKERHUB_USER secret is empty or missing"
-    environment: ${{ inputs.environments }}
+            exit 1
-    runs-on: 'ubuntu-latest'
+          else
-    permissions:
+            echo "DOCKERHUB_USER secret is set"
-      contents: read
+          fi
-      packages: write
+          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
-    steps:
+            echo "DOCKERHUB_TOKEN secret is empty or missing"
-      - name: Branch Checkout
+            exit 1
-        uses: actions/checkout@v4
+          else
-        with:
+            echo "DOCKERHUB_TOKEN secret is set"
-          ref: ${{ inputs.branch }}
+          fi
-      - name: Login to Docker
+          echo "Current Version: ${{inputs.current_version}}"
-        uses: docker/login-action@v3
+  build:
-        with:
+    needs: check-inputs
-          registry: docker.io
+    if: needs.check-inputs.result == 'success' && inputs.workflow_type == 'release'
-          username: ${{ secrets.DOCKERHUB_USER }}
+    environment: ${{ inputs.environments }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
+    runs-on: 'ubuntu-latest'
-      - name: Docker Build Backend
+    permissions:
-        run: docker build -f api/Dockerfile -t john4064/shiftsync:prod_api ./api --build-arg ENVIRONMENT=prod
+      contents: read
-      - name: Docker Push Backend
+      packages: write
-        run: docker push john4064/shiftsync:prod_api
+    steps:
-  deploy:
+      - name: Branch Checkout
-    needs: build
+        uses: actions/checkout@v4
-    if: needs.build.result == 'success' && inputs.workflow_type == 'release'
+        with:
-    environment: ${{ inputs.environments }}
+          ref: ${{ inputs.branch }}
-    runs-on: 'ubuntu-latest'
+      - name: Login to Docker
-    permissions:
+        uses: docker/login-action@v3
-      contents: read
+        with:
-      packages: write
+          registry: docker.io
-    steps:
+          username: ${{ secrets.DOCKERHUB_USER }}
-      - name: Deploy to Coolify
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
-        run: |
+      - name: Docker Build Backend
-          curl '${{ secrets.COOLIFY_WEBHOOK_API }}' --header 'Authorization: Bearer ${{ secrets.COOLIFY_TOKEN }}'
+        run: docker build -f api/Dockerfile -t john4064/shiftsync:prod_api ./api --build-arg ENVIRONMENT=prod
-    
+      - name: Docker Push Backend
+        run: docker push john4064/shiftsync:prod_api
+  deploy:
+    needs: build
+    if: needs.build.result == 'success' && inputs.workflow_type == 'release'
+    environment: ${{ inputs.environments }}
+    runs-on: 'ubuntu-latest'
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Deploy to Team City
+        run: |
+          curl -u ${{ secrets.TEAMCITY_USERNAME }}:${{ secrets.TEAMCITY_PASSWORD }} \
+               -X POST \
+               -H "Content-Type: application/json" \
+               -d '{"buildType": {"id": "${{ secrets.TEAMCITY_API_ID }}"}}' \
+               "${{ secrets.TEAMCITY_URL }}/httpAuth/app/rest/buildQueue" > /dev/null

.github/workflows/pr-validation.yml

@@ -1,19 +1,19 @@
-name: PR Validation
+name: PR Validation
-on:
+on:
-  pull_request:
+  pull_request:
-    types: [opened]
+    types: [opened]
-
+
-permissions:
+permissions:
-  contents: read
+  contents: read
-
+
-jobs:
+jobs:
-  pr-validation:
+  pr-validation:
-    permissions:
+    permissions:
-      contents: read
+      contents: read
-      pull-requests: write
+      pull-requests: write
-    runs-on: ['self-hosted', 'pi']
+    runs-on: 'ubuntu-latest'
-    steps:
+    steps:
-      - uses: TimonVS/pr-labeler-action@v5
+      - uses: TimonVS/pr-labeler-action@v5
-        with:
+        with:
-          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
-          configuration-path: .github/configs/pr-labeler-configuration.yml
+          configuration-path: .github/configs/pr-labeler-configuration.yml

.github/workflows/web-container.yml

@@ -9,6 +9,8 @@ on:
       - reopened
       - synchronize
       - ready_for_review
+    paths:
+      - web/**
   push:
     branches:
       - main
@@ -16,7 +18,7 @@ on:
       - web/**
 jobs:
   determine-workflow:
-    runs-on: ['self-hosted','pi']
+    runs-on: 'ubuntu-latest'
     outputs:
       workflow_type: ${{ steps.workflow.outputs.workflow_type }}
       workflow_envs: ${{ steps.workflow.outputs.workflow_envs }}
@@ -66,8 +68,10 @@ jobs:
       DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
       DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
       TEST: ${{ secrets.TEST }}
-      COOLIFY_WEBHOOK_WEB: ${{ secrets.COOLIFY_WEBHOOK_WEB }}
+      TEAMCITY_WEB_ID: ${{ secrets.TEAMCITY_WEB_ID }}
-      COOLIFY_TOKEN: ${{ secrets.COOLIFY_TOKEN }}
+      TEAMCITY_URL: ${{ secrets.TEAMCITY_URL }}
+      TEAMCITY_USERNAME: ${{ secrets.TEAMCITY_USERNAME }}
+      TEAMCITY_PASSWORD: ${{ secrets.TEAMCITY_PASSWORD }}
     permissions:
       contents: read
       packages: write
@@ -88,8 +92,10 @@ jobs:
       DOCKERHUB_USER: ${{ secrets.DOCKERHUB_USER }}
       DOCKERHUB_TOKEN: ${{ secrets.DOCKERHUB_TOKEN }}
       TEST: ${{ secrets.TEST }}
-      COOLIFY_WEBHOOK_WEB: ${{ secrets.COOLIFY_WEBHOOK_WEB }}
+      TEAMCITY_WEB_ID: ${{ secrets.TEAMCITY_WEB_ID }}
-      COOLIFY_TOKEN: ${{ secrets.COOLIFY_TOKEN }}
+      TEAMCITY_URL: ${{ secrets.TEAMCITY_URL }}
+      TEAMCITY_USERNAME: ${{ secrets.TEAMCITY_USERNAME }}
+      TEAMCITY_PASSWORD: ${{ secrets.TEAMCITY_PASSWORD }}
     permissions:
       contents: read
       packages: write

.github/workflows/web-deploy-nonprod.yml

@@ -1,94 +1,111 @@
-name: Web Deployment Non-Production
+name: Web Deployment Non-Production
-on:
+on:
-  workflow_call:
+  workflow_call:
-    inputs:
+    inputs:
-      environments:
+      environments:
-        type: string
+        type: string
-        description: An optional list of environments to deploy to.
+        description: An optional list of environments to deploy to.
-        default: 'dev'
+        default: 'dev'
-      workflow_type:
+      workflow_type:
-        type: string
+        type: string
-        description: An optional string for workflow types.
+        description: An optional string for workflow types.
-        default: 'dev'
+        default: 'dev'
-      branch:
+      branch:
-        type: string
+        type: string
-        description: An optional string to define which branch to checkout.
+        description: An optional string to define which branch to checkout.
-        default: 'main'
+        default: 'main'
-      current_version:
+      current_version:
-        type: string
+        type: string
-        description: Current Version of the package.json.
+        description: Current Version of the package.json.
-        default: '0.0.0'
+        default: '0.0.0'
-    secrets:
+    secrets:
-      DOCKERHUB_USER: {}
+      DOCKERHUB_USER: {}
-      DOCKERHUB_TOKEN: {}
+      DOCKERHUB_TOKEN: {}
-      TEST: {}
+      TEST: {}
-      COOLIFY_WEBHOOK_WEB: {}
+      TEAMCITY_WEB_ID: {}
-      COOLIFY_TOKEN: {}
+      TEAMCITY_URL: {}
-jobs:
+      TEAMCITY_USERNAME: {}
-  check-inputs:
+      TEAMCITY_PASSWORD: {}
-    runs-on: 'ubuntu-latest'
+jobs:
-    environment: ${{ inputs.environments }}
+  check-inputs:
-    steps:
+    runs-on: 'ubuntu-latest'
-      - name: Check secrets present
+    environment: ${{ inputs.environments }}
-        run: |
+    steps:
-          if [[ -z "${{ secrets.COOLIFY_WEBHOOK_WEB }}" ]]; then
+      - name: Check secrets present
-            echo "COOLIFY_WEBHOOK_WEB secret is empty or missing"
+        run: |
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_WEB_ID }}" ]]; then
-          else
+            echo "TEAMCITY_WEB_ID secret is empty or missing"
-            echo "COOLIFY_WEBHOOK_WEB secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.COOLIFY_TOKEN }}" ]]; then
+            echo "TEAMCITY_WEB_ID secret is set"
-            echo "COOLIFY_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_URL }}" ]]; then
-          else
+            echo "TEAMCITY_URL secret is empty or missing"
-            echo "COOLIFY_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
+            echo "TEAMCITY_URL secret is set"
-            echo "DOCKERHUB_USER secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_USERNAME }}" ]]; then
-          else
+            echo "TEAMCITY_USERNAME secret is empty or missing"
-            echo "DOCKERHUB_USER secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
+            echo "TEAMCITY_USERNAME secret is set"
-            echo "DOCKERHUB_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_PASSWORD }}" ]]; then
-          else
+            echo "TEAMCITY_PASSWORD secret is empty or missing"
-            echo "DOCKERHUB_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          echo "Current Version: ${{inputs.current_version}}"
+            echo "TEAMCITY_PASSWORD secret is set"
-  build:
+          fi
-    needs: check-inputs
+          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
-    if: needs.check-inputs.result == 'success' && inputs.workflow_type != 'release'
+            echo "DOCKERHUB_USER secret is empty or missing"
-    environment: ${{ inputs.environments }}
+            exit 1
-    runs-on: 'ubuntu-latest'
+          else
-    permissions:
+            echo "DOCKERHUB_USER secret is set"
-      contents: read
+          fi
-      packages: write
+          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
-    steps:
+            echo "DOCKERHUB_TOKEN secret is empty or missing"
-      - name: Branch Checkout
+            exit 1
-        uses: actions/checkout@v4
+          else
-        with:
+            echo "DOCKERHUB_TOKEN secret is set"
-          ref: ${{ inputs.branch }}
+          fi
-      - name: Login to Docker
+          echo "Current Version: ${{inputs.current_version}}"
-        uses: docker/login-action@v3
+  build:
-        with:
+    needs: check-inputs
-          registry: docker.io
+    if: needs.check-inputs.result == 'success' && inputs.workflow_type != 'release'
-          username: ${{ secrets.DOCKERHUB_USER }}
+    environment: ${{ inputs.environments }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
+    runs-on: 'ubuntu-latest'
-      - name: Docker Build Backend
+    permissions:
-        run: docker build -f web/Dockerfile -t john4064/shiftsync:latest_web ./web --build-arg ENVIRONMENT=dev
+      contents: read
-      - name: Docker Push Backend
+      packages: write
-        run: docker push john4064/shiftsync:latest_web
+    steps:
-  deploy:
+      - name: Branch Checkout
-    needs: build
+        uses: actions/checkout@v4
-    if: needs.build.result == 'success' && inputs.workflow_type != 'release'
+        with:
-    environment: ${{ inputs.environments }}
+          ref: ${{ inputs.branch }}
-    runs-on: 'ubuntu-latest'
+      - name: Login to Docker
-    permissions:
+        uses: docker/login-action@v3
-      contents: read
+        with:
-      packages: write
+          registry: docker.io
-    steps:
+          username: ${{ secrets.DOCKERHUB_USER }}
-      - name: Deploy to Coolify
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
-        run: |
+      - name: Docker Build Backend
-          curl '${{ secrets.COOLIFY_WEBHOOK_WEB }}' --header 'Authorization: Bearer ${{ secrets.COOLIFY_TOKEN }}'
+        run: docker build -f web/Dockerfile -t john4064/shiftsync:latest_web ./web --build-arg ENVIRONMENT=dev
-    
+      - name: Docker Push Backend
+        run: docker push john4064/shiftsync:latest_web
+  deploy:
+    needs: build
+    if: needs.build.result == 'success' && inputs.workflow_type != 'release'
+    environment: ${{ inputs.environments }}
+    runs-on: 'ubuntu-latest'
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Deploy to Team City
+        run: |
+          curl -u ${{ secrets.TEAMCITY_USERNAME }}:${{ secrets.TEAMCITY_PASSWORD }} \
+               -X POST \
+               -H "Content-Type: application/json" \
+               -d '{"buildType": {"id": "${{ secrets.TEAMCITY_WEB_ID }}"}}' \
+               "${{ secrets.TEAMCITY_URL }}/httpAuth/app/rest/buildQueue" > /dev/null

.github/workflows/web-deploy-prod.yml

@@ -1,94 +1,111 @@
-name: Web Deployment Production
+name: Web Deployment Production
-on:
+on:
-  workflow_call:
+  workflow_call:
-    inputs:
+    inputs:
-      environments:
+      environments:
-        type: string
+        type: string
-        description: An optional list of environments to deploy to.
+        description: An optional list of environments to deploy to.
-        default: 'prod'
+        default: 'prod'
-      workflow_type:
+      workflow_type:
-        type: string
+        type: string
-        description: An optional string for workflow types.
+        description: An optional string for workflow types.
-        default: 'prod'
+        default: 'prod'
-      branch:
+      branch:
-        type: string
+        type: string
-        description: An optional string to define which branch to checkout.
+        description: An optional string to define which branch to checkout.
-        default: 'main'
+        default: 'main'
-      current_version:
+      current_version:
-        type: string
+        type: string
-        description: Current Version of the package.json.
+        description: Current Version of the package.json.
-        default: '0.0.0'
+        default: '0.0.0'
-    secrets:
+    secrets:
-      DOCKERHUB_USER: {}
+      DOCKERHUB_USER: {}
-      DOCKERHUB_TOKEN: {}
+      DOCKERHUB_TOKEN: {}
-      TEST: {}
+      TEST: {}
-      COOLIFY_WEBHOOK_WEB: {}
+      TEAMCITY_WEB_ID: {}
-      COOLIFY_TOKEN: {}
+      TEAMCITY_URL: {}
-jobs:
+      TEAMCITY_USERNAME: {}
-  check-inputs:
+      TEAMCITY_PASSWORD: {}
-    runs-on: 'ubuntu-latest'
+jobs:
-    environment: ${{ inputs.environments }}
+  check-inputs:
-    steps:
+    runs-on: 'ubuntu-latest'
-      - name: Check secrets present
+    environment: ${{ inputs.environments }}
-        run: |
+    steps:
-          if [[ -z "${{ secrets.COOLIFY_WEBHOOK_WEB }}" ]]; then
+      - name: Check secrets present
-            echo "COOLIFY_WEBHOOK_WEB secret is empty or missing"
+        run: |
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_WEB_ID }}" ]]; then
-          else
+            echo "TEAMCITY_WEB_ID secret is empty or missing"
-            echo "COOLIFY_WEBHOOK_WEB secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.COOLIFY_TOKEN }}" ]]; then
+            echo "TEAMCITY_WEB_ID secret is set"
-            echo "COOLIFY_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_URL }}" ]]; then
-          else
+            echo "TEAMCITY_URL secret is empty or missing"
-            echo "COOLIFY_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
+            echo "TEAMCITY_URL secret is set"
-            echo "DOCKERHUB_USER secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_USERNAME }}" ]]; then
-          else
+            echo "TEAMCITY_USERNAME secret is empty or missing"
-            echo "DOCKERHUB_USER secret is set"
+            exit 1
-          fi
+          else
-          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
+            echo "TEAMCITY_USERNAME secret is set"
-            echo "DOCKERHUB_TOKEN secret is empty or missing"
+          fi
-            exit 1
+          if [[ -z "${{ secrets.TEAMCITY_PASSWORD }}" ]]; then
-          else
+            echo "TEAMCITY_PASSWORD secret is empty or missing"
-            echo "DOCKERHUB_TOKEN secret is set"
+            exit 1
-          fi
+          else
-          echo "Current Version: ${{inputs.current_version}}"
+            echo "TEAMCITY_PASSWORD secret is set"
-  build:
+          fi
-    needs: check-inputs
+          if [[ -z "${{ secrets.DOCKERHUB_USER }}" ]]; then
-    if: needs.check-inputs.result == 'success' && inputs.workflow_type == 'release'
+            echo "DOCKERHUB_USER secret is empty or missing"
-    environment: ${{ inputs.environments }}
+            exit 1
-    runs-on: 'ubuntu-latest'
+          else
-    permissions:
+            echo "DOCKERHUB_USER secret is set"
-      contents: read
+          fi
-      packages: write
+          if [[ -z "${{ secrets.DOCKERHUB_TOKEN }}" ]]; then
-    steps:
+            echo "DOCKERHUB_TOKEN secret is empty or missing"
-      - name: Branch Checkout
+            exit 1
-        uses: actions/checkout@v4
+          else
-        with:
+            echo "DOCKERHUB_TOKEN secret is set"
-          ref: ${{ inputs.branch }}
+          fi
-      - name: Login to Docker
+          echo "Current Version: ${{inputs.current_version}}"
-        uses: docker/login-action@v3
+  build:
-        with:
+    needs: check-inputs
-          registry: docker.io
+    if: needs.check-inputs.result == 'success' && inputs.workflow_type == 'release'
-          username: ${{ secrets.DOCKERHUB_USER }}
+    environment: ${{ inputs.environments }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
+    runs-on: 'ubuntu-latest'
-      - name: Docker Build Backend
+    permissions:
-        run: docker build -f web/Dockerfile -t john4064/shiftsync:prod_web ./web --build-arg ENVIRONMENT=prod
+      contents: read
-      - name: Docker Push Backend
+      packages: write
-        run: docker push john4064/shiftsync:prod_web
+    steps:
-  deploy:
+      - name: Branch Checkout
-    needs: build
+        uses: actions/checkout@v4
-    if: needs.build.result == 'success' && inputs.workflow_type == 'release'
+        with:
-    environment: ${{ inputs.environments }}
+          ref: ${{ inputs.branch }}
-    runs-on: 'ubuntu-latest'
+      - name: Login to Docker
-    permissions:
+        uses: docker/login-action@v3
-      contents: read
+        with:
-      packages: write
+          registry: docker.io
-    steps:
+          username: ${{ secrets.DOCKERHUB_USER }}
-      - name: Deploy to Coolify
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
-        run: |
+      - name: Docker Build Backend
-          curl '${{ secrets.COOLIFY_WEBHOOK_WEB }}' --header 'Authorization: Bearer ${{ secrets.COOLIFY_TOKEN }}'
+        run: docker build -f web/Dockerfile -t john4064/shiftsync:prod_web ./web --build-arg ENVIRONMENT=prod
-    
+      - name: Docker Push Backend
+        run: docker push john4064/shiftsync:prod_web
+  deploy:
+    needs: build
+    if: needs.build.result == 'success' && inputs.workflow_type == 'release'
+    environment: ${{ inputs.environments }}
+    runs-on: 'ubuntu-latest'
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Deploy to Team City
+        run: |
+          curl -u ${{ secrets.TEAMCITY_USERNAME }}:${{ secrets.TEAMCITY_PASSWORD }} \
+               -X POST \
+               -H "Content-Type: application/json" \
+               -d '{"buildType": {"id": "${{ secrets.TEAMCITY_WEB_ID }}"}}' \
+               "${{ secrets.TEAMCITY_URL }}/httpAuth/app/rest/buildQueue" > /dev/null

api/Dockerfile

@@ -1,14 +1,14 @@
-FROM node:20-alpine
+FROM node:20-alpine
-
+
-WORKDIR /app
+WORKDIR /app
-
+
-COPY ./package*.json ./
+COPY ./package*.json ./
-
+
-RUN npm cache clean --force && npm install --no-audit --no-fund
+RUN npm ci
-
+
-COPY . ./
+COPY . ./
-
+
-EXPOSE 5172
+EXPOSE 5172
-EXPOSE 5170
+EXPOSE 5170
-
+
-CMD npm run dev
+CMD npm run dev

api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "shiftsync-website-api",
-  "version": "1.0.1",
+  "version": "1.0.11",
   "private": true,
   "type": "module",
   "scripts": {

api/router/rest/index.js

@@ -1,6 +0,0 @@
-import express from 'express';
-import { userDataRouter } from './userData/index.js';
-
-export const restRouter = express.Router();
-
-restRouter.use('/userData', userDataRouter);

api/router/rest/userData/index.js

@@ -1,17 +0,0 @@
-import express from 'express';
-import { databaseServices } from '../../../services/index.js';
-
-export const userDataRouter = express.Router();
-
-userDataRouter.get('/', async (req, res) => {
-  let data;
-  try {
-    data = await databaseServices.getUsers(req.query);
-    res.status(200);
-  } catch (err) {
-    data = { Error: err?.message };
-    res.status(500);
-  } finally {
-    res.send(data);
-  }
-})

api/router/routes.js

@@ -1,6 +0,0 @@
-import express from 'express';
-import { restRouter } from './rest/index.js';
-
-export const routes = express.Router();
-
-routes.use('/rest', restRouter);

api/server.js

@@ -1,6 +1,7 @@
 import express from 'express';
 import cors from 'cors';
 import dotenv from 'dotenv';
+import fs from 'fs/promises';
 import { medicationRouter } from './services/medications/index.js';
 import { shiftsRouter } from './services/shifts/index.js';
 import { shiftRunQuery } from './services/shiftConnection.js';
@@ -45,9 +46,12 @@ app.get('/api/db-health', async (req, res) => {
     res.status(500).json({ connected: false, error: err.message });
   }
 });
+
 app.get('/api/version', async (req, res) => {
   try {
-    res.json('1.0.1');
+    const packageData = await fs.readFile('./package.json', 'utf8');
+    const pkg = JSON.parse(packageData);
+    res.json(pkg.version);
   } catch (err) {
     console.error(err);
     res.status(500).json({ connected: false, error: err.message });

api/services/connection.js

@@ -1,27 +0,0 @@
-import { Pool } from 'pg';
-import 'dotenv/config';
-
-const poolCreds = {
-  host: process.env.POSTGRES_HOST,
-  database: process.env.POSTGRES_DB,
-  port: process.env.POSTGRES_PORT,
-  user: process.env.POSTGRES_USER,
-  password: process.env.POSTGRES_PASSWORD,
-  ssl:
-    process.env.APP_ENV === 'local'
-      ? null
-      : { require: true, rejectUnauthorized }
-};
-
-const pool = new Pool(poolCreds);
-
-export const runQuery = async (query, params = []) => {
-  const client = await pool.connect();
-
-  try {
-    const pgQueryResponse = await client.query(query, params);
-    return pgQueryResponse?.rows || [];
-  } finally {
-    client.release();
-  }
-}

api/services/department/index.js

@@ -1,14 +0,0 @@
-import express from 'express';
-const router = express.Router();
-
-// GET /api/departments
-router.get('/', (req, res) => {
-    res.json([{ id: 1, name: 'Fire Department' }]);
-});
-
-// POST /api/departments
-router.post('/', (req, res) => {
-    res.status(201).json({ message: 'Department created' });
-});
-
-export default router;

api/services/operations/userData.js

@@ -1,15 +0,0 @@
-import { runQuery } from '../connection.js';
-
-const getUsers = async (args) => {
-  try {
-    const dataResp = await runQuery('SELECT * FROM users');
-    return dataResp;
-  } catch (err) {
-    console.log('GET USERS ERROR: ', err);
-    throw err;
-  }
-};
-
-export const userDataOperations = {
-  getUsers
-}

api/services/user/index.js

@@ -1,16 +0,0 @@
-import express from 'express';
-const router = express.Router();
-
-// GET /api/users
-router.get('/', (req, res) => {
-    res.json([{ id: 1, name: 'John Doe' }]);
-});
-
-// POST /api/users
-router.post('/', (req, res) => {
-    res.status(201).json({ message: 'User created' });
-});
-
-// Add more routes like PUT, DELETE here later
-
-export default router;

web/Dockerfile

@@ -1,17 +1,17 @@
-FROM node:20-alpine
+FROM node:20-alpine
-
+
-WORKDIR /app
+WORKDIR /app
-
+
-COPY ./package*.json ./
+COPY ./package*.json ./
-
+
-RUN npm cache clean --force && npm install --no-audit --no-fund
+RUN npm ci
-
+
-COPY . ./
+COPY . ./
-
+
-EXPOSE 5173
+EXPOSE 5173
-EXPOSE 5171
+EXPOSE 5171
-
+
-ARG ENVIRONMENT
+ARG ENVIRONMENT
-ENV ENVIRONMENT ${ENVIRONMENT}
+ENV ENVIRONMENT ${ENVIRONMENT}
-
+
-CMD npm run ${ENVIRONMENT}
+CMD npm run ${ENVIRONMENT}

web/components/common/TransferBox/TransferBox.jsx

@@ -194,8 +194,7 @@ export const TransferBox = ({ fields, leftGroup, rightGroup, onSave, user={} })
         </CenterButton>
         <CenterButton
           onClick={() => {
-            onSave(rightItems?.map((item) => { return item?.id }));
+            return onSave(rightItems?.map((item) => { return item?.id }))
-            setItemSelected({});
           }}
           color='#00B33C'
           buttonEnabled={hasChanges}

web/components/stores/useLocalStore.js

@@ -5,6 +5,4 @@ export const useLocalStore = create((set) => ({
   setUser: (user) => set({ user }),
   department: null,
   setDepartment: (department) => set({ department }),
-  access: null,
-  setAccess: (access) => set({ access }),
 }));

web/package-lock.json

@@ -1,18 +1,18 @@
 {
   "name": "shiftsync-website-web",
-  "version": "1.0.5",
+  "version": "1.0.8",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "shiftsync-website-web",
-      "version": "1.0.5",
+      "version": "1.0.8",
       "dependencies": {
         "@emotion/react": "^11.14.0",
         "@emotion/styled": "^11.14.0",
         "@mui/icons-material": "^7.1.0",
         "@mui/material": "^7.1.0",
-        "axios": "^1.10.0",
+        "axios": "^1.13.2",
         "react": "^19.1.0",
         "react-dom": "^19.1.0",
         "react-router-dom": "^7.6.0",
@@ -28,7 +28,7 @@
         "eslint-plugin-react-hooks": "^5.2.0",
         "eslint-plugin-react-refresh": "^0.4.19",
         "globals": "^16.0.0",
-        "vite": "^6.3.5"
+        "vite": "^6.4.1"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -1045,13 +1045,13 @@
       }
     },
     "node_modules/@eslint/plugin-kit": {
-      "version": "0.3.2",
+      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.2.tgz",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.5.tgz",
-      "integrity": "sha512-4SaFZCNfJqvk/kenHpI8xvN42DMaoycy4PzKc5otHxRswww1kAt82OlBuwRVLofCACCTZEcla2Ydxv8scMXaTg==",
+      "integrity": "sha512-Z5kJ+wU3oA7MMIqVR9tyZRtjYPr4OC004Q4Rw7pgOKUOKkJfZ3O24nz3WYfGRpMDNmcOi3TwQOmgm7B7Tpii0w==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/core": "^0.15.0",
+        "@eslint/core": "^0.15.2",
         "levn": "^0.4.1"
       },
       "engines": {
@@ -1059,9 +1059,9 @@
       }
     },
     "node_modules/@eslint/plugin-kit/node_modules/@eslint/core": {
-      "version": "0.15.0",
+      "version": "0.15.2",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.0.tgz",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.2.tgz",
-      "integrity": "sha512-b7ePw78tEWWkpgZCDYkbqDOP8dmM6qe+AOC6iuJqlq1R/0ahMAeH3qynpnqKFGkMltrp44ohV4ubGyvLX28tzw==",
+      "integrity": "sha512-78Md3/Rrxh83gCxoUc0EiciuOHsIITzLy53m3d9UyiW8y9Dj2D29FeETqyKA+BRK76tnTp6RXWb3pCay8Oyomg==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -1905,13 +1905,13 @@
       "license": "MIT"
     },
     "node_modules/axios": {
-      "version": "1.10.0",
+      "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.10.0.tgz",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.2.tgz",
-      "integrity": "sha512-/1xYAC4MP/HEG+3duIhFr4ZQXR4sQXOIe+o6sdqzeykGLx6Upp/1p8MHqhINOvGeP7xyNHe7tsiJByc4SSVUxw==",
+      "integrity": "sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==",
       "license": "MIT",
       "dependencies": {
         "follow-redirects": "^1.15.6",
-        "form-data": "^4.0.0",
+        "form-data": "^4.0.4",
         "proxy-from-env": "^1.1.0"
       }
     },
@@ -2096,12 +2096,16 @@
       "license": "MIT"
     },
     "node_modules/cookie": {
-      "version": "1.0.2",
+      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
-      "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
+      "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
       "license": "MIT",
       "engines": {
         "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
       }
     },
     "node_modules/cosmiconfig": {
@@ -2623,9 +2627,9 @@
       }
     },
     "node_modules/form-data": {
-      "version": "4.0.3",
+      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.3.tgz",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.5.tgz",
-      "integrity": "sha512-qsITQPfmvMOSAdeyZ+12I1c+CKSstAFAwu+97zrnWAbIr5u8wfsExUzCesVLC8NgHuRUqNN4Zy6UPWUTRGslcA==",
+      "integrity": "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==",
       "license": "MIT",
       "dependencies": {
         "asynckit": "^0.4.0",
@@ -2905,9 +2909,9 @@
       "license": "MIT"
     },
     "node_modules/js-yaml": {
-      "version": "4.1.0",
+      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
-      "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3379,9 +3383,9 @@
       }
     },
     "node_modules/react-router": {
-      "version": "7.6.2",
+      "version": "7.12.0",
-      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.6.2.tgz",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.12.0.tgz",
-      "integrity": "sha512-U7Nv3y+bMimgWjhlT5CRdzHPu2/KVmqPwKUCChW8en5P3znxUqwlYFlbmyj8Rgp1SF6zs5X4+77kBVknkg6a0w==",
+      "integrity": "sha512-kTPDYPFzDVGIIGNLS5VJykK0HfHLY5MF3b+xj0/tTyNYL1gF1qs7u67Z9jEhQk2sQ98SUaHxlG31g1JtF7IfVw==",
       "license": "MIT",
       "dependencies": {
         "cookie": "^1.0.1",
@@ -3401,12 +3405,12 @@
       }
     },
     "node_modules/react-router-dom": {
-      "version": "7.6.2",
+      "version": "7.12.0",
-      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.6.2.tgz",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.12.0.tgz",
-      "integrity": "sha512-Q8zb6VlTbdYKK5JJBLQEN06oTUa/RAbG/oQS1auK1I0TbJOXktqm+QENEVJU6QvWynlXPRBXI3fiOQcSEA78rA==",
+      "integrity": "sha512-pfO9fiBcpEfX4Tx+iTYKDtPbrSLLCbwJ5EqP+SPYQu1VYCXdy79GSj0wttR0U4cikVdlImZuEZ/9ZNCgoaxwBA==",
       "license": "MIT",
       "dependencies": {
-        "react-router": "7.6.2"
+        "react-router": "7.12.0"
       },
       "engines": {
         "node": ">=20.0.0"
@@ -3525,9 +3529,9 @@
       }
     },
     "node_modules/set-cookie-parser": {
-      "version": "2.7.1",
+      "version": "2.7.2",
-      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
-      "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
+      "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
       "license": "MIT"
     },
     "node_modules/shebang-command": {
@@ -3688,9 +3692,9 @@
       }
     },
     "node_modules/vite": {
-      "version": "6.3.5",
+      "version": "6.4.1",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
-      "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
+      "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3795,21 +3799,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/yaml": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.0.tgz",
-      "integrity": "sha512-4lLa/EcQCB0cJkyts+FpIRx5G/llPxfP6VQU5KByHEhLxY3IJCH0f0Hy1MHI8sClTvsIb8qwRJ6R/ZdlDJ/leQ==",
-      "dev": true,
-      "license": "ISC",
-      "optional": true,
-      "peer": true,
-      "bin": {
-        "yaml": "bin.mjs"
-      },
-      "engines": {
-        "node": ">= 14.6"
-      }
-    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",

web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "shiftsync-website-web",
+  "version": "1.0.10",
   "private": true,
-  "version": "1.0.5",
   "type": "module",
   "scripts": {
     "local": "vite",

web/src/pages/Home/Home.jsx

@@ -14,10 +14,11 @@ export const Home = () => {
   }, []);
 
   return (
-    <div>
+    <div >
       <h1>Home Page</h1>
       <Link to="/settings">Go to Settings</Link>
       <p>Version: {pkg.version}</p>
+      <p>This site does nothing</p>
     </div>
   );
 };

web/src/pages/Settings/Settings.jsx

@@ -1,496 +1,492 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
-import styled from '@emotion/styled';
+import styled from '@emotion/styled';
-import { Stack } from '@mui/material';
+import { Stack } from '@mui/material';
-import EditIcon from '@mui/icons-material/Edit';
+import EditIcon from '@mui/icons-material/Edit';
-import EditOffIcon from '@mui/icons-material/EditOff';
+import EditOffIcon from '@mui/icons-material/EditOff';
-import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank';
+import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank';
-import CheckBoxIcon from '@mui/icons-material/CheckBox';
+import CheckBoxIcon from '@mui/icons-material/CheckBox';
-import { ToggleTabs, TransferBox, useLocalStore } from '@components';
+import { ToggleTabs, TransferBox, useLocalStore } from '@components';
-import { settingsFields } from './helpers';
+import { settingsFields } from './helpers';
-
+
-const OuterContainer = styled(Stack)`
+const OuterContainer = styled(Stack)`
-  position: relative;
+  position: relative;
-  display: flex;
+  display: flex;
-  align-items: center;
+  align-items: center;
-  flex-direction: row;
+  flex-direction: row;
-  justify-content: center;
+  justify-content: center;
-  padding: 10px 10px 0px 0px;
+  padding: 10px 10px 0px 0px;
-`;
+`;
-
+
-const Border = styled('div')`
+const Border = styled('div')`
-  height: 1px;
+  height: 1px;
-  width: 100%;
+  width: 100%;
-  background-color: #A8A8A8;
+  background-color: #A8A8A8;
-`;
+`;
-
+
-const Tab = styled('div')`
+const Tab = styled('div')`
-  position: relative;
+  position: relative;
-  display: flex;
+  display: flex;
-  flex-direction: column;
+  flex-direction: column;
-  align-items: center;
+  align-items: center;
-  justify-content: flex-end;
+  justify-content: flex-end;
-  height: 100%;
+  height: 100%;
-  padding: 6px 16px;
+  padding: 6px 16px;
-  font-size: 20px;
+  font-size: 20px;
-  font-weight: 800;
+  font-weight: 800;
-  color: grey;
+  color: grey;
-  background: none;
+  background: none;
-  border: none;
+  border: none;
-  cursor: pointer;
+  cursor: pointer;
-  font-family: "WDXL Lubrifont TC";
+  font-family: "WDXL Lubrifont TC";
-  letter-spacing: .05em;
+  letter-spacing: .05em;
-  word-spacing: .2em;
+  word-spacing: .2em;
-`;
+`;
-
+
-const SlidingIndicator = styled('div')`
+const SlidingIndicator = styled('div')`
-  position: absolute;
+  position: absolute;
-  height: 1px;
+  height: 1px;
-  bottom: -1px;
+  bottom: -1px;
-  background-color: #4D79FF;
+  background-color: #4D79FF;
-  transition: left 0.3s ease, width 0.3s ease;
+  transition: left 0.3s ease, width 0.3s ease;
-`;
+`;
-
+
-const CardShell = styled('div')`
+const CardShell = styled('div')`
-  display: flex;
+  display: flex;
-  flex-direction: column;
+  flex-direction: column;
-  justify-content: center;
+  justify-content: center;
-  align-items: center;
+  align-items: center;
-  padding: 10px;
+  padding: 10px;
-`;
+`;
-
+
-const Card = styled('div')`
+const Card = styled('div')`
-  background-color: #C7C7C7;
+  background-color: #C7C7C7;
-  width: 50%;
+  width: 50%;
-  min-width: 750px;
+  min-width: 750px;
-  padding: 20px;
+  padding: 20px;
-  border-radius: 10px;
+  border-radius: 10px;
-  margin: 5px;
+  margin: 5px;
-`;
+`;
-
+
-const CardTitle = styled('p')`
+const CardTitle = styled('p')`
-  color: white;
+  color: white;
-  font-weight: 400;
+  font-weight: 400;
-  font-size: 20px;
+  font-size: 20px;
-  font-family: "WDXL Lubrifont TC";
+  font-family: "WDXL Lubrifont TC";
-  padding-bottom: 5px;
+  padding-bottom: 5px;
-`;
+`;
-
+
-const CardHeader = styled('div')`
+const CardHeader = styled('div')`
-  display: flex;
+  display: flex;
-  justify-content: space-between;
+  justify-content: space-between;
-  flex-direction: row;
+  flex-direction: row;
-  padding: 10px;
+  padding: 10px;
-`;
+`;
-
+
-const EditArea = styled('div')`
+const EditArea = styled('div')`
-  display: flex; 
+  display: flex; 
-  flex-direction: row;
+  flex-direction: row;
-  justify-content: flex-end;
+  justify-content: flex-end;
-  padding-top: 10px;
+  padding-top: 10px;
-  color: #4D79FF;
+  color: #4D79FF;
-  font-weight: 600;
+  font-weight: 600;
-`;
+`;
-
+
-const EditTextButton = styled('div')`
+const EditTextButton = styled('div')`
-  display: flex;
+  display: flex;
-  flex-direction: row;
+  flex-direction: row;
-  align-items: center;
+  align-items: center;
-  cursor: pointer;
+  cursor: pointer;
-  gap: 4px;
+  gap: 4px;
-  padding-bottom: 2px;
+  padding-bottom: 2px;
-  border-bottom: 2px solid transparent;
+  border-bottom: 2px solid transparent;
-  transition: border-bottom 0.2s ease;
+  transition: border-bottom 0.2s ease;
-
+
-  &:hover {
+  &:hover {
-    border-bottom: 2px solid #4D79FF;
+    border-bottom: 2px solid #4D79FF;
-  }
+  }
-`;
+`;
-
+
-const CardBody = styled('div')`
+const CardBody = styled('div')`
-  display: flex;
+  display: flex;
-  flex-direction: column;
+  flex-direction: column;
-  align-items: center;
+  align-items: center;
-`;
+`;
-
+
-const InnerCard = styled('div')`
+const InnerCard = styled('div')`
-  display: flex;
+  display: flex;
-  flex-direction: column;
+  flex-direction: column;
-  padding: 10px;
+  padding: 10px;
-  width: 50%;
+  width: 50%;
-
+
-  ${({ centered }) => centered && `
+  ${({ centered }) => centered && `
-    align-items: center;
+    align-items: center;
-  `}
+  `}
-`;
+`;
-
+
-const InnerCardRow = styled('div')`
+const InnerCardRow = styled('div')`
-  display: flex;
+  display: flex;
-  flex-direction: row;
+  flex-direction: row;
-  padding: 5px;
+  padding: 5px;
-`;
+`;
-
+
-const InnerCardRowLabel = styled('label')`
+const InnerCardRowLabel = styled('label')`
-  display: flex;
+  display: flex;
-  justify-content: flex-end;
+  justify-content: flex-end;
-  text-align: right;
+  text-align: right;
-  width: 60%;
+  width: 60%;
-  padding-right: 10px;
+  padding-right: 10px;
-  font-size: 14px;
+  font-size: 14px;
-  align-items: center;
+`;
-`;
+
-
+const InnerCardRowInput = styled('input')`
-const InnerCardRowInput = styled('input')`
+  display: flex;
-  display: flex;
+  justify-content: flex-end;
-  justify-content: flex-end;
+  width: 100%;
-  width: 100%;
+  padding: 4px;
-  padding: 4px;
+`;
-`;
+
-
+const InnerCardRadioInput = styled('input')`
-const InnerCardRadioInput = styled('input')`
+  padding-right: 5px;
-  padding-right: 5px;
+`;
-`;
+
-
+const InnerCardRadioLabel = styled('label')`
-const InnerCardRadioLabel = styled('label')`
+  font-size: 14px;
-  font-size: 14px;
+  padding-left: 5px;
-  padding-left: 5px;
+`;
-  align-items: center;
+
-`;
+const InnerCardRowRadioDiv = styled('div')`
-
+  display: flex;
-const InnerCardRowRadioDiv = styled('div')`
+  justify-content: space-evenly;
-  display: flex;
+  width: 100%;
-  justify-content: space-evenly;
+  padding: 4px;
-  width: 100%;
+`;
-  padding: 4px;
+
-`;
+const FormRadioButtonLabel = styled('label')``;
-
+
-const FormRadioButtonLabel = styled('label')``;
+const FormInputButtonDiv = styled('div')`
-
+  display: flex; 
-const FormInputButtonDiv = styled('div')`
+  flex-direction: row;
-  display: flex; 
+  justify-content: flex-end;
-  flex-direction: row;
+  padding-top: 10px;
-  justify-content: flex-end;
+`;
-  padding-top: 10px;
+
-`;
+const FormInputButton = styled('input')`
-
+  padding: 4px 10px;
-const FormInputButton = styled('input')`
+  border-radius: 4px;
-  padding: 4px 10px;
+`;
-  border-radius: 4px;
+
-`;
+export const Settings = () => {
-
+  const { user, department, setDepartment } = useLocalStore();
-export const Settings = () => {
+
-  const { user, department, setDepartment } = useLocalStore();
+  const isAdministrator = user?.administrator;
-
+  const isManager = user?.manager;
-  const isAdministrator = user?.administrator;
+  const isScheduler = user?.scheduler;
-  const isManager = user?.manager;
+
-  const isScheduler = user?.scheduler;
+  const originalDepartmentRef = useRef(department);
-
+  const [formValues, setFormValues] = useState(() => {
-  const originalDepartmentRef = useRef(department);
+    const initial = {};
-  const [formValues, setFormValues] = useState(() => {
+    settingsFields.forEach(section => {
-    const initial = {};
+      section.cards.forEach(card => {
-    settingsFields.forEach(section => {
+        card.fields.forEach(field => {
-      section.cards.forEach(card => {
+          initial[field.id] = department?.[field.id] || '';
-        card.fields.forEach(field => {
+        });
-          initial[field.id] = department?.[field.id] || '';
+      });
-        });
+    });
-      });
+    return initial;
-    });
+  });
-    return initial;
+  const pageRefs = useRef({});
-  });
+  const tabs = [
-  const pageRefs = useRef({});
+      {
-  const tabs = [
+          label: 'Personal',
-      {
+          value: 'personal'
-          label: 'Personal',
+      },
-          value: 'personal'
+      {
-      },
+          label: 'Department',
-      {
+          value: 'department'
-          label: 'Department',
+      }
-          value: 'department'
+  ];
-      }
+
-  ];
+  const [windowWidth, setWindowWidth] = useState(window.innerWidth);
-
+  const [editMode, setEditMode] = useState(null);
-  const [windowWidth, setWindowWidth] = useState(window.innerWidth);
+  const [tabValue, setTabValue] = useState(tabs[0]);
-  const [editMode, setEditMode] = useState(null);
+  const [pageValue, setPageValue] = useState({});
-  const [tabValue, setTabValue] = useState(tabs[0]);
+  const [indicatorStyle, setIndicatorStyle] = useState({ left: 0, width: 0 });
-  const [pageValue, setPageValue] = useState({});
+
-  const [indicatorStyle, setIndicatorStyle] = useState({ left: 0, width: 0 });
+  const getChangedFields = (original, current) => {
-
+    const changed = {};
-  const getChangedFields = (original, current) => {
+    for (const key in current) {
-    const changed = {};
+      if (current[key] !== original[key]) {
-    for (const key in current) {
+        changed[key] = current[key];
-      if (current[key] !== original[key]) {
+      }
-        changed[key] = current[key];
+    }
-      }
+    return changed;
-    }
+  };
-    return changed;
+
-  };
+  const changedFields = getChangedFields(originalDepartmentRef.current, formValues);
-
+  const hasChanges = Object.keys(changedFields).length > 0;
-  const changedFields = getChangedFields(originalDepartmentRef.current, formValues);
+
-  const hasChanges = Object.keys(changedFields).length > 0;
+  const onSubmit = (data) => {
-
+    setDepartment({
-  const onSubmit = (data) => {
+      ...department,
-    setDepartment({
+      ...data
-      ...department,
+    });
-      ...data
+    originalDepartmentRef.current = {
-    });
+      ...originalDepartmentRef.current,
-    originalDepartmentRef.current = {
+      ...data
-      ...originalDepartmentRef.current,
+    };
-      ...data
+    setEditMode(null);
-    };
+  };
-    setEditMode(null);
+
-  };
+  const formatPhoneNumber = (value) => {
-
+    const cleaned = value.replace(/\D/g, '').slice(0, 10); // Only digits, max 10
-  const formatPhoneNumber = (value) => {
+    const length = cleaned.length;
-    const cleaned = value.replace(/\D/g, '').slice(0, 10); // Only digits, max 10
+
-    const length = cleaned.length;
+    if (length === 0) return '';
-
+    if (length < 4) return `(${cleaned}`;
-    if (length === 0) return '';
+    if (length < 7) return `(${cleaned.slice(0, 3)}) ${cleaned.slice(3)}`;
-    if (length < 4) return `(${cleaned}`;
+    return `(${cleaned.slice(0, 3)}) ${cleaned.slice(3, 6)}-${cleaned.slice(6)}`;
-    if (length < 7) return `(${cleaned.slice(0, 3)}) ${cleaned.slice(3)}`;
+  };
-    return `(${cleaned.slice(0, 3)}) ${cleaned.slice(3, 6)}-${cleaned.slice(6)}`;
+
-  };
+
-
+  const handleChange = (e, type) => {
-
+    let { name, value } = e.target;
-  const handleChange = (e, type) => {
+    if (type === 'phone') {
-    let { name, value } = e.target;
+      value = formatPhoneNumber(value);
-    if (type === 'phone') {
+    }
-      value = formatPhoneNumber(value);
+    setFormValues(prev => ({ ...prev, [name]: value }));
-    }
+  };
-    setFormValues(prev => ({ ...prev, [name]: value }));
+
-  };
+  useEffect(() => {
-
+    document.title = 'ShiftSync | Settings';
-  useEffect(() => {
+  }, []);
-    document.title = 'ShiftSync | Settings';
+
-  }, []);
+  useEffect(() => {
-
+    const handleResize = () => setWindowWidth(window.innerWidth);
-  useEffect(() => {
+    window.addEventListener('resize', handleResize);
-    const handleResize = () => setWindowWidth(window.innerWidth);
+
-    window.addEventListener('resize', handleResize);
+    // Initial trigger (in case something else needs it)
-
+    handleResize();
-    // Initial trigger (in case something else needs it)
+
-    handleResize();
+    return () => {
-
+      window.removeEventListener('resize', handleResize);
-    return () => {
+    };
-      window.removeEventListener('resize', handleResize);
+  }, []);
-    };
+
-  }, []);
+  useEffect(() => {
-
+    if (pageValue?.id && pageRefs.current[pageValue.id]) {
-  useEffect(() => {
+      const el = pageRefs.current[pageValue.id];
-    if (pageValue?.id && pageRefs.current[pageValue.id]) {
+      const rect = el.getBoundingClientRect();
-      const el = pageRefs.current[pageValue.id];
+      const containerRect = el.parentNode.getBoundingClientRect();
-      const rect = el.getBoundingClientRect();
+      setIndicatorStyle({
-      const containerRect = el.parentNode.getBoundingClientRect();
+        left: rect.left - containerRect.left,
-      setIndicatorStyle({
+        width: rect.width
-        left: rect.left - containerRect.left,
+      });
-        width: rect.width
+    }
-      });
+  }, [pageValue?.id, windowWidth, window.innerHeight]);
-    }
+
-  }, [pageValue?.id, windowWidth, window.innerHeight]);
+  useEffect(() => {
-
+    const filteredFields = settingsFields?.filter((field) => {
-  useEffect(() => {
+      const hasAccess =
-    const filteredFields = settingsFields?.filter((field) => {
+        (field?.accessRequired === 'administrator' && isAdministrator) ||
-      const hasAccess =
+        (field?.accessRequired === 'manager' && isManager) ||
-        (field?.accessRequired === 'administrator' && isAdministrator) ||
+        (field?.accessRequired === 'scheduler' && isScheduler) ||
-        (field?.accessRequired === 'manager' && isManager) ||
+        (!field?.accessRequired || field?.accessRequired === 'user');
-        (field?.accessRequired === 'scheduler' && isScheduler) ||
+
-        (!field?.accessRequired || field?.accessRequired === 'user');
+      return field?.tab === tabValue?.value && hasAccess;
-
+    });
-      return field?.tab === tabValue?.value && hasAccess;
+
-    });
+    if (filteredFields.length > 0) {
-
+      setPageValue(filteredFields[0]);
-    if (filteredFields.length > 0) {
+    } else {
-      setPageValue(filteredFields[0]);
+      setPageValue(null);
-    } else {
+    }
-      setPageValue(null);
+  }, [tabValue, isAdministrator, isManager, isScheduler]);
-    }
+
-  }, [tabValue, isAdministrator, isManager, isScheduler]);
+  return (
-
+    <div>
-  return (
+      {user?.administrator || user?.manager ? (
-    <div>
+        <OuterContainer>
-      {user?.administrator || user?.manager ? (
+          <ToggleTabs 
-        <OuterContainer>
+            tabs={tabs}
-          <ToggleTabs 
+            tabValue={tabValue}
-            tabs={tabs}
+            setTabValue={setTabValue}
-            tabValue={tabValue}
+            tabColor='#4D79FF'
-            setTabValue={setTabValue}
+          />
-            tabColor='#4D79FF'
+        </OuterContainer>
-          />
+      ) : null }
-        </OuterContainer>
+      <OuterContainer>
-      ) : null }
+        {settingsFields?.filter((field) => field?.tab === tabValue?.value)?.filter((field) => {
-      <OuterContainer>
+          return ((field?.accessRequired === 'administrator' && isAdministrator) || 
-        {settingsFields?.filter((field) => field?.tab === tabValue?.value)?.filter((field) => {
+          (field?.accessRequired === 'manager' && isManager) ||
-          return ((field?.accessRequired === 'administrator' && isAdministrator) || 
+          (field?.accessRequired === 'scheduler' && isScheduler) ||
-          (field?.accessRequired === 'manager' && isManager) ||
+          (field?.accessRequired === 'user' || !field?.accessRequired))
-          (field?.accessRequired === 'scheduler' && isScheduler) ||
+        })?.map((field) => {
-          (field?.accessRequired === 'user' || !field?.accessRequired))
+          return (
-        })?.map((field) => {
+            <Tab
-          return (
+              key={field?.id}
-            <Tab
+              ref={(el) => { pageRefs.current[field?.id] = el; }}
-              key={field?.id}
+              onClick={() => setPageValue(field)}
-              ref={(el) => { pageRefs.current[field?.id] = el; }}
+            >
-              onClick={() => setPageValue(field)}
+              {field?.title}
-            >
+            </Tab>
-              {field?.title}
+          )
-            </Tab>
+        })}
-          )
+        <SlidingIndicator style={indicatorStyle} />
-        })}
+      </OuterContainer>
-        <SlidingIndicator style={indicatorStyle} />
+      <Border />
-      </OuterContainer>
+      <CardShell>
-      <Border />
+        {pageValue?.cards?.map((card) => {
-      <CardShell>
+          if (
-        {pageValue?.cards?.map((card) => {
+            (card?.accessRequired === 'administrator' && isAdministrator) || 
-          if (
+            (card?.accessRequired === 'manager' && isManager) ||
-            (card?.accessRequired === 'administrator' && isAdministrator) || 
+            (card?.accessRequired === 'scheduler' && isScheduler)
-            (card?.accessRequired === 'manager' && isManager) ||
+          ) {
-            (card?.accessRequired === 'scheduler' && isScheduler)
+            return (
-          ) {
+              <Card
-            return (
+                key={`${card?.id}-card`}
-              <Card
+              >
-                key={`${card?.id}-card`}
+                <CardTitle
-              >
+                  key={`${card?.id}-card-title`}
-                <CardTitle
+                >
-                  key={`${card?.id}-card-title`}
+                  {card?.label}
-                >
+                </CardTitle>
-                  {card?.label}
+                {card?.fields?.find((field) => field?.type === 'header') !== undefined && (
-                </CardTitle>
+                  <div>
-                {card?.fields?.find((field) => field?.type === 'header') !== undefined && (
+                    <Border key={`${card?.id}-border-1`}/>
-                  <div>
+                    <CardHeader
-                    <Border key={`${card?.id}-border-1`}/>
+                      key={`${card?.id}-card-header`}
-                    <CardHeader
+                    >
-                      key={`${card?.id}-card-header`}
+                      {card?.fields?.map((field) => {
-                    >
+                        return field?.type === 'header' && (
-                      {card?.fields?.map((field) => {
+                          <InnerCardRow key={`${field?.id}-row`}>
-                        return field?.type === 'header' && (
+                            <p style={{ fontSize: 14 }}>
-                          <InnerCardRow key={`${field?.id}-row`}>
+                              {field?.label}:
-                            <p style={{ fontSize: 14 }}>
+                            </p>
-                              {field?.label}:
+                            <p style={{ paddingLeft: 10, fontSize: 14 }}>
-                            </p>
+                              {department[field?.id]}
-                            <p style={{ paddingLeft: 10, fontSize: 14 }}>
+                            </p>
-                              {department[field?.id]}
+                          </InnerCardRow>
-                            </p>
+                        )
-                          </InnerCardRow>
+                      })}
-                        )
+                    </CardHeader>
-                      })}
+                  </div>
-                    </CardHeader>
+                )}
-                  </div>
+                <Border key={`${card?.id}-border-2`}/>
-                )}
+                <form
-                <Border key={`${card?.id}-border-2`}/>
+                  onSubmit={(e) => {
-                <form
+                    e.preventDefault();
-                  onSubmit={(e) => {
+                    onSubmit(changedFields);
-                    e.preventDefault();
+                  }}
-                    onSubmit(changedFields);
+                >
-                  }}
+                  <EditArea>
-                >
+                    {!card?.removeEdit && (
-                  <EditArea>
+                      editMode === card?.id ? (
-                    {!card?.removeEdit && (
+                        <EditTextButton onClick={() => setEditMode(null)}>
-                      editMode === card?.id ? (
+                          <EditOffIcon sx={{ fontSize: 20 }} /> 
-                        <EditTextButton onClick={() => setEditMode(null)}>
+                          <p>View</p>
-                          <EditOffIcon sx={{ fontSize: 20 }} /> 
+                        </EditTextButton>
-                          <p>View</p>
+                      ) : (
-                        </EditTextButton>
+                        <EditTextButton onClick={() => setEditMode(card?.id)}>
-                      ) : (
+                          <EditIcon sx={{ fontSize: 20 }} />
-                        <EditTextButton onClick={() => setEditMode(card?.id)}>
+                          <p>Edit</p>
-                          <EditIcon sx={{ fontSize: 20 }} />
+                        </EditTextButton>
-                          <p>Edit</p>
+                      )
-                        </EditTextButton>
+                    )}
-                      )
+                  </EditArea>
-                    )}
+                  <CardBody
-                  </EditArea>
+                    key={`${card?.id}-card-body`}
-                  <CardBody
+                  >
-                    key={`${card?.id}-card-body`}
+                    <InnerCard
-                  >
+                      key={`${card?.id}-inner-card`}
-                    <InnerCard
+                      centered={card.fields.some(f => f.type === 'transfer')}
-                      key={`${card?.id}-inner-card`}
+                    >
-                      centered={card.fields.some(f => f.type === 'transfer')}
+                      {card?.fields?.map((field) => {
-                    >
+                        let fieldType;
-                      {card?.fields?.map((field) => {
+                        if (field?.type === 'text') {
-                        let fieldType;
+                          fieldType = <InnerCardRowInput
-                        if (field?.type === 'text') {
+                            name={field?.id}
-                          fieldType = <InnerCardRowInput
+                            disabled={card?.id !== editMode || field?.readOnly}
-                            name={field?.id}
+                            value={formValues[field?.id] ?? 'Not Provided'}
-                            disabled={card?.id !== editMode || field?.readOnly}
+                            onChange={(e) => handleChange(e, 'text')}
-                            value={formValues[field?.id] ?? 'Not Provided'}
+                          />;
-                            onChange={(e) => handleChange(e, 'text')}
+                        } else if (field?.type === 'phone') {
-                          />;
+                          fieldType = <InnerCardRowInput 
-                        } else if (field?.type === 'phone') {
+                            type="tel"
-                          fieldType = <InnerCardRowInput 
+                            name="phone"
-                            type="tel"
+                            placeholder="(123) 456-7890"
-                            name="phone"
+                            value={formValues[field?.id]}
-                            placeholder="(123) 456-7890"
+                            disabled={card?.id !== editMode || field?.readOnly}
-                            value={formValues[field?.id]}
+                            onChange={(e) => handleChange(e, 'phone')}
-                            disabled={card?.id !== editMode || field?.readOnly}
+                            pattern="\(\d{3}\) \d{3}-\d{4}"
-                            onChange={(e) => handleChange(e, 'phone')}
+                            maxlength="14"
-                            pattern="\(\d{3}\) \d{3}-\d{4}"
+                          />
-                            maxlength="14"
+                        } else if (field?.type === 'select') {
-                          />
+                          fieldType = (
-                        } else if (field?.type === 'select') {
+                            <InnerCardRowRadioDiv>
-                          fieldType = (
+                            {field?.options?.map((option) => {
-                            <InnerCardRowRadioDiv>
+                              const inputId = `${field.id}-${option.value}`;
-                            {field?.options?.map((option) => {
+                              return (
-                              const inputId = `${field.id}-${option.value}`;
+                                <FormRadioButtonLabel htmlFor={inputId} key={inputId}>
-                              return (
+                                  <InnerCardRadioInput 
-                                <FormRadioButtonLabel htmlFor={inputId} key={inputId}>
+                                    type="radio"
-                                  <InnerCardRadioInput 
+                                    id={inputId}
-                                    type="radio"
+                                    name={field?.id}
-                                    id={inputId}
+                                    value={option?.value}
-                                    name={field?.id}
+                                    checked={formValues[field.id] === option.value}
-                                    value={option?.value}
+                                    disabled={card?.id !== editMode || field?.readOnly}
-                                    checked={formValues[field.id] === option.value}
+                                    onChange={(e) => handleChange(e, 'text')}
-                                    disabled={card?.id !== editMode || field?.readOnly}
+                                  />
-                                    onChange={(e) => handleChange(e, 'text')}
+                                  <InnerCardRadioLabel htmlFor={inputId} key={inputId}>
-                                  />
+                                    {option?.label}
-                                  <InnerCardRadioLabel htmlFor={inputId} key={inputId}>
+                                  </InnerCardRadioLabel>
-                                    {option?.label}
+                                </FormRadioButtonLabel>
-                                  </InnerCardRadioLabel>
+                              )
-                                </FormRadioButtonLabel>
+                            })}
-                              )
+                            </InnerCardRowRadioDiv>
-                            })}
+                          )
-                            </InnerCardRowRadioDiv>
+                        } else if (field?.type === 'transfer') {
-                          )
+                          fieldType = <TransferBox
-                        } else if (field?.type === 'transfer') {
+                            style={{ display: 'flex', flexDirection: 'row' }}
-                          fieldType = <TransferBox
+                            user={user}
-                            style={{ display: 'flex', flexDirection: 'row' }}
+                            fields={field}
-                            user={user}
+                            leftGroup={department[field?.origList]}
-                            fields={field}
+                            rightGroup={department[field?.id]}
-                            leftGroup={department[field?.origList]}
+                            onSave={(t) => console.log(t)}
-                            rightGroup={department[field?.id]}
+                          />
-                            onSave={(t) => {
+                        }
-                              return onSubmit({ [field.id]: t });
+                        return field?.type !== 'header' && (
-                            }}
+                          <InnerCardRow key={`${field?.id}-row`}>
-                          />
+                            {field?.label ? (
-                        }
+                              <InnerCardRowLabel>
-                        return field?.type !== 'header' && (
+                                {field?.label}:
-                          <InnerCardRow key={`${field?.id}-row`}>
+                              </InnerCardRowLabel>
-                            {field?.label ? (
+                            ) : null }
-                              <InnerCardRowLabel>
+                            {fieldType}
-                                {field?.label}:
+                          </InnerCardRow>
-                              </InnerCardRowLabel>
+                        )
-                            ) : null }
+                      })}
-                            {fieldType}
+                    </InnerCard>
-                          </InnerCardRow>
+                  </CardBody>
-                        )
+                  {card?.id === editMode && (
-                      })}
+                    <FormInputButtonDiv>
-                    </InnerCard>
+                      <FormInputButton 
-                  </CardBody>
+                        type="submit" 
-                  {card?.id === editMode && (
+                        value="Save" 
-                    <FormInputButtonDiv>
+                        disabled={!hasChanges}
-                      <FormInputButton 
+                        style={{
-                        type="submit" 
+                          backgroundColor: hasChanges ? '#4D79FF' : '',
-                        value="Save" 
+                          color: hasChanges ? 'white' : ''
-                        disabled={!hasChanges}
+                        }}
-                        style={{
+                      /> 
-                          backgroundColor: hasChanges ? '#4D79FF' : '',
+                    </FormInputButtonDiv>
-                          color: hasChanges ? 'white' : ''
+                  )}
-                        }}
+                </form>
-                      /> 
+              </Card>
-                    </FormInputButtonDiv>
+            )
-                  )}
+          }
-                </form>
+          return null;
-              </Card>
+        })}
-            )
+      </CardShell>
-          }
+    </div>
-          return null;
+  );
-        })}
+};
-      </CardShell>
-    </div>
-  );
-};

web/src/router/AppRouter.jsx

@@ -1,170 +1,163 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
-import { Routes, Route } from 'react-router-dom';
+import { Routes, Route } from 'react-router-dom';
-import { Home, Profile, Schedule, Settings } from '@src/pages';
+import { Home, Profile, Schedule, Settings } from '@src/pages';
-import { Shell } from '@components';
+import { Shell } from '@components';
-import { useLocalStore } from '@components';
+import { useLocalStore } from '@components';
-import { fetchAPI } from './axios.js';
+import axios from "axios";
-
+
-const dept = {
+const dept = {
-  id: 1,
+  id: 1,
-  company: 'Darien EMS - Post 53',
+  company: 'Darien EMS - Post 53',
-  abv: 'DEMS',
+  abv: 'DEMS',
-  billing_address: '0 Ledge Road',
+  billing_address: '0 Ledge Road',
-  town: 'Darien',
+  town: 'Darien',
-  state: 'Connecticut',
+  state: 'Connecticut',
-  postal: '06820',
+  postal: '06820',
-  country: 'United States',
+  country: 'United States',
-  phone: '',
+  phone: '',
-  display_time: '12',
+  display_time: '12',
-  start_day: 'sunday',
+  start_day: 'sunday',
-  company_logo: '',
+  company_logo: '',
-  employee_count: 1,
+  employee_count: 1,
-  subscription_expiration: '10/01/2025',
+  subscription_expiration: '10/01/2025',
-  schedulers: [3],
+  schedulers: [3],
-  managers: [2],
+  managers: [2],
-  administrators: [1]
+  administrators: [1]
-};
+};
-
+
-const users = [
+const users = [
-  {
+  {
-    id: 1,
+    id: 1,
-    first_name: 'ShiftSync-Administrator',
+    first_name: 'ShiftSync-Administrator',
-    last_name: 'Test-User',
+    last_name: 'Test-User',
-    email: 'testuserA@shift-sync.com',
+    email: 'testuserA@shift-sync.com',
-    accessLevel: 150,
+    is_ss_admin: false
-    is_ss_admin: false
+  },
-  },
+  {
-  {
+    id: 2,
-    id: 2,
+    first_name: 'ShiftSync-Manager',
-    first_name: 'ShiftSync-Manager',
+    last_name: 'Test-User',
-    last_name: 'Test-User',
+    email: 'testuserM@shift-sync.com',
-    email: 'testuserM@shift-sync.com',
+    is_ss_admin: false
-    accessLevel: 100,
+  },
-    is_ss_admin: false
+  {
-  },
+    id: 3,
-  {
+    first_name: 'ShiftSync-Scheduler',
-    id: 3,
+    last_name: 'Test-User',
-    first_name: 'ShiftSync-Scheduler',
+    email: 'testuserS@shift-sync.com',
-    last_name: 'Test-User',
+    is_ss_admin: false
-    email: 'testuserS@shift-sync.com',
+  },
-    accessLevel: 50,
+  {
-    is_ss_admin: false
+    id: 4,
-  },
+    first_name: 'ShiftSync-User',
-  {
+    last_name: 'Test-User',
-    id: 4,
+    email: 'testuserU@shift-sync.com',
-    first_name: 'ShiftSync-User',
+    is_ss_admin: false
-    last_name: 'Test-User',
+  },
-    email: 'testuserU@shift-sync.com',
+]
-    accessLevel: 1,
+
-    is_ss_admin: false
+const AppRouter = () => {
-  },
+  const { user, setUser, setDepartment } = useLocalStore();
-];
+  const [userChanged, setUserChanged] = useState(false);
-
+  const isDev = true; // change for it.
-const AppRouter = () => {
+
-  const { user, setUser, setDepartment } = useLocalStore();
+  const fetchAPI = async () => {
-  const [userChanged, setUserChanged] = useState(false);
+    const location = window.location;
-
+    const uri = `${location?.protocol}//${location.hostname}/api`;
-  useEffect(() => {
+    const response = await axios.get(uri);
-    const init = async () => {
+    console.log(response.data.fruits);
-      const localVersion = localStorage.getItem("APP_VERSION");
+  };
-      const currentVersion = window.APP_VERSION;
+
-
+  useEffect(() => {
-      if (localVersion && localVersion !== currentVersion) {
+    const localVersion = localStorage.getItem("APP_VERSION");
-        console.log("Version changed, forcing reload");
+    const currentVersion = window.APP_VERSION;
-        localStorage.setItem("APP_VERSION", currentVersion);
+
-        window.location.reload(true);
+    if (localVersion && localVersion !== currentVersion) {
-        return;
+      console.log("Version changed, forcing reload");
-      } else {
+      localStorage.setItem("APP_VERSION", currentVersion);
-        localStorage.setItem("APP_VERSION", currentVersion);
+      window.location.reload(true); // force full page reload
-      }
+    } else {
-
+      localStorage.setItem("APP_VERSION", currentVersion);
-      const data = await fetchAPI('userData', 'get');
+    }
-      console.log('data:', data);
+    
-
+    fetchAPI();
-      // TODO: Replace this with real data from your API
+    // await call for getting the count of employees and any other calls to db.
-      // const users = data?.users || [];   // Example fix
+    const employee_count = 1;
-      // const dept = data?.dept || {};     // Example fix
+    const subs_expiration = '10/22/2025';
-
+    setUser({
-      const employee_count = 1;
+      ...users[0],
-      const subs_expiration = '10/22/2025';
+      scheduler: dept?.schedulers?.includes(1),
-
+      manager: dept?.managers?.includes(1),
-      setUser({
+      administrator: dept?.administrators?.includes(1)
-        ...users[0],
+    });
-        scheduler: dept?.schedulers?.includes(1),
+    const newAdministrators = dept?.administrators?.map((admin) => {
-        manager: dept?.managers?.includes(1),
+      const user = users?.find((user) => {
-        administrator: dept?.administrators?.includes(1)
+        return user?.id === admin;
-      });
+      });
-
+      return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
-      const newAdministrators = dept?.administrators?.map((admin) => {
+    });
-        const user = users?.find((user) => user?.id === admin);
+    const newManagers = dept?.managers?.map((manager) => {
-        return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
+      const user = users?.find((user) => {
-      });
+        return user?.id === manager;
-
+      });
-      const newManagers = dept?.managers?.map((manager) => {
+      return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
-        const user = users?.find((user) => user?.id === manager);
+    });
-        return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
+    const newSchedulers = dept?.schedulers?.map((scheduler) => {
-      });
+      const user = users?.find((user) => {
-
+        return user?.id === scheduler;
-      const newSchedulers = dept?.schedulers?.map((scheduler) => {
+      });
-        const user = users?.find((user) => user?.id === scheduler);
+      return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
-        return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
+    });
-      });
+    const newUsers = users?.map((user) => {
-
+      return { id: user?.id, value: `${user?.last_name}, ${user?.first_name}` };
-      const newUsers = users?.map((user) => ({
+    });
-        id: user?.id,
+    setDepartment({
-        value: `${user?.last_name}, ${user?.first_name}`
+      ...dept,
-      }));
+      users: newUsers,
-
+      schedulers: newSchedulers,
-      setDepartment({
+      managers: newManagers,
-        ...dept,
+      administrators: newAdministrators,
-        users: newUsers,
+      employee_count,
-        schedulers: newSchedulers,
+      subs_expiration
-        managers: newManagers,
+    });
-        administrators: newAdministrators,
+  }, []);
-        employee_count,
+
-        subs_expiration
+  useEffect(() => {
-      });
+    if (!userChanged && user) {
-    };
+      if (user?.is_ss_admin) {
-
+        setUser({
-    init();
+          ...user,
-  }, []);
+          scheduler: true,
-
+          manager: true,
-  useEffect(() => {
+          administrator: true,
-    if (!userChanged && user) {
+        });
-      if (user?.is_ss_admin) {
+      } else if (user?.administrator) {
-        setUser({
+        setUser({
-          ...user,
+          ...user,
-          scheduler: true,
+          scheduler: true,
-          manager: true,
+          manager: true,
-          administrator: true,
+        });
-        });
+      } else if (user?.manager) {
-      } else if (user?.administrator) {
+        setUser({
-        setUser({
+          ...user,
-          ...user,
+          scheduler: true,
-          scheduler: true,
+        });
-          manager: true,
+      }
-        });
+      setUserChanged(true);
-      } else if (user?.manager) {
+    }
-        setUser({
+  }, [user]);
-          ...user,
+
-          scheduler: true,
+
-        });
+  return (
-      }
+    <Shell>
-      setUserChanged(true);
+      <Routes>
-    }
+        <Route path="/" element={<Home />} />
-  }, [user]);
+        <Route path="/schedule" element={<Schedule />} />
-
+        <Route path="/settings" element={<Settings />} />
-
+        <Route path="/profile" element={<Profile />} />
-  return (
+      </Routes>
-    <Shell>
+    </Shell>
-      <Routes>
+  );
-        <Route path="/" element={<Home />} />
+};
-        <Route path="/schedule" element={<Schedule />} />
+
-        <Route path="/settings" element={<Settings />} />
+export default AppRouter
-        <Route path="/profile" element={<Profile />} />
-      </Routes>
-    </Shell>
-  );
-};
-
-export default AppRouter

web/src/router/axios.js

@@ -1,27 +0,0 @@
-import axios from 'axios';
-
-export const fetchAPI = async (endpoint, type, body = null) => {
-  const location = window.location;
-  const url = `${location?.protocol}//${location.hostname}${location?.hostname === 'localhost' ? ':5172' : ''}/api/rest/${endpoint}`;
-
-  const requestOptions = {
-    headers: {
-      'Content-Type': 'application/json'
-    }
-  };
-
-  try {
-    let response;
-    if (type === 'post') {
-      response = await axios.post(url, body, requestOptions);
-    } else if (type === 'get') {
-      response = await axios.get(url, requestOptions);
-    } else {
-      console.warn('No proper type given: ', type);
-      return;
-    }
-    return response.data;
-  } catch (err) {
-    console.error('PG Rest Query Error: ', err);
-  }
-};