227 lines
7.1 KiB
Markdown
227 lines
7.1 KiB
Markdown
# Mission Control
|
|
|
|
Central hub for activity, tasks, goals, and tools. Built for TopDogLabs to track the journey toward financial independence through iOS app development.
|
|
|
|
**Live URL:** https://mission-control-rho-pink.vercel.app
|
|
|
|
## Features
|
|
|
|
### Dashboard
|
|
- Real-time KPI cards with live data from Supabase
|
|
- Mission statement banner
|
|
- Activity statistics
|
|
- Upcoming events
|
|
- Mission progress tracking
|
|
|
|
### Tasks Overview
|
|
- Status breakdown (Open, In Progress, Review, Done)
|
|
- High priority and overdue task counts
|
|
- Recently updated and completed tasks
|
|
- Quick actions to Gantt Board
|
|
- Quick-action task links target `gantt-board /tasks` with `scope=active-sprint`
|
|
|
|
### Projects
|
|
- Active sprint tracking (global sprints from gantt-board)
|
|
- Sprint status/date visibility
|
|
- Project health cards with color-coded status
|
|
- Per-project task statistics
|
|
|
|
### Calendar
|
|
- Google Calendar integration
|
|
- Event listing with time-based grouping
|
|
- Calendar selector
|
|
- Today's summary
|
|
|
|
### Documents
|
|
- Markdown document management
|
|
- Folder organization
|
|
- Tag-based filtering
|
|
- Grid and list view modes
|
|
- Preview with syntax highlighting
|
|
|
|
### Tools
|
|
- Calculator with full keyboard support
|
|
- Timer with start/stop/reset
|
|
- Password generator
|
|
- Quick links manager
|
|
|
|
### Mission
|
|
- Progress dashboard for key metrics:
|
|
- Freedom Progress (completed tasks)
|
|
- iOS Portfolio (app count)
|
|
- Side Hustle Revenue
|
|
- Travel Fund
|
|
- Milestones timeline
|
|
- Next steps from high priority tasks
|
|
- Core values display
|
|
|
|
## Tech Stack
|
|
|
|
- **Framework:** Next.js 16 (App Router)
|
|
- **Language:** TypeScript
|
|
- **Styling:** Tailwind CSS 4
|
|
- **UI Components:** shadcn/ui + Radix UI
|
|
- **State:** Zustand (client), Server Components (server)
|
|
- **Database:** Supabase
|
|
- **Deployment:** Vercel
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
mission-control/
|
|
├── app/ # Next.js app router
|
|
│ ├── (routes)/ # Page components
|
|
│ ├── api/ # API routes
|
|
│ ├── error.tsx # Global error boundary
|
|
│ ├── not-found.tsx # 404 page
|
|
│ ├── loading.tsx # Global loading state
|
|
│ ├── layout.tsx # Root layout
|
|
│ ├── metadata.ts # SEO metadata
|
|
│ └── sitemap.ts # XML sitemap
|
|
├── components/
|
|
│ ├── ui/ # shadcn/ui components
|
|
│ ├── layout/ # Layout components (sidebar, etc)
|
|
│ ├── activity/ # Activity feed components
|
|
│ └── calendar/ # Calendar components
|
|
├── hooks/ # Custom React hooks
|
|
├── lib/
|
|
│ ├── data/ # Data fetching functions
|
|
│ ├── supabase/ # Supabase client utilities
|
|
│ └── utils.ts # Utility functions
|
|
├── types/ # TypeScript types
|
|
└── public/ # Static assets
|
|
```
|
|
|
|
## Key Improvements (Phase 9)
|
|
|
|
### Performance
|
|
- Added loading states for all pages
|
|
- Implemented optimized skeleton screens
|
|
- Added `loading.tsx` for each route
|
|
- Configured `optimizePackageImports` for faster builds
|
|
- Added caching headers for static assets
|
|
|
|
### Error Handling
|
|
- Global error boundary with `error.tsx`
|
|
- Custom `SupabaseError` class with error codes
|
|
- Safe wrapper for Supabase operations
|
|
- Retry mechanisms for failed requests
|
|
- User-friendly error messages
|
|
|
|
### Accessibility
|
|
- Skip link for keyboard navigation
|
|
- ARIA labels on interactive elements
|
|
- `aria-current="page"` for active navigation
|
|
- Focus-visible styles for keyboard users
|
|
- Reduced motion support
|
|
- Semantic HTML structure
|
|
|
|
### SEO & PWA
|
|
- Comprehensive metadata configuration
|
|
- Open Graph and Twitter card support
|
|
- `robots.txt` for crawlers
|
|
- `sitemap.xml` generation
|
|
- `manifest.json` for PWA support
|
|
- Security headers (X-Frame-Options, etc)
|
|
|
|
### Developer Experience
|
|
- TypeScript strict mode
|
|
- Custom hooks for common patterns
|
|
- Utility hooks (useDebounce, useLocalStorage, etc)
|
|
- Proper error handling throughout
|
|
- Build-time type checking
|
|
|
|
## Environment Variables
|
|
|
|
```env
|
|
# Required
|
|
NEXT_PUBLIC_SUPABASE_URL=
|
|
NEXT_PUBLIC_SUPABASE_ANON_KEY=
|
|
SUPABASE_SERVICE_ROLE_KEY=
|
|
GANTT_API_BASE_URL= # ex: http://gantt-board:3000/api (Docker network)
|
|
GANTT_API_REVALIDATE_SECONDS=15 # Optional cache window for gantt API reads
|
|
|
|
# Optional
|
|
NEXT_PUBLIC_GOOGLE_CLIENT_ID= # For Calendar integration
|
|
NEXT_PUBLIC_MISSION_CONTROL_URL=
|
|
NEXT_PUBLIC_GANTT_BOARD_URL=
|
|
NEXT_PUBLIC_BLOG_BACKUP_URL=
|
|
NEXT_PUBLIC_GITEA_URL=
|
|
NEXT_PUBLIC_GITHUB_URL=
|
|
NEXT_PUBLIC_VERCEL_URL=
|
|
NEXT_PUBLIC_SUPABASE_SITE_URL=
|
|
NEXT_PUBLIC_GOOGLE_URL=
|
|
NEXT_PUBLIC_GOOGLE_CALENDAR_URL=
|
|
NEXT_PUBLIC_GOOGLE_CALENDAR_SETTINGS_URL=
|
|
NEXT_PUBLIC_GANTT_API_BASE_URL= # Client-side override if needed
|
|
GANTT_API_BEARER_TOKEN= # Optional server-to-server auth header
|
|
GANTT_API_COOKIE= # Optional server-to-server cookie header
|
|
```
|
|
|
|
Website URLs are centralized in `lib/config/sites.ts` and can be overridden via the optional variables above.
|
|
|
|
## Getting Started
|
|
|
|
```bash
|
|
# Install dependencies
|
|
npm install
|
|
|
|
# Run development server
|
|
npm run dev
|
|
|
|
# Build for production
|
|
npm run build
|
|
|
|
# Start production server
|
|
npm start
|
|
```
|
|
|
|
## CLI Reuse (API Passthrough)
|
|
|
|
Mission Control reuses the existing task/project CLI from the sibling `gantt-board` project instead of duplicating command logic.
|
|
|
|
- `scripts/task.sh` delegates to `../gantt-board/scripts/task.sh`
|
|
- `scripts/project.sh` delegates to `../gantt-board/scripts/project.sh`
|
|
- `scripts/update-task-status.js` delegates to `gantt-board` `task.sh update`
|
|
|
|
Environment variables:
|
|
|
|
- `GANTT_BOARD_DIR` (optional): override path to the `gantt-board` repo root.
|
|
- `API_URL` (optional): forwarded to reused CLI so all business logic stays in API endpoints.
|
|
|
|
Mission Control web data for tasks/projects/sprints is also read from `gantt-board` API via `GANTT_API_BASE_URL`, so both CLI and web use the same backend contract.
|
|
|
|
Data model note:
|
|
- Sprints are global cycles and are no longer linked to projects.
|
|
- Sprint state is derived from `start_date`/`end_date` at request time (no manual activate/deactivate step).
|
|
- Tasks remain project-scoped (`tasks.project_id` in `gantt-board` schema).
|
|
- The schema migration that removes `sprints.project_id` lives in sibling repo: `../gantt-board/supabase/remove_sprint_project_id.sql`.
|
|
- The schema migration that removes `sprints.status` lives in sibling repo: `../gantt-board/supabase/remove_sprint_status.sql`.
|
|
- `gantt-board` CLI/API sprint "current" and "active" behavior is date-based (current execution time), not persisted status-based.
|
|
|
|
For separate Docker images, set `GANTT_API_BASE_URL` to the Docker service DNS name (example: `http://gantt-board:3000/api`) on the same Docker network.
|
|
If `gantt-board` API auth is required, provide either `GANTT_API_COOKIE` (session cookie) or `GANTT_API_BEARER_TOKEN` as server-to-server auth context.
|
|
|
|
Run passthrough contract test:
|
|
|
|
```bash
|
|
npm run test:cli-contract
|
|
```
|
|
|
|
## Deployment
|
|
|
|
The app deploys automatically to Vercel on push to main:
|
|
|
|
```bash
|
|
npm run build && vercel --prod
|
|
```
|
|
|
|
## Related Projects
|
|
|
|
- **Gantt Board:** https://gantt-board.vercel.app (Task management)
|
|
- **Blog Backup:** https://blog-backup-two.vercel.app (Daily digest)
|
|
|
|
## License
|
|
|
|
Private - TopDogLabs
|