Skip to content

Commit 12b03a5

Browse files
authored
Feature/basic period tracking (#1)
* feat: setup period table and period queries * feat: create endpoint to manage period logs * feat: create basic UI for period tracking * refactor: create auth guard, modules for business logic and use import path alias * chore: setup backend request logging * feat: Add Vitest testing infrastructure for Hono backend * refactor: turn period tracker queries functions into a service class instead * feat: add period tracker route tests Adds comprehensive unit tests for the period tracker routes, covering success, invalid input, and failure scenarios. These tests ensure the correct behavior of the API endpoints. * Refactor database and auth initialization - Initialize the database connection outside of the request handlers. - Pass the database instance to the services and routes. - Initialize `betterAuth` outside of routes. - Remove context from `getEnv` and initialize it once. - Add timing middleware.
1 parent a10f4a3 commit 12b03a5

43 files changed

Lines changed: 3533 additions & 73 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

PRD.md

Lines changed: 359 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,359 @@
1+
# Period Tracker App - Product Requirements Document
2+
3+
## 1. Product Overview
4+
5+
### Vision
6+
Create a fast, intuitive, and offline-capable period tracking app that helps young women understand their reproductive health while providing a delightful user experience across devices.
7+
8+
### Target Users
9+
- **Primary:** Teenagers and young adults (13-25 years)
10+
- **Experience Level:** Mostly beginners to period tracking
11+
- **Current Solutions:** Basic health watch tracking, spreadsheets, or no tracking
12+
- **Primary Use Cases:** General health awareness, avoiding pregnancy, reproductive health education
13+
14+
### Core Value Proposition
15+
- Lightning-fast logging experience (< 30 seconds)
16+
- Works seamlessly offline with poor internet connectivity
17+
- Simple, beautiful interface designed for young women
18+
- Basic predictions and health insights
19+
- Educational resources for reproductive health
20+
21+
## 2. Technical Architecture
22+
23+
### Tech Stack
24+
- **Frontend:** Vite + React SPA + TypeScript
25+
- **Backend:** Hono + TypeScript with Hono RPC
26+
- **Database:** Turso (serverless SQLite)
27+
- **ORM:** Drizzle ORM
28+
- **Styling:** Tailwind CSS + DaisyUI (Valentine theme)
29+
- **Components:** Radix UI (headless components for complex logic)
30+
- **Monorepo:** pnpm workspaces
31+
- **Data Fetching:** React Query (TanStack Query) + Hono RPC client
32+
- **Validation:** Zod schemas (shared between frontend and backend)
33+
- **Architecture:** Monorepo with shared types and validation schemas
34+
- **Authentication:** Better Auth with Google OAuth
35+
- **Logging:** Winston (backend) + Console overrides (frontend)
36+
- **Linting:** ESLint + ESLint Stylistic (formatting and linting)
37+
- **CI/CD:** GitHub Actions
38+
- **Deployment:** Vercel/Cloudflare (frontend), Fly.io/Railway (backend)
39+
- **PWA:** Service Worker + Web App Manifest
40+
41+
### Data Strategy
42+
- **Approach:** Cloud-first with aggressive local caching via React Query
43+
- **Type Safety:** End-to-end type safety with Hono RPC + Zod validation
44+
- **Offline Strategy:** React Query cache + service worker for offline reads
45+
- **Cross-device:** Full sync across devices via React Query synchronization
46+
- **Performance Target:** < 1 second load times with optimistic updates
47+
48+
### Data Model (Drizzle Schema + Zod Validation)
49+
- use drizzle schema with Zod validation and make sure the types flow through the app using hono RPC
50+
- use tanstack query hooks for fetching data and making mutations and managing cache
51+
52+
## 3. MVP Features
53+
### 3.1 Essential Features (Phase 1)
54+
1. **User Authentication**
55+
- Google OAuth login
56+
- Basic profile setup
57+
- Account deletion capability
58+
59+
2. **Period Tracking**
60+
- Start/stop period logging
61+
- Flow intensity tracking (1-5 scale)
62+
- Calendar view of cycles
63+
64+
3. **Symptom Logging**
65+
- Quick 1-5 scale for: Flow, Mood, Pain, Energy, Bloating, Cravings
66+
- Optional notes field
67+
- Medication tracking (free text)
68+
69+
4. **Basic Predictions**
70+
- Next period start date
71+
- Cycle length averages
72+
- Simple confidence indicators
73+
74+
5. **Offline Capability**
75+
- Service worker for offline functionality
76+
- Local data caching
77+
- Sync queue for when online
78+
79+
6. **Static FAQ**
80+
- Common period questions
81+
- Health education content
82+
- Search functionality
83+
84+
### 3.2 Nice-to-Have Features (Phase 2)
85+
1. **Partner Sharing**
86+
- Read-only access for partners
87+
- Shareable cycle calendar
88+
- Privacy controls
89+
90+
2. **Enhanced Analytics**
91+
- Cycle pattern analysis
92+
- Symptom correlation insights
93+
- Historical comparisons
94+
95+
3. **Fertility Tracking**
96+
- Ovulation predictions
97+
- Fertile window indicators
98+
- Conception probability
99+
100+
## 4. User Experience Requirements
101+
102+
### Design Principles
103+
- **Minimalist:** Clean, uncluttered interface using DaisyUI Valentine theme
104+
- **Fast:** Quick interactions, instant feedback with Tailwind utilities
105+
- **Empathetic:** Supportive tone, educational, warm pink/red color palette
106+
- **Accessible:** Radix UI primitives ensure proper accessibility
107+
- **Modern:** Contemporary design trends for young women, cohesive Valentine theme
108+
109+
### Key User Flows
110+
111+
#### Quick Logging Flow
112+
1. Open app → Auto-loads to today's view
113+
2. One-tap period start/stop
114+
3. Optional: Quick symptom sliders (< 15 seconds)
115+
4. Auto-save with visual confirmation
116+
117+
#### Analysis Flow
118+
1. Navigate to calendar view
119+
2. See cycle history and patterns
120+
3. View predictions for next period
121+
4. Access detailed cycle insights
122+
123+
### Performance Requirements
124+
- **Initial Load:** < 1 second
125+
- **Offline Functionality:** Full logging capability
126+
- **Sync Time:** < 3 seconds when back online
127+
- **PWA Score:** > 90 on Lighthouse
128+
129+
## 5. Development Roadmap
130+
131+
### Priority 1: Core Foundation
132+
**Essential infrastructure and basic functionality**
133+
134+
**Project Setup & Infrastructure**
135+
- [ ] Initialize pnpm workspace monorepo (packages: frontend, backend, shared)
136+
- [ ] Set up TypeScript configurations across all packages
137+
- [ ] Configure Tailwind CSS + DaisyUI (Valentine theme) in frontend
138+
- [ ] Set up development environment with hot reload and workspace linking
139+
- [ ] Configure ESLint + ESLint Stylistic for all packages
140+
- [ ] Set up GitHub Actions workflow for CI/CD
141+
- [ ] Configure Winston logger for backend with structured logging
142+
- [ ] Set up console logging overrides for frontend development
143+
- [ ] Create shared Zod validation schemas package
144+
145+
**Database & Authentication**
146+
- [ ] Set up Turso database with Drizzle ORM and migrations
147+
- [ ] Create Zod schemas for all data models in shared package
148+
- [ ] Implement Better Auth with Google OAuth and validation
149+
- [ ] Set up Hono RPC routes with zValidator middleware
150+
- [ ] Create user management APIs with comprehensive error handling
151+
- [ ] Configure middleware (auth, CORS, request logging, Zod validation)
152+
- [ ] Environment configuration and secrets management across workspaces
153+
154+
**Core Period Tracking**
155+
- [ ] Design Drizzle schemas with Zod validation integration
156+
- [ ] Create period start/stop functionality with DaisyUI components
157+
- [ ] Set up React Query client with Hono RPC integration
158+
- [ ] Build calendar view component using Radix UI Calendar
159+
- [ ] Implement cycle calculation logic with Zod input validation
160+
- [ ] Create type-safe CRUD operations using Hono RPC + React Query
161+
- [ ] Add comprehensive error handling and loading states
162+
163+
### Priority 2: User Experience Essentials
164+
**Core features users need for basic functionality**
165+
166+
**Symptom Logging Interface**
167+
- [ ] Create symptom logging interface with DaisyUI sliders and Zod validation
168+
- [ ] Implement 1-5 scale components with optimistic updates via React Query
169+
- [ ] Build daily log view with Valentine theme colors and error boundaries
170+
- [ ] Connect symptom data to Hono RPC endpoints with type safety
171+
- [ ] Add notes and medication fields using DaisyUI forms + Zod schemas
172+
- [ ] Implement quick-entry shortcuts with keyboard navigation
173+
174+
**Predictions & Basic Analytics**
175+
- [ ] Implement cycle prediction algorithm with Zod input/output validation
176+
- [ ] Calculate average cycle length with confidence intervals and error handling
177+
- [ ] Build prediction display components using DaisyUI cards and React Query
178+
- [ ] Add confidence indicators with visual feedback and loading states
179+
- [ ] Create basic analytics dashboard with Tailwind grid and type-safe data
180+
- [ ] Implement error handling for insufficient data scenarios with user guidance
181+
182+
**PWA & Offline Capability**
183+
- [ ] Implement service worker with comprehensive caching strategy
184+
- [ ] Add web app manifest with Valentine theme assets and proper icons
185+
- [ ] Configure React Query for offline-first data management
186+
- [ ] Build offline indicators using DaisyUI alerts and network status
187+
- [ ] Test offline scenarios and implement retry logic with exponential backoff
188+
- [ ] Add conflict resolution for offline/online data synchronization
189+
190+
### Priority 3: Polish & Enhancement
191+
**Features that improve the experience but aren't essential for launch**
192+
193+
**UI/UX Polish & Accessibility**
194+
- [ ] Implement design system with DaisyUI Valentine theme
195+
- [ ] Responsive design optimization using Tailwind breakpoints
196+
- [ ] Accessibility improvements with Radix UI primitives
197+
- [ ] Loading states and error handling with DaisyUI components
198+
- [ ] User feedback animations and micro-interactions
199+
- [ ] Focus management and keyboard navigation
200+
- [ ] Screen reader testing and ARIA labels
201+
202+
**Content & Education**
203+
- [ ] Create static FAQ content with search functionality
204+
- [ ] Implement educational content with DaisyUI collapse components
205+
- [ ] Help and support pages using Valentine theme
206+
- [ ] Onboarding flow with DaisyUI steps component
207+
- [ ] Error messages with helpful guidance
208+
- [ ] Success states and positive reinforcement
209+
210+
### Priority 4: Advanced Features
211+
**Nice-to-have features for enhanced functionality**
212+
213+
**Partner Sharing (Optional)**
214+
- [ ] Partner invitation system with email integration
215+
- [ ] Read-only sharing interface using DaisyUI badges
216+
- [ ] Privacy controls with Radix UI switches
217+
- [ ] Shared calendar view with restricted permissions
218+
- [ ] Notification preferences using DaisyUI toggles
219+
220+
**Advanced Analytics & Insights**
221+
- [ ] Enhanced analytics with pattern recognition
222+
- [ ] Fertility window calculations and visualizations
223+
- [ ] Cycle pattern recognition with data analysis
224+
- [ ] Historical comparisons using DaisyUI timeline
225+
- [ ] Data export functionality (CSV/JSON)
226+
- [ ] Advanced settings with organized DaisyUI tabs
227+
228+
### Priority 5: Production & Deployment
229+
**Getting the app ready for real users**
230+
231+
**Testing & Quality Assurance**
232+
- [ ] Unit tests for shared Zod schemas and utility functions
233+
- [ ] Integration tests for Hono RPC endpoints with proper mocking
234+
- [ ] End-to-end testing for critical user flows using Playwright
235+
- [ ] React Query testing with MSW for API mocking
236+
- [ ] Performance optimization and bundle analysis across workspaces
237+
- [ ] Lighthouse score improvements with PWA compliance (target > 90)
238+
- [ ] ESLint Stylistic compliance and code quality checks
239+
240+
**Deployment & Monitoring**
241+
- [ ] GitHub Actions CI/CD pipeline for pnpm workspace deployment
242+
- [ ] Production deployment setup (Vercel for frontend, Fly.io for backend)
243+
- [ ] Database migration scripts and backup strategy with Drizzle
244+
- [ ] Comprehensive logging and monitoring with structured Winston logs
245+
- [ ] Error tracking and alerting systems with proper Zod error handling
246+
- [ ] Performance monitoring and React Query devtools integration
247+
- [ ] Type safety verification in CI/CD pipeline
248+
249+
**Launch Preparation**
250+
- [ ] Documentation and API reference
251+
- [ ] Privacy policy and terms of service
252+
- [ ] Backup and disaster recovery procedures
253+
- [ ] Security audit and penetration testing
254+
- [ ] User acceptance testing with target audience
255+
- [ ] Go-live checklist and rollback procedures
256+
257+
## 6. Success Criteria
258+
259+
### Technical Success
260+
- [ ] App loads in < 1 second
261+
- [ ] PWA score > 90
262+
- [ ] Works offline seamlessly
263+
- [ ] Cross-browser compatibility
264+
- [ ] Mobile-responsive design
265+
266+
### User Experience Success
267+
- [ ] Girlfriend can log period in < 30 seconds
268+
- [ ] Predictions are reasonably accurate (within 2-3 days)
269+
- [ ] App feels fast and responsive
270+
- [ ] No data loss during offline usage
271+
- [ ] Intuitive interface requiring no training
272+
273+
### Learning Objectives Success
274+
- [ ] Solid understanding of React hooks and patterns
275+
- [ ] Experience with offline-first PWA development
276+
- [ ] Knowledge of modern full-stack architecture
277+
- [ ] Understanding of health app considerations
278+
- [ ] Clean, maintainable codebase
279+
280+
## 7. Technical Considerations
281+
282+
### Monorepo Structure (pnpm workspaces)
283+
```
284+
period-tracker/
285+
├── packages/
286+
│ ├── frontend/ # Vite + React SPA
287+
│ │ ├── src/
288+
│ │ ├── package.json
289+
│ │ └── vite.config.ts
290+
│ ├── backend/ # Hono API server
291+
│ │ ├── src/
292+
│ │ ├── package.json
293+
│ │ └── tsconfig.json
294+
│ └── shared/ # Shared types & Zod schemas
295+
│ ├── src/
296+
│ │ ├── schemas.ts
297+
│ │ └── types.ts
298+
│ ├── package.json
299+
│ └── tsconfig.json
300+
├── apps/ # Future mobile apps
301+
├── .github/
302+
│ └── workflows/
303+
│ └── ci-cd.yml
304+
├── package.json # Root workspace config
305+
├── pnpm-workspace.yaml
306+
├── eslint.config.js # ESLint + Stylistic config
307+
└── tsconfig.json # Root TypeScript config
308+
```
309+
310+
### Security & Privacy
311+
- HTTPS everywhere
312+
- Secure authentication flow with Better Auth
313+
- Data validation with Drizzle ORM type safety
314+
- Rate limiting on APIs with proper logging
315+
- GDPR-friendly data handling
316+
- Input sanitization and SQL injection prevention via Drizzle
317+
318+
### Scalability
319+
- Stateless backend design with Hono
320+
- Efficient database queries optimized with Drizzle
321+
- CDN for static assets
322+
- Turso's edge replication for global performance
323+
- Horizontal scaling capability
324+
- Comprehensive monitoring with Winston logging
325+
326+
### Maintenance
327+
- Clear code documentation and type safety
328+
- Comprehensive error handling with structured logging
329+
- Automated testing pipeline
330+
- Easy deployment process
331+
- Performance monitoring and alerting
332+
- Database migration management with Drizzle
333+
334+
## 8. Future Considerations
335+
336+
### Phase 2+ Features
337+
- Advanced fertility tracking
338+
- Community features
339+
- Wearable device integration
340+
- AI-powered insights
341+
- Telehealth integration
342+
343+
### Monetization Options
344+
- Premium analytics features
345+
- Partner sharing subscriptions
346+
- Educational content tiers
347+
- Health coaching services
348+
- Anonymous data insights (opt-in)
349+
350+
### Technical Debt Management
351+
- Regular dependency updates
352+
- Code refactoring cycles
353+
- Performance audits
354+
- Security reviews
355+
- User feedback integration
356+
357+
---
358+
359+
*This PRD serves as the foundation for building a delightful, fast, and reliable period tracking application that prioritizes user experience while providing valuable health insights.*

0 commit comments

Comments
 (0)