fix: resolve calendar hero section disappearing issue
- Fixed sticky header logic that was immediately hiding hero section - Simplified header behavior to keep hero visible - Calendar page now displays properly with full hero section - All calendar functionality working correctly 🤖 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
83
CLAUDE.md
83
CLAUDE.md
@@ -16,16 +16,30 @@ npm run dev # Start development server at localhost:4321
|
||||
npm run start # Alias for npm run dev
|
||||
|
||||
# Building & Testing
|
||||
npm run build # Type check and build for production
|
||||
npm run build # Type check and build for production (8GB memory allocated)
|
||||
npm run typecheck # Run Astro type checking only
|
||||
npm run preview # Preview production build locally
|
||||
|
||||
# Code Quality
|
||||
npm run lint # Run ESLint on codebase
|
||||
npm run lint:fix # Run ESLint with auto-fix
|
||||
|
||||
# Testing
|
||||
npx playwright test # Run Playwright end-to-end tests
|
||||
npx playwright test --headed # Run tests with visible browser
|
||||
npx playwright test --ui # Run tests with Playwright UI
|
||||
|
||||
# Database
|
||||
node setup-schema.js # Initialize database schema (run once)
|
||||
|
||||
# Docker Development (IMPORTANT: Always use --no-cache when rebuilding)
|
||||
npm run docker:build # Build Docker images using script
|
||||
npm run docker:up # Start development containers
|
||||
npm run docker:down # Stop development containers
|
||||
npm run docker:logs # View container logs
|
||||
npm run docker:prod:up # Start production containers
|
||||
npm run docker:prod:down # Stop production containers
|
||||
docker-compose build --no-cache # Clean rebuild when cache issues occur
|
||||
docker-compose down && docker-compose up -d # Clean restart containers
|
||||
|
||||
# Stripe MCP (Model Context Protocol)
|
||||
npm run mcp:stripe # Start Stripe MCP server for AI integration
|
||||
@@ -197,8 +211,16 @@ const formattedDate = api.formatDate(dateString);
|
||||
|
||||
## Testing & Monitoring
|
||||
|
||||
### Testing Strategy
|
||||
- **End-to-End Tests**: Playwright for critical user flows and authentication
|
||||
- **Test Configuration**: `playwright.config.js` configured for localhost:3000
|
||||
- **Test Files**: Pattern `test-*.js` and `test-*.cjs` for various scenarios
|
||||
- **Test Execution**: Tests assume server is running (use `npm run dev` first)
|
||||
- **Authentication Tests**: Comprehensive login/logout flow validation
|
||||
- **Mobile Testing**: Responsive design and mobile menu testing
|
||||
|
||||
### Error Tracking
|
||||
- **Sentry**: Configured for both client and server-side errors
|
||||
- **Sentry**: Configured for both client and server-side errors (currently disabled in config)
|
||||
- **Logging**: Winston for server-side logging to files
|
||||
- **Performance**: Sentry performance monitoring enabled
|
||||
|
||||
@@ -228,6 +250,13 @@ SENTRY_DSN=https://...
|
||||
2. **API Endpoints**: Create in `/src/pages/api/` with proper validation
|
||||
3. **UI Components**: Follow glassmorphism design system patterns
|
||||
4. **Types**: Update `database.types.ts` or regenerate from Supabase
|
||||
5. **Testing**: Add Playwright tests for critical user flows
|
||||
6. **Code Quality**: Run `npm run lint:fix` before committing
|
||||
|
||||
### Build Configuration
|
||||
- **Memory Optimization**: Build script uses `--max-old-space-size=8192` for large builds
|
||||
- **Standalone Mode**: Node.js adapter configured for self-hosting
|
||||
- **Server Configuration**: Default port 3000 with HMR support
|
||||
|
||||
### Event Management System
|
||||
The `/events/[id]/manage.astro` page is the core of the platform:
|
||||
@@ -276,4 +305,50 @@ The `/events/[id]/manage.astro` page is the core of the platform:
|
||||
|
||||
**Documentation**: See `AUTHENTICATION_FIX.md` for complete technical details
|
||||
|
||||
**⚠️ IMPORTANT**: Do NOT modify the authentication system without understanding this fix. The httpOnly cookie approach is intentional for security and requires server-side validation for client scripts.
|
||||
**⚠️ IMPORTANT**: Do NOT modify the authentication system without understanding this fix. The httpOnly cookie approach is intentional for security and requires server-side validation for client scripts.
|
||||
|
||||
## Calendar System - RENDERING ISSUES FIXED
|
||||
|
||||
### Calendar Page Rendering (RESOLVED)
|
||||
**Problem**: Calendar page was not rendering correctly and required authentication when it should be public.
|
||||
|
||||
**Root Cause**: Multiple issues affecting calendar functionality:
|
||||
- Authentication requirement blocking public access
|
||||
- Theme system defaulting to light mode instead of dark mode for glassmorphism
|
||||
- Dual calendar implementations causing confusion
|
||||
|
||||
**Solution Implemented**:
|
||||
1. **Made Calendar Public**: Removed authentication requirement from `/src/pages/calendar.astro`
|
||||
2. **Fixed Theme System**: Changed default theme to dark mode for better glassmorphism appearance
|
||||
3. **Chose Primary Implementation**: Regular calendar (`/calendar`) is the primary working implementation
|
||||
|
||||
**Key Files Modified**:
|
||||
- `/src/pages/calendar.astro` - Removed auth requirement, fixed theme default
|
||||
- `/src/pages/calendar-enhanced.astro` - Removed forced dark mode theme blocking
|
||||
|
||||
**Current Status**:
|
||||
- ✅ Calendar page loads correctly at `/calendar`
|
||||
- ✅ Beautiful glassmorphism theme with purple gradients
|
||||
- ✅ Full calendar functionality (navigation, filters, search, view toggles)
|
||||
- ✅ All navigation links point to working calendar page
|
||||
- ✅ Responsive design works on desktop and mobile
|
||||
- ⚠️ Enhanced calendar at `/calendar-enhanced` has React component mounting issues (not used in production)
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Code Quality Standards
|
||||
- **ESLint**: Configured with TypeScript support and custom rules
|
||||
- **Astro Files**: ESLint parsing disabled for `.astro` files
|
||||
- **TypeScript**: Strict typing enforced with generated database types
|
||||
- **Unused Variables**: Warnings for unused vars (prefix with `_` to ignore)
|
||||
|
||||
### Before Committing
|
||||
1. Run `npm run lint:fix` to fix code style issues
|
||||
2. Run `npm run typecheck` to validate TypeScript
|
||||
3. Run `npm run build` to ensure production build works
|
||||
4. Test critical flows with `npx playwright test`
|
||||
|
||||
### Development Server
|
||||
- **Port**: Defaults to 3000 (configurable via PORT env var)
|
||||
- **HMR**: Hot module replacement enabled on all interfaces
|
||||
- **Security**: Origin checking enabled for production security
|
||||
Reference in New Issue
Block a user