TeamMate is a comprehensive web-based attendance and shift management system designed for teams and organizations. The application provides real-time team collaboration, shift scheduling, attendance tracking, overtime management, and time-off requests - all in a modern, responsive interface.
Problem Statement:
Managing team attendance, shifts, and schedules manually is time-consuming and error-prone. Organizations need a centralized system to track employee attendance, manage complex shift schedules, handle overtime and time-off requests efficiently, and provide role-based access control.
Key Features:
- Authentication & User Management: Google Sign-In with Firebase, automatic user profile creation, session persistence, and role-based access control (Owner, Admin, Member).
- Team Management: Create and manage multiple teams, team avatars, archive/unarchive teams, and URL-based team routing with slugs.
- Member Management: Add members via email invitation, edit roles, bulk operations, import/export (CSV, Excel, PDF), and filter/sort capabilities.
- Shift Template Management: Create custom shift templates with color-coding, define shift hours, and assign shifts to team members.
- Schedule Management: Monthly calendar grid view (Excel-like interface), drag-and-drop shift assignment, real-time updates, and export to Excel/PDF.
- Attendance Tracking: Clock In/Out functionality, face detection integration (UI ready), attendance history, late/early tracking, and holiday management.
- Overtime & Time Off: Request and approve overtime/time-off with status tracking, multiple leave categories, and balance tracking.
Tech Stack:
- Frontend: Kotlin/JS, kotlinx-html DSL, Kotlin Wrappers, Vanilla CSS
- Backend: Firebase Authentication, Cloud Firestore, Firebase Storage
- Build Tools: Gradle (Kotlin DSL), Webpack
- Testing: Playwright for E2E testing
- Deployment: Vercel
Architecture:
The project follows a clean, feature-based architecture with Domain-Driven Design (DDD), Repository Pattern, centralized state management, and caching strategy that reduces Firestore reads by ~80%.
Performance & Security:
- Comprehensive Firestore security rules with role-based permissions
- In-memory caching with TTL (5 minutes default)
- Bundle size optimization with Webpack tree-shaking
- Initial load < 2 seconds on 3G connection