- Created example-shared-components.html to demonstrate TypeScript-based shared header and footer components.
- Added original-style.css for theming with CSS variables and dark mode support.
- Introduced style-backup.css for legacy styles.
- Developed test-refactored.html for testing map components with Leaflet integration.
- Updated deployment documentation to reflect changes in log file paths and service names.
- Renamed project from "great-lakes-ice-report" to "icewatch" in package.json and package-lock.json.
- Updated Caddyfile for new log file path.
- Added S3 bucket policy for public read access to greatlakes-conditions.
- Removed old service file and created new systemd service for icewatch.
- Add build-time version generation script that captures git commit info
- Create /api/version endpoint to serve version data
- Add version footer component showing commit SHA, date, and branch
- Link version SHA to commit on git.deco.sh for easy navigation
- Fix footer text duplication issue with i18n translations
- Disable mouse wheel zoom on map, require +/- buttons for better UX
- Update service worker cache to v4 with new version-footer.js
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Set up esbuild for fast TypeScript compilation of frontend code
- Create SharedHeader component with factories for main/admin/privacy pages
- Create SharedFooter component with standard and minimal variants
- Add frontend build scripts (build:frontend, watch:frontend, dev:full)
- Configure TypeScript for browser environment with DOM types
- Add example page demonstrating shared component usage
- Update .gitignore to exclude compiled frontend files
Benefits:
- Type-safe frontend components
- Consistent headers/footers across all pages
- Single source of truth for common UI elements
- Built-in i18n and theme toggle support
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
This major feature introduces complete internationalization architecture with Spanish (Mexico) as the first additional language:
## New Features:
- **I18n Architecture**: Complete client-side and server-side internationalization system
- **Spanish (Mexico) Support**: Full es-MX translations for all user-facing text
- **Language Selector**: Dynamic language switching UI component in header
- **API Endpoints**: RESTful endpoints for serving translations (/api/i18n)
- **Progressive Enhancement**: Language detection via Accept-Language header and cookies
## Technical Implementation:
- **Frontend**: Client-side i18n.js with automatic DOM translation and language selector
- **Backend**: Server-side i18n service with locale detection middleware
- **Build Process**: Automated copying of translation files to dist/ directory
- **Responsive Design**: Language selector integrated into header controls layout
## Files Added:
- public/i18n.js - Client-side internationalization library
- src/i18n/index.ts - Server-side i18n service
- src/i18n/locales/en.json - English translations
- src/i18n/locales/es-MX.json - Spanish (Mexico) translations
- src/routes/i18n.ts - API endpoints for translations
## Files Modified:
- package.json - Updated build process to include i18n files
- public/index.html - Added i18n attributes and language selector
- public/app.js - Integrated dynamic translation updates
- src/server.ts - Added locale detection middleware
- src/scss/pages/_index.scss - Language selector styling
This implementation supports easy addition of future languages and maintains backward compatibility while providing a seamless multilingual experience.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Implement MapImageService using Mapbox Static Images API
- Add server-side /table route with HTML form submission
- Generate static map images with auto-fit positioning based on actual location coordinates
- Add progressive enhancement with noscript fallbacks and Basic View button
- Update map center coordinates to proper Grand Rapids location
- Add numbered pins with color coding (red for regular, orange for persistent reports)
- Remove server-side caching to ensure fresh map images
- Fix theme toggle icon centering in CSS mixins
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Configure Jest for TypeScript testing with ts-jest preset
- Create comprehensive unit tests for Location model (15 tests)
- Create comprehensive unit tests for ProfanityWord model (16 tests)
- Create comprehensive unit tests for ProfanityFilterService (30+ tests)
- Create integration tests for public API routes (18 tests)
- Add test database setup and teardown utilities
- Configure coverage reporting with 80% threshold
- Install testing dependencies (@types/jest, ts-jest, @types/supertest)
Test Coverage:
- Location model: Full CRUD operations, validation, cleanup
- ProfanityWord model: Full CRUD operations, constraints, case handling
- ProfanityFilterService: Text analysis, custom words, filtering
- Public API routes: Configuration, location reporting, error handling
- Request validation: JSON parsing, content types, edge cases
Features:
- In-memory SQLite databases for isolated testing
- Comprehensive test setup with proper cleanup
- Mock profanity filters for controlled testing
- Type-safe test implementations with TypeScript
- Detailed test scenarios for edge cases and error conditions
All tests passing: 67 total tests across models and integration
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Install swagger-ui-express and swagger-jsdoc dependencies
- Create comprehensive OpenAPI 3.0 specification with detailed schemas
- Add interactive Swagger UI at /api-docs endpoint
- Document all public API endpoints (/api/config, /api/locations)
- Document admin authentication and management endpoints
- Include comprehensive request/response schemas and examples
- Add authentication documentation for admin endpoints
- Update CLAUDE.md with API documentation information
Features:
- Complete API specification with OpenAPI 3.0 standard
- Interactive documentation interface with Swagger UI
- Detailed request/response examples for all endpoints
- Authentication flows for admin functionality
- Error response documentation with examples
- Type-safe integration with existing TypeScript architecture
API Documentation available at: /api-docs
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Convert entire backend to TypeScript with strict type checking
- Add comprehensive type definitions and interfaces
- Create typed models for Location and ProfanityWord with database operations
- Convert all services to TypeScript (DatabaseService, ProfanityFilterService)
- Convert all API routes with proper request/response typing
- Add TypeScript build system and development scripts
- Update package.json with TypeScript dependencies and scripts
- Configure tsconfig.json with strict typing and build settings
- Update CLAUDE.md documentation for TypeScript development
- Add .gitignore rules for TypeScript build artifacts
Architecture improvements:
- Full type safety throughout the application
- Typed database operations and API endpoints
- Proper error handling with typed exceptions
- Strict optional property handling
- Type-safe dependency injection for routes
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added public/style.css to .gitignore
- Removed style.css from git tracking (git rm --cached)
- Enhanced package.json scripts for better CSS workflow:
- postinstall: Auto-builds CSS on npm install
- build-css:dev: Development build with source maps
- start: Now builds CSS before starting server
- dev: Builds CSS before development mode
- Updated README with CSS development documentation
- Explains SCSS organization and build process
- Documents all CSS-related npm scripts
Benefits:
✅ Cleaner repository (no generated files)
✅ Prevents merge conflicts in generated CSS
✅ Automatic CSS generation on new machine setup
✅ Source of truth is SCSS files only
✅ Consistent build process across environments
- Resolved conflicts in admin.html to keep CSS optimization changes
- Regenerated package-lock.json after merge
- All features from both branches are now integrated
## Major CSS/SCSS Improvements
- ✅ Set up modular SCSS architecture with variables, mixins, and components
- ✅ Created organized directory structure: src/scss/ with variables, mixins, pages/
- ✅ Removed ~300+ lines of inline CSS from admin.html
- ✅ Added comprehensive design system with consistent spacing, colors, typography
- ✅ Created reusable mixins for buttons, cards, tables, forms, and layouts
- ✅ Implemented responsive breakpoint mixins for mobile/tablet/desktop
- ✅ Added utility classes for common layouts and spacing
## Build System
- ✅ Added sass and concurrently as dev dependencies
- ✅ Created npm scripts: build-css, watch-css, dev-with-css
- ✅ Automated SCSS compilation to compressed CSS
- ✅ Set up development workflow with CSS watching
## Admin Panel Enhancements
- ✅ Added complete tab navigation system (Location Reports + Profanity Filter)
- ✅ Integrated profanity management UI with forms and tables
- ✅ Consistent styling across all components using SCSS mixins
- ✅ Improved responsive design for mobile devices
## Benefits
- 🎯 Maintainable: All styles centralized in modular SCSS files
- 📱 Responsive: Better mobile experience with consistent breakpoints
- 🎨 Consistent: Design system ensures visual consistency
- ⚡ Efficient: Compressed CSS output, no inline styles
- 🔧 Developer-friendly: Easy to extend and modify styles
The application now has professional-grade CSS architecture that's easy to maintain and extend.
- Create dedicated ProfanityFilter class with isolated SQLite database
- Separate profanity.db from main application database to prevent SQLITE_MISUSE errors
- Add comprehensive custom word management (CRUD operations)
- Implement advanced profanity detection with leetspeak and pattern matching
- Add admin UI for managing custom profanity words
- Add extensive test suites for both profanity filter and API routes
- Update server.js to use isolated profanity filter
- Add proper database initialization and cleanup methods
- Support in-memory databases for testing
Breaking changes:
- Profanity filter now uses separate database file
- Updated admin API endpoints for profanity management
- Enhanced profanity detection capabilities
- Updated all static asset URLs to use iceymi.b-cdn.net CDN
- Changed favicon, CSS, and JS file references in index.html, admin.html, and privacy.html
- API calls remain pointed to origin server for dynamic content
- Ready for CDN deployment with proper cache separation
