Development

.dockerignore

@@ -0,0 +1,10 @@
+node_modules
+.git
+.gitignore
+.env
+.env.*
+*.log
+npm-debug.log*
+dist
+coverage
+.nyc_output

.github/workflows/azure-static-web-apps-gray-grass-0ab138600.yml

@@ -0,0 +1,52 @@
+name: Azure Static Web Apps CI/CD — Dir 1 (Frontend)
+
+on:
+  push:
+    branches:
+      - development
+  pull_request:
+    types: [opened, synchronize, reopened, closed]
+    branches:
+      - development
+
+jobs:
+  build_and_deploy_job:
+    runs-on: ubuntu-latest
+    name: Build and Deploy Job
+    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          submodules: true
+          lfs: false
+
+      - name: Build And Deploy
+        id: builddeploy
+        uses: Azure/static-web-apps-deploy@v1
+        with:
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_GRAY_GRASS_0AB138600 }}
+          repo_token: ${{ secrets.GITHUB_TOKEN }}
+          action: "upload"
+          app_location: "/"
+          api_location: ""
+          output_location: "dist"
+          production_branch: "development"
+        env:
+          VITE_API_BASE_URL: ${{ secrets.VITE_API_BASE_URL }}
+          VITE_APP_URL: ${{ secrets.VITE_APP_URL }}
+          VITE_GOOGLE_CLIENT_ID: ${{ secrets.VITE_GOOGLE_CLIENT_ID }}
+          VITE_RECAPTCHA_SITE_KEY: ${{ secrets.VITE_RECAPTCHA_SITE_KEY }}
+          VITE_USE_MOCK: ${{ secrets.VITE_USE_MOCK }}
+
+  close_pull_request_job:
+    runs-on: ubuntu-latest
+    name: Close Pull Request Job
+    if: github.event_name == 'pull_request' && github.event.action == 'closed'
+    steps:
+      - name: Close Pull Request
+        id: closepullrequest
+        uses: Azure/static-web-apps-deploy@v1
+        with:
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_GRAY_GRASS_0AB138600 }}
+          action: "close"
+          app_location: "/"

.github/workflows/frontend-cd-main.yml

@@ -0,0 +1,72 @@
+name: Frontend CD — VM Deploy
+
+on:
+  push:
+    branches:
+      - development
+
+jobs:
+  build-and-deploy:
+    name: Build Vite App & Deploy to VM1
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build production bundle
+        run: npm run build
+        env:
+          VITE_API_BASE_URL: https://rythmify-back.duckdns.org/api/v1
+          VITE_GOOGLE_CLIENT_ID: ${{ secrets.VITE_GOOGLE_CLIENT_ID }}
+          VITE_RECAPTCHA_SITE_KEY: ${{ secrets.VITE_RECAPTCHA_SITE_KEY }}
+
+      - name: Write SSH key to file
+        run: |
+          echo "${{ secrets.VM_SSH_KEY }}" > vm_key.pem
+          chmod 600 vm_key.pem
+
+      - name: Clear old dist on VM1
+        run: |
+          ssh -i vm_key.pem \
+              -o StrictHostKeyChecking=no \
+              ${{ secrets.VM_USER }}@${{ secrets.VM_HOST }} \
+              "sudo rm -rf /var/www/rythmify/* && sudo mkdir -p /var/www/rythmify && sudo chown -R rythmify:rythmify /var/www/rythmify && sudo chmod -R 755 /var/www/rythmify"
+
+      - name: SCP dist to VM1
+        run: |
+          scp -i vm_key.pem \
+              -o StrictHostKeyChecking=no \
+              -r dist/* \
+              ${{ secrets.VM_USER }}@${{ secrets.VM_HOST }}:/var/www/rythmify/
+
+      - name: Fix permissions and reload Nginx
+        run: |
+          ssh -i vm_key.pem \
+              -o StrictHostKeyChecking=no \
+              ${{ secrets.VM_USER }}@${{ secrets.VM_HOST }} << 'EOF'
+
+            sudo chown -R www-data:www-data /var/www/rythmify
+            sudo chmod -R 755 /var/www/rythmify
+            sudo systemctl reload nginx
+
+          EOF
+
+      - name: Smoke check frontend
+        run: |
+          sleep 5
+          curl -fsS https://rythmify.duckdns.org/ -o /dev/null
+          echo "Frontend smoke check passed."
+
+      - name: Clean up SSH key
+        if: always()
+        run: rm -f vm_key.pem

.github/workflows/frontend-dev.yml

@@ -0,0 +1,154 @@
+name: Frontend — Dev Pipeline
+
+on:
+  pull_request:
+    branches:
+      - development
+
+jobs:
+  # JOB 1 — Validate repo structure
+  validate-structure:
+    name: Validate Repo Structure
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout frontend repo
+        uses: actions/checkout@v4
+
+      - name: Check package files exist
+        run: |
+          test -f package.json       || { echo "MISSING: package.json"; exit 1; }
+          test -f package-lock.json  || { echo "MISSING: package-lock.json (use npm, not yarn)"; exit 1; }
+          echo "Package files present."
+
+      - name: Check TypeScript config exists
+        run: |
+          test -f tsconfig.json      || { echo "MISSING: tsconfig.json"; exit 1; }
+          test -f tsconfig.app.json  || { echo "MISSING: tsconfig.app.json"; exit 1; }
+          echo "TypeScript configs present."
+
+      - name: Check Vite config exists
+        run: |
+          test -f vite.config.ts || { echo "MISSING: vite.config.ts"; exit 1; }
+          echo "vite.config.ts present."
+
+      - name: Check ESLint config exists
+        run: |
+          test -f eslint.config.js || { echo "MISSING: eslint.config.js"; exit 1; }
+          echo "eslint.config.js present."
+
+      - name: Check src structure exists
+        run: |
+          test -d src              || { echo "MISSING: src/"; exit 1; }
+          test -f src/main.tsx     || { echo "MISSING: src/main.tsx"; exit 1; }
+          test -f src/Router.tsx   || { echo "MISSING: src/Router.tsx"; exit 1; }
+          test -d src/components   || { echo "MISSING: src/components/"; exit 1; }
+          test -d src/pages        || { echo "MISSING: src/pages/"; exit 1; }
+          test -d src/services     || { echo "MISSING: src/services/"; exit 1; }
+          test -d src/stores       || { echo "MISSING: src/stores/"; exit 1; }
+          echo "Core src structure present."
+
+      - name: Check required Zustand stores exist
+        run: |
+          test -f src/stores/auth.store.ts          || { echo "MISSING: src/stores/auth.store.ts"; exit 1; }
+          test -f src/stores/player.store.ts        || { echo "MISSING: src/stores/player.store.ts"; exit 1; }
+          test -f src/stores/notification.store.ts  || { echo "MISSING: src/stores/notification.store.ts"; exit 1; }
+          echo "Required Zustand stores present."
+
+      - name: Check Axios instance exists
+        run: |
+          test -f src/services/api/axiosInstance.ts || { echo "MISSING: src/services/api/axiosInstance.ts"; exit 1; }
+          echo "axiosInstance.ts present."
+
+      - name: Check route guards exist
+        run: |
+          test -f src/components/guards/PrivateRoute.tsx    || { echo "MISSING: src/components/guards/PrivateRoute.tsx"; exit 1; }
+          test -f src/components/guards/PublicOnlyRoute.tsx || { echo "MISSING: src/components/guards/PublicOnlyRoute.tsx"; exit 1; }
+          echo "Route guards present."
+
+      - name: Check test setup exists
+        run: |
+          test -f src/test/setup.ts || { echo "MISSING: src/test/setup.ts — Vitest setup file required"; exit 1; }
+          echo "Vitest setup file present."
+
+      - name: Check no hardcoded API URLs in axiosInstance
+        run: |
+          echo "Scanning axiosInstance.ts for hardcoded production URLs..."
+          if grep -qE "https://api\." src/services/api/axiosInstance.ts; then
+            echo "WARNING: Possible hardcoded production URL found in axiosInstance.ts"
+            grep -nE "https://api\." src/services/api/axiosInstance.ts || true
+          else
+            echo "No hardcoded production URLs detected in axiosInstance.ts."
+          fi
+
+  # JOB 2 — Lint and type check
+  lint-and-typecheck:
+    name: Lint & Type Check
+    runs-on: ubuntu-latest
+    needs: validate-structure
+
+    steps:
+      - name: Checkout frontend repo
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run ESLint
+        run: |
+          npm run lint || {
+            echo "ESLint failed — fix all lint errors before merging to dev."
+            exit 1
+          }
+
+      - name: Run TypeScript type check
+        run: |
+          npx tsc -b --noEmit || {
+            echo "TypeScript type check failed — fix all type errors before merging to dev."
+            exit 1
+          }
+
+  # JOB 3 — Vite build
+  build:
+    name: Vite Build
+    runs-on: ubuntu-latest
+    needs: lint-and-typecheck
+
+    steps:
+      - name: Checkout frontend repo
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build with Vite
+        env:
+          VITE_API_URL: http://localhost:8080/api/v1
+          VITE_RECAPTCHA_SITE_KEY: ${{ secrets.VITE_RECAPTCHA_SITE_KEY }}
+          VITE_GOOGLE_CLIENT_ID: ${{ secrets.VITE_GOOGLE_CLIENT_ID }}
+        run: npm run build
+
+      - name: Confirm dist was produced
+        run: |
+          test -d dist || { echo "dist/ not found — Vite build may have silently failed."; exit 1; }
+          test -f dist/index.html || { echo "dist/index.html missing — build output is incomplete."; exit 1; }
+          echo "Vite build output confirmed."
+
+      - name: Upload build artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: frontend-dev-build
+          path: dist/
+          retention-days: 3