Codev Support Chat

This repository contains the implementation of a standalone PHP live support chat system optimized for shared hosting.

• Backend: PHP 8.1+ with Slim Framework 4
• Frontend: Vue.js 3 via Vite, Tailwind CSS
• Database: MySQL 5.7+/MariaDB 10.3+

Getting started instructions will be added as components are implemented.

Testing

• Backend (PHP): PHPUnit/Pest. Run: composer test
• Frontend (Vue): Vitest. Run: npm run test
• E2E (Widget/Admin): Playwright. Run: npm run e2e

All tests and debug helpers reside in /tests.

Local test tips

• PHP Composer SSL behind corporate proxy: set env COMPOSER_DISABLE_SSL=1 and in composer.json config.secure-http=false (already set). Prefer configuring corporate CA where possible.
• API integration tests use in-memory SQLite via test app factory; no MySQL needed.

CI example (GitHub Actions)

name: tests
on: [push, pull_request]
jobs:
  php-js:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: shivammathur/setup-php@v2
        with:
          php-version: '8.2'
          coverage: none
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
      - run: composer install --no-interaction
      - run: npm ci
      - run: npm run test --silent
      - run: composer test

Phase 2 Deployment (Admin SPA)

1. Install PHP dependencies:
   • composer install --no-dev --optimize-autoloader
2. Install Node dependencies:
   • npm install
3. Build admin SPA:
   • npm run build:admin
   • Output: admin/dist/
4. Configure Apache:
   • Ensure mod_rewrite is enabled
   • Use provided .htaccess (routes /api/* to PHP, /admin/* to SPA)
5. Environment:
   • Copy .env.example to .env and set DB/JWT secrets
6. Test:
   • /api/healthz returns { ok: true }
   • /admin/ loads SPA

Phase 3 (Widget) - MVP

Embed on any page:

<script>
  window.CodevChatConfig = { apiUrl: '/api', position: 'bottom-right', autoOpen: false };
  // Optional: cssUrl to override widget CSS path
  // window.CodevChatConfig.cssUrl = '/widget/assets/css/widget.css';
  // Optional: theme, language, etc.
  // window.CodevChatConfig.theme = 'light';
  // window.CodevChatConfig.language = 'en';
  // window.CodevChatConfig.autoOpen = true;
  
</script>
<script src="/widget/widget.js"></script>
<link rel="stylesheet" href="/widget/assets/css/widget.css">

Endpoints used (mock/demo):

• GET /api/updates → returns mock message events
• POST /api/chat/send → echoes sent message payload

Notes:

• This is a demo MVP: no persistence yet, no auth/session binding, and simple polling.
• Suitable for UI/demo; production features will be added in the next phases.

CORS for external embedding

• Set CORS_ALLOWED_ORIGINS in .env (comma-separated) when embedding on a different domain.
• The API handles OPTIONS preflight and sets Access-Control-Allow-Origin if the origin matches.

Example page

• See examples/widget-embed.html for a local test page.

Phase 5 (Deployment)

• See Doc/DEPLOYMENT.md for end-to-end deployment steps, environment variables, and hardening checklist.

Stage 6 (QA/Observability)

• Request IDs: every response includes X-Request-Id.
• Rate limiting for public endpoints (/api/updates, /api/chat/send, /api/widget/session) with default 60 req/min per IP.
• Metrics: GET /api/metrics returns basic health metrics.