Coaching Platform

# Coaching Platform

## Overview

This is a full-stack coaching platform that connects students with coaches for skill-based learning sessions. The application facilitates appointment booking, real-time messaging, payment processing, and comprehensive admin management. Built with modern web technologies, it features role-based authentication for coaches, students, and administrators.

## System Architecture

### Frontend Architecture
- **Framework**: React 18 with TypeScript
- **Build Tool**: Vite for fast development and optimized builds
- **UI Library**: Radix UI components with shadcn/ui design system
- **Styling**: Tailwind CSS with custom vintage-inspired theme (navy blue, cream beige, warm orange palette)
- **State Management**: TanStack Query for server state, React Context for authentication
- **Routing**: Wouter for lightweight client-side routing
- **Form Handling**: React Hook Form with Zod validation

### Backend Architecture
- **Runtime**: Node.js with Express.js server
- **Language**: TypeScript throughout the stack
- **Database**: PostgreSQL with Drizzle ORM
- **Authentication**: Passport.js with local strategy using scrypt for password hashing
- **Session Management**: Express sessions with PostgreSQL store
- **Real-time Communication**: WebSocket server for chat functionality
- **File Handling**: Base64 encoding for document uploads

## Key Components

### Authentication System
- Role-based access control (coach, student, admin)
- Account security features including failed login tracking and account freezing
- Session-based authentication with persistent login state
- Password hashing using Node.js crypto.scrypt

### Coach Management
- Coach profile creation with skills, bio, and qualifications
- Verification system requiring document uploads and admin approval
- Schedule management with time slot creation and availability tracking
- Analytics dashboard showing appointment stats and income metrics

### Appointment System
- Flexible booking system with date/time selection
- Status tracking (pending, confirmed, cancelled, completed)
- Attendance tracking with present/absent/excused options
- Feedback system for completed sessions

### Real-time Messaging
- WebSocket-based chat system between coaches and students
- Conversation management with message history
- Connection status tracking and automatic reconnection
- User presence indicators

### Admin Panel
- User management with role assignment and account status control
- Platform settings configuration (fees, booking limits, allowed skills)
- Coach verification workflow with document review
- System analytics and overview dashboard

### Payment Integration
- Stripe integration for payment processing
- Platform fee calculation and collection
- Payment method document verification for coaches

## Data Flow

1. **User Registration**: Users register with role selection, coaches enter verification queue
2. **Coach Verification**: Admins review coach applications and uploaded documents
3. **Schedule Creation**: Verified coaches create availability time slots
4. **Appointment Booking**: Students browse coaches and book available slots
5. **Real-time Communication**: WebSocket connections enable chat between parties
6. **Session Completion**: Attendance tracking and feedback collection post-session
7. **Payment Processing**: Stripe handles payments with platform fee deduction

## External Dependencies

### Core Framework Dependencies
- **React Ecosystem**: React 18, React DOM, React Hook Form, TanStack Query
- **UI Components**: Radix UI primitives, Lucide React icons
- **Development Tools**: Vite, TypeScript, ESBuild for production builds

### Backend Dependencies
- **Database**: @neondatabase/serverless, Drizzle ORM, connect-pg-simple
- **Authentication**: Passport.js with local strategy
- **Communication**: ws for WebSocket server
- **Validation**: Zod for schema validation

### Third-party Services
- **Payment Processing**: Stripe (@stripe/stripe-js, @stripe/react-stripe-js)
- **Email Service**: SendGrid (@sendgrid/mail)
- **Database Hosting**: Neon PostgreSQL (serverless)

## Deployment Strategy

### Development Environment
- **Platform**: Replit with Node.js 20 runtime
- **Database**: PostgreSQL 16 module
- **Build Process**: `npm run dev` starts development server with hot reload
- **Port Configuration**: Development server on port 5000, external port 80

### Production Build
- **Frontend**: Vite builds optimized static assets to `dist/public`
- **Backend**: ESBuild bundles server code to `dist/index.js`
- **Database**: Drizzle migrations applied via `npm run db:push`
- **Deployment Target**: Google Cloud Run
- **Production Start**: `node production.js` - builds and starts production server

### Deployment Configuration
- **Production Script**: `production.js` handles building and starting the application
- **Build Process**: Backend builds fast (18ms), frontend with 5-minute timeout
- **Fallback Mode**: If frontend build fails/times out, uses hybrid mode with Vite dev server
- **Environment**: NODE_ENV=production, PORT from environment or 5000

### Environment Configuration
- **Database Connection**: `DATABASE_URL` environment variable required
- **Session Security**: `SESSION_SECRET` for session encryption
- **Stripe Keys**: Payment processing requires Stripe API keys
- **SendGrid**: Email service configuration for notifications

## Changelog

- June 24, 2025. Initial setup
- June 24, 2025. Project startup confirmed working - server running on port 5000 with all components initialized
- July 13, 2025. Fixed credit purchase approval functionality - resolved API parameter mismatch between frontend and backend, updated HTTP method from POST to PATCH, corrected status value mapping from 'approve'/'reject' to 'approved'/'rejected'
- July 13, 2025. Successfully implemented dual payment system - reverted coach-related pages to use HKD currency while maintaining student credit system, enabling both payment methods to coexist simultaneously
- July 14, 2025. Removed credit purchase functionality from coach dashboard - coaches no longer have access to purchase credits page through sidebar links or direct routing, maintaining credit purchase access only for students and administrators
- July 14, 2025. Hidden credit balance display from coach sidebar - coaches no longer see credit balance information in their sidebar, focusing their dashboard on coaching-specific features only
- July 14, 2025. Enhanced payment system and analytics terminology - added "Credit" to payment method options in coach payment methods component, updated analytics dashboard terminology from "Credits" to "Income" and "HKD", enhanced chart formatting to show HKD currency format in tooltips and axis labels for better clarity
- July 15, 2025. Updated homepage styling to match logged-in dashboard theme - implemented vintage-inspired color scheme with navy blue, cream beige, and warm orange palette, matching the dashboard's background patterns and styling consistency
- July 15, 2025. Enhanced password validation with comprehensive security requirements - added password strength indicator with real-time validation feedback, requires 8+ characters with uppercase, lowercase, numbers, and special characters, displays visual strength meter and requirement checklist
- July 15, 2025. Fixed coach verification functionality in admin panel - corrected API endpoints to use coach-registration-forms table for pending applications, updated frontend to display registration details properly, verified complete approval/rejection flow including user role updates and coach profile creation
- July 15, 2025. Fixed deployment security issue - created production-ready deployment system with `production.js` entry point to replace blocked "dev" command, implemented fast backend build (18ms) with frontend build timeout handling, added fallback hybrid mode for reliable deployment on Replit platform
- July 15, 2025. Resolved deployment configuration for Replit security restrictions - updated production.js to handle missing frontend build directory gracefully, implemented background frontend build with hybrid mode fallback, ensured deployment uses production entry point instead of dev commands
- July 15, 2025. Fixed deployment internal server error - created multiple deployment entry points (main.js, index.js, deploy.js) to handle Replit's deployment system, fixed static file serving fallback to development mode when frontend build is missing, confirmed backend builds successfully in 23ms and server starts correctly on production mode
- July 15, 2025. Completed deployment configuration testing and optimization - created comprehensive deployment scripts (start.js, replit-deploy.js, main.js) with proper error handling, tested backend build process (28ms), confirmed server starts successfully on production mode with graceful fallback to development mode for frontend serving, verified API endpoints work correctly in production environment
- July 15, 2025. Successfully improved dark mode implementation - overhauled color scheme with better contrast and warmer colors, added dark mode toggle to public pages (home and auth), fixed coach card styling with theme-aware classes, updated Button and Select components for proper dark mode compatibility, enhanced light mode with warm cream-beige background instead of white for better vintage aesthetic
- July 15, 2025. Comprehensive dark mode fixes applied across all authenticated pages - updated student coaches page, credits page, auth page, and verification components to use theme-aware CSS classes (text-foreground, text-muted-foreground, bg-card, bg-background) instead of hardcoded colors (text-gray-*, bg-gray-*, text-blue-*, etc), enhanced status badges and error states with dark mode variants, applied consistent theming across all user-facing components for seamless light/dark mode experience
- July 16, 2025. Implemented complete password reset functionality - added password_reset_tokens database table with 1-hour expiration, created backend API endpoints for reset request and confirmation, built frontend forms for forgot password and reset password flows, integrated "Forgot Password" link in auth page, fixed token generation issues and improved error handling to show "Incorrect username" for non-existent users while maintaining security in production
- July 17, 2025. Fixed chat message sender name display issue - corrected MessageList component logic where coach messages were incorrectly showing "Student1" instead of the actual coach name, now properly displays sender names based on user role and message ownership
- July 18, 2025. Removed Stripe payment library from codebase - uninstalled @stripe/react-stripe-js, @stripe/stripe-js, and stripe packages, removed stripe-related database columns and API methods, updated coach membership system to use only PayMe and FPS payment methods
- July 22, 2025. Enhanced qualification preview functionality for students - added qualification preview to coach cards on homepage and authenticated views, improved DocumentViewer component with prominent Preview and Download buttons, enhanced CoachQualificationDocs component with better card layout and clearer document display, provides students easy access to view coach credentials before booking
- July 22, 2025. Added preview-only functionality for non-authenticated users - created DocumentViewerPublic and CoachQualificationDocsPublic components for public coach viewing, enables document preview without download capability for visitors, includes "Sign in to download" messaging to encourage user registration

## User Preferences

Preferred communication style: Simple, everyday language.