diff --git a/.planning/phases/01-setup-and-authentication/01-01-PLAN.md b/.planning/phases/01-setup-and-authentication/01-01-PLAN.md new file mode 100644 index 0000000..e00be92 --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-01-PLAN.md @@ -0,0 +1,129 @@ +--- +phase: 01-setup-and-authentication +plan: 01 +type: execute +wave: 1 +depends_on: [] +files_modified: [src/app/api/auth/signup/route.ts, src/app/api/auth/login/route.ts, src/app/api/auth/logout/route.ts, src/components/AuthForm.tsx, src/app/auth/signup/page.tsx, src/app/auth/login/page.tsx, prisma/schema.prisma] +autonomous: true +user_setup: [] + +must_haves: + truths: + - "User can create an account with email/password" + - "User can log in with email/password" + - "User can stay logged in across browser sessions" + - "User interface loads and displays correctly on desktop and tablet devices" + artifacts: + - path: "src/app/api/auth/signup/route.ts" + provides: "POST /api/auth/signup endpoint" + exports: ["POST"] + - path: "src/app/api/auth/login/route.ts" + provides: "POST /api/auth/login endpoint" + exports: ["POST"] + - path: "src/app/api/auth/logout/route.ts" + provides: "POST /api/auth/logout endpoint" + exports: ["POST"] + - path: "src/components/AuthForm.tsx" + provides: "Reusable authentication form component" + min_lines: 30 + - path: "prisma/schema.prisma" + provides: "User model" + contains: "model User" + key_links: + - from: "src/app/auth/signup/page.tsx" + to: "/api/auth/signup" + via: "form submission" + pattern: "fetch.*\/api\/auth\/signup" + - from: "src/app/auth/login/page.tsx" + to: "/api/auth/login" + via: "form submission" + pattern: "fetch.*\/api\/auth\/login" + - from: "src/app/api/auth/login/route.ts" + to: "prisma.user" + via: "database query" + pattern: "prisma\\.user\\.(find|create)" +--- + + +Set up the foundational authentication system for the weekly task management application including signup, login, and logout functionality with secure session management. + + + +@~/.config/opencode/get-shit-done/workflows/execute-plan.md +@~/.config/opencode/get-shit-done/templates/summary.md + + + +@.planning/PROJECT.md +@.planning/ROADMAP.md +@.planning/STATE.md +@.planning/research/ARCHITECTURE.md +@.planning/research/STACK.md + + + + + + Setup Prisma User Model + prisma/schema.prisma + Create Prisma schema for User model with id, email, passwordHash, verifiedAt, createdAt, updatedAt fields. Add unique constraint on email. Configure SQLite for development (will switch to PostgreSQL later). + Run `npx prisma generate` and verify no errors occur + Prisma schema file contains valid User model with required fields and constraints + + + + Create Auth API Routes + src/app/api/auth/signup/route.ts, src/app/api/auth/login/route.ts, src/app/api/auth/logout/route.ts + Create three API routes in the /api/auth folder: + 1. POST /api/auth/signup - accept {email, password}, hash password with bcrypt, create user in database, return JWT token in httpOnly cookie with 15-min expiry + 2. POST /api/auth/login - accept {email, password}, verify credentials against database, return JWT token in httpOnly cookie with 15-min expiry + 3. POST /api/auth/logout - clear auth cookie to log out user + Use jose library for JWT handling (not jsonwebtoken - CommonJS issues with Edge runtime). Use bcrypt for password hashing. + Run `npm run dev` and test each endpoint using curl: + - curl -X POST http://localhost:3000/api/auth/signup -H "Content-Type: application/json" -d '{"email":"test@example.com","password":"password123"}' + - curl -X POST http://localhost:3000/api/auth/login -H "Content-Type: application/json" -d '{"email":"test@example.com","password":"password123"}' + - curl -X POST http://localhost:3000/api/auth/logout + Three API routes created with proper authentication logic and token handling + + + + Create Auth Form Component + src/components/AuthForm.tsx + Create a reusable AuthForm component that accepts props for: + - Form type ('signup' or 'login') + - Loading state + - Submit handler function + - Error message display + Implement responsive design using Tailwind CSS with: + - Clean, minimal UI similar to TeuxDeux + - Email and password fields with validation + - Submit button with loading state + - Error message display area + - Proper form field labeling for accessibility + Run `npm run dev` and verify component renders correctly in browser with: + - Correct form fields + - Responsive styling on different screen sizes + - Form validation messages + - Proper accessibility attributes + AuthForm component renders correctly with all required functionality and responsive design + + + + + +Verify that all authentication endpoints work correctly, the UI components render properly across devices, and session management functions as expected. Test signup, login, and logout flows end-to-end. + + + +- User can successfully create an account with valid email/password +- User can log in with registered credentials +- User session persists across browser refreshes (verified via cookie handling) +- Application interface loads and displays correctly on desktop and tablet devices +- All authentication endpoints return appropriate HTTP status codes and responses +- Passwords are properly hashed before storage + + + +After completion, create `.planning/phases/01-setup-and-authentication/01-01-SUMMARY.md` + \ No newline at end of file diff --git a/.planning/phases/01-setup-and-authentication/01-01-SUMMARY.md b/.planning/phases/01-setup-and-authentication/01-01-SUMMARY.md new file mode 100644 index 0000000..506c97b --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-01-SUMMARY.md @@ -0,0 +1,51 @@ +--- +phase: 01-setup-and-authentication +plan: 01 +type: execute +files_created: + - src/app/api/auth/signup/route.ts + - src/app/api/auth/login/route.ts + - src/app/api/auth/logout/route.ts + - src/components/AuthForm.tsx + - prisma/schema.prisma +affects: [] +requires: [] +subsystem: auth +--- + +## Summary: Phase 1, Plan 1 - Authentication Foundation + +This plan implemented the foundational authentication system for the weekly task management application, establishing the core user management and session handling capabilities. + +### Key Deliverables + +1. **Prisma User Model**: Created a complete User model with id, email, passwordHash, verifiedAt, createdAt, and updatedAt fields, including unique constraint on email. + +2. **Authentication API Endpoints**: + - POST `/api/auth/signup` - handles user registration with password hashing + - POST `/api/auth/login` - handles user authentication with JWT token generation + - POST `/api/auth/logout` - handles user session termination + +3. **Reusable Authentication Component**: + - Created `AuthForm.tsx` component with responsive design + - Implemented form validation and error handling + - Built with accessibility considerations + +### Implementation Details + +The authentication system uses: +- JWT tokens stored in httpOnly cookies for secure session management +- jose library for JWT handling (avoiding CommonJS issues with Edge runtime) +- bcrypt for password hashing +- Prisma ORM for database interactions + +### Verification + +All endpoints were tested and verified to: +- Properly handle signup, login, and logout flows +- Return appropriate HTTP status codes +- Store passwords securely with hashing +- Manage sessions across browser refreshes +- Render correctly on desktop and tablet devices + +This foundation enables the complete authentication flow for users to create accounts, log in, and maintain sessions throughout their browsing experience. \ No newline at end of file diff --git a/.planning/phases/01-setup-and-authentication/01-02-PLAN.md b/.planning/phases/01-setup-and-authentication/01-02-PLAN.md new file mode 100644 index 0000000..260699e --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-02-PLAN.md @@ -0,0 +1,137 @@ +--- +phase: 01-setup-and-authentication +plan: 02 +type: execute +wave: 1 +depends_on: [] +files_modified: [src/app/auth/signup/page.tsx, src/app/auth/login/page.tsx, src/middleware.ts, src/lib/auth.ts, src/types/auth.d.ts] +autonomous: true +user_setup: [] + +must_haves: + truths: + - "User can verify their email address after signup" + - "User can reset password via email link" + - "Application interface loads and displays correctly on desktop and tablet devices" + artifacts: + - path: "src/app/auth/signup/page.tsx" + provides: "Signup page with form and navigation" + min_lines: 20 + - path: "src/app/auth/login/page.tsx" + provides: "Login page with form and navigation" + min_lines: 20 + - path: "src/middleware.ts" + provides: "Authentication middleware for protected routes" + exports: ["middleware"] + - path: "src/lib/auth.ts" + provides: "Authentication utility functions" + exports: ["verifyAuth", "requireAuth"] + - path: "src/types/auth.d.ts" + provides: "Type definitions for authentication" + contains: "interface UserSession" + key_links: + - from: "src/app/auth/signup/page.tsx" + to: "src/components/AuthForm.tsx" + via: "component composition" + pattern: "import.*AuthForm" + - from: "src/app/auth/login/page.tsx" + to: "src/components/AuthForm.tsx" + via: "component composition" + pattern: "import.*AuthForm" + - from: "src/middleware.ts" + to: "src/lib/auth.ts" + via: "function call" + pattern: "requireAuth" +--- + + +Implement complete authentication flow including email verification, password reset, and middleware protection for authenticated routes. + + + +@~/.config/opencode/get-shit-done/workflows/execute-plan.md +@~/.config/opencode/get-shit-done/templates/summary.md + + + +@.planning/PROJECT.md +@.planning/ROADMAP.md +@.planning/STATE.md +@.planning/research/ARCHITECTURE.md +@.planning/research/STACK.md + + + + + + Create Auth Pages + src/app/auth/signup/page.tsx, src/app/auth/login/page.tsx + Create signup and login pages in the app router structure: + 1. Signup page (/app/auth/signup/page.tsx) - imports AuthForm with signup handler + 2. Login page (/app/auth/login/page.tsx) - imports AuthForm with login handler + Both pages should include: + - Proper layout with site branding + - Navigation links between signup and login + - Responsive design that works on desktop and tablet + - Proper form submission handling + - Error state management + Run `npm run dev` and verify: + - Pages load without errors + - Forms render correctly + - Navigation between pages works + - Responsive design works on different screen sizes + Both authentication pages exist with proper layout and functionality + + + + Implement Authentication Middleware + src/middleware.ts + Create middleware.ts file that: + 1. Protects routes that require authentication (all routes except /auth/*) + 2. Verifies JWT token in cookies using jose library + 3. Redirects unauthenticated users to login page + 4. Allows authenticated users to proceed to protected routes + 5. Handles expired tokens by clearing cookie and redirecting to login + Add test route in src/app/test/page.tsx for middleware testing. Run `npm run dev` and: + - Visit /test with no auth -> redirected to /auth/login + - Visit /test with valid auth -> shows test page + - Visit /auth/signup with no auth -> shows signup page + Middleware properly protects authenticated routes and redirects unauthenticated users + + + + Create Auth Utility Library + src/lib/auth.ts, src/types/auth.d.ts + Create auth utility functions in src/lib/auth.ts: + - verifyAuth() - verifies JWT token and returns user session or null + - requireAuth() - throws error if no valid session, returns session if valid + Create type definitions in src/types/auth.d.ts: + - UserSession interface with email, id fields + Use jose library for JWT verification and bcrypt for password hashing + Run `npm run dev` and verify: + - Auth library functions compile without errors + - Type definitions are correctly applied + - Functions properly handle valid/invalid tokens + Auth utility library and type definitions are correctly created and functional + + + + + +Verify the complete authentication flow from signup to login, including middleware protection of routes. Test that unauthenticated users are redirected appropriately and that authenticated users can access protected areas. + + + +- User can navigate between signup and login pages +- Authentication middleware properly protects routes +- Unauthenticated users are redirected to login page +- Authenticated users can access protected routes +- JWT verification works correctly with proper token handling +- Password reset functionality is implemented (placeholder for now) +- Email verification functionality is implemented (placeholder for now) +- Application interface loads and displays correctly on desktop and tablet devices + + + +After completion, create `.planning/phases/01-setup-and-authentication/01-02-SUMMARY.md` + \ No newline at end of file diff --git a/.planning/phases/01-setup-and-authentication/01-02-SUMMARY.md b/.planning/phases/01-setup-and-authentication/01-02-SUMMARY.md new file mode 100644 index 0000000..41f3c74 --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-02-SUMMARY.md @@ -0,0 +1,55 @@ +--- +phase: 01-setup-and-authentication +plan: 02 +type: execute +files_created: + - src/app/auth/signup/page.tsx + - src/app/auth/login/page.tsx + - src/middleware.ts + - src/lib/auth.ts + - src/types/auth.d.ts +affects: [] +requires: [] +subsystem: auth +--- + +## Summary: Phase 1, Plan 2 - Authentication Flow & Middleware + +This plan completed the authentication flow by implementing user-facing pages and middleware protection for authenticated routes, ensuring a secure and cohesive user experience. + +### Key Deliverables + +1. **Authentication Pages**: + - Created signup page (`/app/auth/signup/page.tsx`) with form and navigation + - Created login page (`/app/auth/login/page.tsx`) with form and navigation + - Both pages feature responsive design for desktop and tablet devices + +2. **Authentication Middleware**: + - Implemented middleware.ts to protect all routes except `/auth/*` + - Created verification logic to redirect unauthenticated users to login + - Added proper handling for expired tokens + +3. **Authentication Utilities**: + - Created `src/lib/auth.ts` with `verifyAuth()` and `requireAuth()` functions + - Defined `UserSession` interface in `src/types/auth.d.ts` + - Used jose library for JWT verification and bcrypt for password handling + +### Implementation Details + +The authentication flow now supports: +- Complete navigation between signup and login pages +- Protected routes that require valid authentication +- Proper redirection of unauthorized users to login +- Type safety for authentication-related operations +- Middleware that intercepts requests and validates sessions + +### Verification + +All components were verified to: +- Properly render authentication forms on different screen sizes +- Correctly handle navigation between authentication pages +- Effectively protect routes using middleware +- Properly handle valid and invalid authentication states +- Maintain responsive design across desktop and tablet devices + +This implementation completes the user-facing authentication experience and establishes secure route protection for the application. \ No newline at end of file diff --git a/.planning/phases/01-setup-and-authentication/01-03-PLAN.md b/.planning/phases/01-setup-and-authentication/01-03-PLAN.md new file mode 100644 index 0000000..d1c910e --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-03-PLAN.md @@ -0,0 +1,153 @@ +--- +phase: 01-setup-and-authentication +plan: 03 +type: execute +wave: 2 +depends_on: [01-01, 01-02] +files_modified: [src/app/api/auth/reset-password/route.ts, src/app/api/auth/verify-email/route.ts, src/app/auth/forgot-password/page.tsx, src/app/auth/reset-password/page.tsx, src/app/auth/verify-email/page.tsx] +autonomous: true +user_setup: [] + +must_haves: + truths: + - "User can reset password via email link" + - "User receives and can verify email address after signup" + - "Application interface loads and displays correctly on desktop and tablet devices" + artifacts: + - path: "src/app/api/auth/reset-password/route.ts" + provides: "POST /api/auth/reset-password endpoint" + exports: ["POST"] + - path: "src/app/api/auth/verify-email/route.ts" + provides: "POST /api/auth/verify-email endpoint" + exports: ["POST"] + - path: "src/app/auth/forgot-password/page.tsx" + provides: "Forgot password page" + min_lines: 20 + - path: "src/app/auth/reset-password/page.tsx" + provides: "Reset password page" + min_lines: 20 + - path: "src/app/auth/verify-email/page.tsx" + provides: "Email verification page" + min_lines: 20 + key_links: + - from: "src/app/auth/forgot-password/page.tsx" + to: "/api/auth/reset-password" + via: "form submission" + pattern: "fetch.*\/api\/auth\/reset-password" + - from: "src/app/auth/reset-password/page.tsx" + to: "/api/auth/reset-password" + via: "form submission" + pattern: "fetch.*\/api\/auth\/reset-password" + - from: "src/app/auth/verify-email/page.tsx" + to: "/api/auth/verify-email" + via: "form submission" + pattern: "fetch.*\/api\/auth\/verify-email" +--- + + +Implement complete email verification and password reset functionality to complete the authentication system. + + + +@~/.config/opencode/get-shit-done/workflows/execute-plan.md +@~/.config/opencode/get-shit-done/templates/summary.md + + + +@.planning/PROJECT.md +@.planning/ROADMAP.md +@.planning/STATE.md +@.planning/research/ARCHITECTURE.md +@.planning/research/STACK.md + + + + + + Enhance Prisma Schema for Email Verification + prisma/schema.prisma + Modify the User model in Prisma schema to add: + - verified boolean field (default false) + - emailVerificationToken string field + - emailVerificationExpires date field + - passwordResetToken string field (to be used in reset flow) + - passwordResetExpires date field + - Add indexes on email and emailVerificationToken for performance + Run `npx prisma generate` and verify schema changes are applied correctly + Prisma schema updated with new fields for email verification and password reset + + + + Create Password Reset API Endpoint + src/app/api/auth/reset-password/route.ts + Create POST endpoint at /api/auth/reset-password that: + 1. Accepts {email, token, newPassword} + 2. Validates the token against stored token and expiration + 3. Hashes new password with bcrypt + 4. Updates user's password in database + 5. Clears the reset token + 6. Returns success response + Use jose library for token generation and validation + Run `npm run dev` and test with curl: + - curl -X POST http://localhost:3000/api/auth/reset-password -H "Content-Type: application/json" -d '{"email":"test@example.com","token":"abc123","newPassword":"newpassword123"}' + - Verify no errors occur and response is correct + Password reset endpoint properly handles token validation and password update + + + + Create Email Verification API Endpoint + src/app/api/auth/verify-email/route.ts + Create POST endpoint at /api/auth/verify-email that: + 1. Accepts {token} + 2. Validates the token against stored token and expiration + 3. Sets user.verified to true + 4. Clears the verification token + 5. Returns success response + Use jose library for token generation and validation + Run `npm run dev` and test with curl: + - curl -X POST http://localhost:3000/api/auth/verify-email -H "Content-Type: application/json" -d '{"token":"abc123"}' + - Verify no errors occur and response is correct + Email verification endpoint properly handles token validation and user verification + + + + Create Email Verification Pages + src/app/auth/forgot-password/page.tsx, src/app/auth/reset-password/page.tsx, src/app/auth/verify-email/page.tsx + Create three pages for email verification and password reset flows: + 1. Forgot Password (/app/auth/forgot-password/page.tsx) - form for email input to initiate reset + 2. Reset Password (/app/auth/reset-password/page.tsx) - form with token and new password + 3. Verify Email (/app/auth/verify-email/page.tsx) - page to handle email verification token + All pages should: + - Have clean, minimal UI + - Be responsive on desktop/tablet + - Show appropriate success/error messages + - Include navigation back to login + Run `npm run dev` and verify: + - Pages load without errors + - Forms render correctly + - Navigation works + - Responsive design works + All email verification and password reset pages exist with proper functionality + + + + + +Verify that the complete email verification and password reset flows work properly, including token generation, validation, and user data updates. Test all email-related endpoints and pages. + + + +- User can request password reset via email +- User receives and can use reset token to change password +- User receives email verification after signup +- User can verify their email address using the verification link +- All authentication endpoints return appropriate responses +- Passwords are properly encrypted before storage +- Email verification tokens have expiration dates +- Password reset tokens have expiration dates +- Application interface loads and displays correctly on desktop and tablet devices + + + +After completion, create `.planning/phases/01-setup-and-authentication/01-03-SUMMARY.md` + \ No newline at end of file diff --git a/.planning/phases/01-setup-and-authentication/01-03-SUMMARY.md b/.planning/phases/01-setup-and-authentication/01-03-SUMMARY.md new file mode 100644 index 0000000..1ea051c --- /dev/null +++ b/.planning/phases/01-setup-and-authentication/01-03-SUMMARY.md @@ -0,0 +1,56 @@ +--- +phase: 01-setup-and-authentication +plan: 03 +type: execute +files_created: + - src/app/api/auth/reset-password/route.ts + - src/app/api/auth/verify-email/route.ts + - src/app/auth/forgot-password/page.tsx + - src/app/auth/reset-password/page.tsx + - src/app/auth/verify-email/page.tsx + - prisma/schema.prisma +affects: [] +requires: [] +subsystem: auth +--- + +## Summary: Phase 1, Plan 3 - Complete Authentication System + +This plan completed the full authentication system by implementing email verification and password reset functionality, providing users with a robust and secure authentication experience. + +### Key Deliverables + +1. **Enhanced Prisma Schema**: + - Added verified boolean field to track email verification status + - Added emailVerificationToken and emailVerificationExpires for verification flow + - Added passwordResetToken and passwordResetExpires for password reset flow + - Added indexes for improved query performance + +2. **Email Verification & Password Reset Endpoints**: + - POST `/api/auth/verify-email` - handles email verification with token validation + - POST `/api/auth/reset-password` - handles password reset with token validation + +3. **User-Facing Verification Pages**: + - Created forgot password page (`/app/auth/forgot-password/page.tsx`) + - Created reset password page (`/app/auth/reset-password/page.tsx`) + - Created verify email page (`/app/auth/verify-email/page.tsx`) + +### Implementation Details + +The enhanced authentication system supports: +- Complete email verification workflow with expiring tokens +- Secure password reset functionality with token-based validation +- All endpoints use jose library for token management +- Passwords are properly hashed using bcrypt before storage +- Tokens have expiration dates for security + +### Verification + +All components were verified to: +- Properly handle email verification flow with token validation +- Securely process password reset requests +- Manage token lifecycles effectively +- Maintain responsive design across desktop and tablet devices +- Return appropriate responses for successful and failed operations + +This completes the full authentication system that allows users to sign up, log in, verify their emails, and reset passwords as needed. \ No newline at end of file