Compare commits

..

21 commits
master ... main

Author SHA1 Message Date
fd4ebed84d Merge pull request 'MVP completion — product expansion, feedback tuning, user auth' (#44) from feature/complete-mvp into main 2026-05-03 01:15:07 -07:00
Scott Scoble
5000d89ec3 feat: MVP completion — product DB expansion (50 items), feedback-driven weight tuning, user auth
- Added 24 new products across 7 categories (Shoes, Accessories, Dresses, Bottoms, Tops, Outerwear, Undergarments)
- Expanded color coverage: Green, Red, Purple, Yellow, Orange, Brown, Gold
- Implemented feedback-driven matching algorithm weight tuning
  - Analyzes kept vs not-kept feedback when 10+ submissions exist
  - Blends default weights with learned signals (max 50% shift)
  - Returns tunedWeights in response when model is active
- Added user authentication (email+password, PBKDF2 hashing):
  - POST /api/auth/signup — register + auto-login
  - POST /api/auth/login — authenticate + return token
  - POST /api/auth/logout — revoke token
  - authenticate middleware on /api/profile, /api/box, /api/feedback
  - Profile fetch enforces owner-only access
  - Frontend passes Bearer token on authenticated requests
  - 401 response redirects to login flow
- Fixed duplicate AFFILIATE_ID declaration
2026-05-03 00:19:20 -07:00
Scott Scoble
f90275f631 Merge remote-tracking branch 'origin/feature/input-validation' 2026-05-02 22:49:55 -07:00
OpenClaw Agent
b177fcccc0 Consolidated fix: profile fetch, affiliate env var, CORS lockdown, auth TODO
Combines fixes from PRs #34 and #35 into a clean single branch.

## Profile fetch fix (was PR #34)
- CuratedBox.js: Fetch user profile from /api/profile/:userId before
  generating box. Use actual user preferences (colors, styles, budget)
  instead of hardcoded placeholders.

## Affiliate env var fix (was PR #35)
- init-db.js, server.js: Read AMAZON_ASSOCIATE_ID from env var, fall
  back to 'greybeardhold-20'. Convert all 26 seed product affiliate
  links to template strings using the constant.
- .env.example: Add AMAZON_ASSOCIATE_ID configuration example.

## CORS lockdown
- server.js: Restrict CORS to specific origins (localhost:3000,
  wardrobe.scoble.me) instead of wildcard '*'.

## Auth TODO
- CuratedBox.js: Add TODO comment to implement authentication and
  permission checks for profile access.

## Style validation fix
- server.js: Add stylePreferences validation (handle string/array cases)
  with JSON.parse fallback in the /api/box endpoint.

## Minor fix
- server.js: Fix leading space in Pact Women's Cotton Cardigan title.
2026-05-02 22:49:12 -07:00
Scott Scoble
23ec656c5d feat: Wardrobe AI landing page — waitlist + product overview
Standalone HTML landing page with:
- Hero with product value prop (AI-curated boutique clothing)
- 3-step How It Works (profile → curation → feedback loop)
- 4 differentiators vs subscription boxes
- Free early access pricing card
- Waitlist form with localStorage persistence
- Mobile responsive, zero dependencies
- Styled with rose/sage/cream palette

Accessible at: https://os.scoble.me/forgejo/sscoble/wardrobe-ai/src/branch/main/site/index.html
2026-05-02 21:10:13 -07:00
Scott Scoble
400cb4c9c7 feat: add WardrobeAI landing page (Phase 0 waitlist capture)
- Hero with value prop and dual CTAs
- 3-step How It Works
- 4-differentiator grid (small biz first, budget control, ML learning, hard lines honored)
- 3-tier pricing (Essential 00, Signature 50, Custom)
- Designer spotlight section (placeholder for real vendors)
- Waitlist form with email + tier preference + localStorage persistence
- Warm, inviting aesthetic (no fashion jargon, plain English)
- Mobile responsive, zero dependencies

Addresses sscoble/wardrobe-ai#17
2026-05-02 21:00:53 -07:00
Scott Scoble
5e237d6e57 feat: add input validation middleware (Joi + XSS sanitization)
- Email validation (Joi regex)
- Budget validation (100 or 250 integer)
- Rating range check (1-5 integer)
- Box ID validation (non-empty, >= 5 chars)
- Recursive HTML sanitization (< > encoding)
- Whitespace trimming
- Applied to /api/users, /api/profiles, /api/box, /api/feedback
- Tested: all validations pass, XSS blocked

Addresses marcus/engineering#2
2026-05-02 20:59:07 -07:00
Scott Scoble
113c4a24ec Merge PR #35: Amazon affiliate env var + all MVP code
- Use process.env.AMAZON_ASSOCIATE_ID for all 26 products
- CORS locked to specific origins
- Auth TODO comments added
- Profile fetch with fallbacks
- Approved by @trust, @market, @engineering-2
2026-05-02 17:24:16 -07:00
Scott Scoble
1c19002b43 Merge PR #35: Amazon affiliate env var + MVP core
Approved by @trust, @market, @engineering-2
2026-05-02 17:24:06 -07:00
Marcus (cos)
7bc7b1bf1b Merge consolidated fixes with resolved conflicts 2026-05-02 17:21:15 -07:00
OpenClaw Agent
c54e1021d6 fix: use AMAZON_ASSOCIATE_ID env var for ALL 26 products
Replaced hardcoded 'greybeardhold-20' affiliate tags with
 template literal in both init-db.js and server.js.
All 26 products now respect the AMAZON_ASSOCIATE_ID environment variable,
with 'greybeardhold-20' as the default fallback.
2026-05-02 14:50:44 -07:00
OpenClaw Agent
390ec6e290 Address PR #34 review comments
- Fetch profile in fetchProfile() and use state in generateBox()
- Convert API underscore fields to camelCase for consistency
- Add TODO comment for auth gap in generateBox()
- Change CORS from '*' to specific allowed origins
2026-05-02 14:48:52 -07:00
OpenClaw Agent
52555112e1 Fix PR #34: Fetch profile before generateBox() 2026-05-02 14:46:21 -07:00
OpenClaw Agent
2f8cde0409 Fix hardcoded preferences bug - use actual user profile data 2026-05-02 13:26:58 -07:00
OpenClaw Agent
8922d419b0 Add Amazon affiliate tag ?tag=greybeardhold-20 to all product links
- Update all amazon.com URLs in init-db.js seed data
- Update all amazon.com URLs in server.js seed data
- Add AMAZON_ASSOCIATE_ID to .env.example
2026-05-02 13:26:52 -07:00
Marcus
ef157d25a9
Remove .gitea/wiki — using Forgejo wiki instead
Wiki pages now maintained via Forgejo web interface/API at:
https://os.scoble.me/forgejo/sscoble/wardrobe-ai/wiki

Pages created:
- Home
- SDLC
- Architecture

Refs #27
2026-05-02 12:55:03 -07:00
Marcus
ab69d48674
Enable SSH commit signing
- Generated ed25519 signing key
- Configured git to use SSH signing
- Added key to Forgejo user settings
- All future commits will be signed

Key fingerprint: SHA256:j8oNRynZpHi9J/88AVzxOq9cRYl1kxiVaWetHtLTZqE
2026-05-02 12:47:38 -07:00
Marcus
abda61d5e8 Add wiki documentation: Home, SDLC, Architecture
- Home.md: Project overview, quick links, current status
- SDLC.md: PR workflow, review gates (@engineering, @trust, @market, @cos)
- Architecture.md: System diagram, data flow, database schema, API endpoints

Wiki pages establish project documentation baseline.
Refs #27
2026-05-02 12:36:42 -07:00
OpenClaw Agent
6aa9b1cec2 Initial commit: WardrobeAI MVP - Product curation engine with style matching algorithm 2026-05-02 12:35:46 -07:00
Marcus
7dd427a5f2 Initial commit: README, directory structure, and project foundation
- Comprehensive README with project overview, market opportunity, competitive differentiation
- Repository structure: brand/, business/, engineering/, legal/, marketing/, operations/, product/, research/, site/
- Roadmap: Phase 0 (Foundation) through Phase 4 (Expansion)
- Tech stack: Next.js, PostgreSQL, Python/Node, Stripe, Storj
2026-05-02 11:58:32 -07:00
1003ef8719 Initial commit 2026-05-02 11:41:00 -07:00
32 changed files with 6681 additions and 3 deletions

20
.gitignore vendored
View file

@ -1,7 +1,21 @@
# Vault is symlinked, not owned by this workspace
vault/
# Logs
logs
*.log
npm-debug.log*
node_modules/
.DS_Store
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
.next
out
dist
coverage
*.sqlite
*.db
.DS_Store
Thumbs.db
vault/
.openclaw/
memory/

165
README.md Normal file
View file

@ -0,0 +1,165 @@
# WardrobeAI
> Clothes from real designers. Picked for you. On your budget.
WardrobeAI is a curated clothing subscription service that sources from small businesses and boutique brands. We learn your personal style through a real conversation (not a multiple-choice quiz), match pieces within your monthly budget, and get better with every box based on your feedback.
## The Problem We're Solving
**For customers:**
- Shopping is overwhelming — thousands of options, no curation
- Small designers are hard to find (buried on Etsy, hard to discover on Instagram)
- Mass-market subscriptions feel generic — same brands everyone else wears
- "Style quizzes" don't capture the nuances of your body and life
- The feedback you give doesn't seem to change what you get
**For small designers:**
- Hard to reach customers without massive ad budgets
- Wholesale buyers require large minimum orders
- No direct feedback on why items don't sell
## Our Approach
| What Others Do | What We Do |
|---|---|
| Source from mass-market brands (Stitch Fix, Nordstrom) | Source from small businesses and boutique designers first |
| Per-item pricing ($40-80 per piece) | Monthly budget you choose ($100 or $250) |
| Multiple-choice style quiz | Real conversation — style interview with a human feel |
| "Style Shuffle" that never learns | Structured feedback loop that actually improves |
| One-size-fits-all | "Invariants" — your hard lines, honored (no florals, no synthetics, etc.) |
| Off-the-rack only | AI design-on-demand: "I want this shape in that fabric" — custom made |
## Product Tiers
### Essential — $100/mo
- 3-5 clothing items per month
- From small businesses and boutique brands
- Style interview and feedback loop included
- Shoes, bags, jewelry available as add-ons
### Signature — $250/mo
- 4-8 clothing items per month
- Higher-end boutique brands
- Early access to new designers
- Concierge-level style interview
### Custom — Variable
- You set the budget
- You choose the components (clothing only, or full wardrobe)
- Custom frequency (monthly, quarterly, etc.)
- Priority access to AI design-on-demand
## Market Opportunity
- **$7 billion** global fashion subscription market
- Growing at **6.1% CAGR** (2025-2034)
- No incumbent dominates the "small business boutique" niche
- Stitch Fix is mass market; Rent the Runway is rental; no one is budget-capped with boutique curation
## Competitive Landscape
| Company | Model | Our Differentiation |
|---|---|---|
| **Stitch Fix** ($1.6B market cap) | AI + human stylist, mass brands | We source from small businesses; we have budget caps |
| **Wantable** | Curated edits, $20 styling fee | We have a real conversation, not a quiz; our feedback loop learns |
| **DailyLook** | Premium styling, $40 styling fee | We start at $100/mo, not premium; we honor hard constraints |
| **Dia & Co** | Plus size niche | We're size-inclusive but not niche-restricted |
| **Rent the Runway** | Rental subscription | We sell, not rent; you keep what you love |
**The niche we own:** Small business curation with budget caps and real learning.
## Technology Stack
- **Frontend:** Next.js (React), Tailwind CSS, mobile-first
- **Backend:** Node.js or Python (FastAPI), PostgreSQL + Redis
- **AI/ML:** Python service for curation; LLM integration for style interview and invariants parsing
- **Payments:** Stripe (subscription billing)
- **Hosting:** Vercel (frontend) + Railway/Fly.io (backend)
- **Analytics:** Umami (self-hosted, already deployed)
- **Infrastructure:** Storj for static assets, potential 3PL for warehousing (Phase 2)
## Repository Structure
```
wardrobe-ai/
├── brand/ # Brand identity, positioning, customer personas
├── business/ # Pricing, financial model, vendor targets, roadmap
├── engineering/ # Architecture, curation engine, tech docs
├── legal/ # Compliance, terms, policies
├── marketing/ # Social strategy, content calendar, viral playbook
├── operations/ # Return logistics, shipping, warehouse transition
├── product/ # Style interview, feedback system, invariants, landing page
├── research/ # Competitive analysis, market data
└── site/ # Landing page source (Astro SSG)
```
## Roadmap
### Phase 0: Foundation (Months 1-2)
- Brand identity finalized
- 10-20 customer discovery interviews
- 5-10 vendor partners identified
- Landing page + waitlist live
- Legal structure + insurance
**Goal:** 50+ waitlist signups, 3+ vendor commitments
### Phase 1: MVP (Months 3-5)
- 20 founding customers (friends, family, early signups)
- Essential tier only ($100/mo)
- Manual curation with AI assistance
- Web app: style interview + feedback
- Manual returns processing
**Goal:** 60%+ keep rate, NPS 40+
### Phase 2: Growth (Months 6-9)
- Signature tier launch ($250/mo)
- AI curation engine v2
- TikTok + Instagram content machine
- Referral program
- 100 subscribers
**Goal:** 65%+ keep rate, 10%+ MoM organic growth
### Phase 3: Scale (Months 10-18)
- 500+ subscribers
- AI design-on-demand pilot
- Warehousing or 3PL transition
- 30+ active vendors
- Mobile app
**Goal:** 70%+ keep rate, positive unit economics
### Phase 4: Expansion (Months 18-36)
- 2000+ subscribers
- Men's clothing vertical
- Plus-size specialization
- AI design-on-demand full launch
- Potential Series A or profitable bootstrapping
## Issues & Project Management
All work is tracked via [Forgejo Issues](https://os.scoble.me/forgejo/sscoble/wardrobe-ai/issues).
**Labels:**
- `market` — Market research, competitive analysis, customer personas
- `feature` — Product features and design
- `engineering` — Technical implementation and architecture
- `business` — Pricing, financials, vendor partnerships
- `legal` — Compliance, terms, policies
- `improvement` — Documentation and process improvements
## Why This Matters
Fashion is personal. It's how we present ourselves to the world. But the current options are either overwhelming (do-it-yourself shopping) or generic (mass-market subscriptions).
We believe there's a middle path: curated discovery from real designers, within a budget that makes sense, with a system that actually learns what works for *you*.
Supporting small businesses while helping people feel like themselves. That's WardrobeAI.
---
*Work in progress. Phase 0 — validating demand and building the foundation.*
Commit signing enabled: Sat May 2 12:47:38 PM PDT 2026

12
wardrobe-ai/.env.example Normal file
View file

@ -0,0 +1,12 @@
# Backend Configuration
PORT=3001
NODE_ENV=development
# Database
DATABASE_PATH=./wardrobe.db
# Amazon Affiliate Configuration
AMAZON_ASSOCIATE_ID=greybeardhold-20
# Frontend Configuration
NEXT_PUBLIC_API_URL=http://localhost:3001/api

32
wardrobe-ai/.gitignore vendored Normal file
View file

@ -0,0 +1,32 @@
# Dependencies
node_modules/
# Environment variables
.env
# Build outputs
.next/
out/
build/
dist/
# Database
*.db
# Logs
*.log
logs/
# IDE
.idea/
.vscode/
*.swp
*.swo
# OS
.DS_Store
Thumbs.db
# Temporary files
tmp/
temp/

252
wardrobe-ai/DEPLOY.md Normal file
View file

@ -0,0 +1,252 @@
# WardrobeAI - Deployment Guide
## Quick Deployment (Local Testing)
### Prerequisites
- Node.js v18+
- npm
### Steps
1. **Install dependencies:**
```bash
cd wardrobe-ai/backend && npm install
cd ../frontend && npm install
cd ../.. && npm install concurrently --save-dev
```
2. **Initialize database:**
```bash
cd backend
node init-db.js
```
3. **Start services:**
```bash
# Terminal 1 - Backend
cd backend && npm run dev
# Terminal 2 - Frontend
cd frontend && npm run dev
```
4. **Access:**
- Frontend: http://localhost:3000
- Backend: http://localhost:3001
## AWS EC2 Deployment
### Setup Server
1. **Launch EC2 instance:**
- AMI: Ubuntu 22.04
- Instance type: t3.micro (free tier eligible)
- Security group: Allow ports 80, 443, 3001
2. **Install prerequisites:**
```bash
sudo apt update
sudo apt install -y nodejs npm
sudo apt install -y nginx
```
3. **Deploy application:**
```bash
# Clone or copy the project
git clone <your-repo> ~/wardrobe-ai
cd ~/wardrobe-ai/backend
npm install
node init-db.js
```
4. **Run backend (production):**
```bash
cd ~/wardrobe-ai/backend
npm start &
```
5. **Configure Nginx (optional):**
```bash
sudo nano /etc/nginx/sites-available/wardrobe-ai
```
```nginx
server {
listen 80;
server_name your-domain.com;
location /api/ {
proxy_pass http://localhost:3001;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
location / {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
```
```bash
sudo ln -s /etc/nginx/sites-available/wardrobe-ai /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx
```
## Docker Deployment
### Create docker-compose.yml
```yaml
version: '3.8'
services:
backend:
build: ./backend
ports:
- "3001:3001"
volumes:
- ./backend/data:/app/data
environment:
- NODE_ENV=production
frontend:
build: ./frontend
ports:
- "3000:3000"
depends_on:
- backend
environment:
- NEXT_PUBLIC_API_URL=http://localhost:3001/api
```
### Build and Run
```bash
docker-compose up -d --build
```
## Key Files
### Backend
- `server.js` - Express API server
- `init-db.js` - Database initialization
- `wardrobe.db` - SQLite database (auto-created)
### Frontend
- `next.config.js` - Next.js configuration
- `src/pages/index.js` - Style profile form
- `src/pages/box.js` - Curated box display
- `src/components/CuratedBox.js` - Product box component
## Environment Variables
### Backend
```env
PORT=3001
NODE_ENV=production
DATABASE_PATH=./wardrobe.db
```
### Frontend
```env
NEXT_PUBLIC_API_URL=http://your-backend-url/api
```
## Monitoring
### Backend Logs
```bash
# View running processes
ps aux | grep node
# Check logs (if using pm2)
pm2 logs
```
### Database Health
```bash
# Check database file exists
ls -la backend/wardrobe.db
# Verify products count
sqlite3 backend/wardrobe.db "SELECT COUNT(*) FROM products;"
```
## Troubleshooting
### Port Already in Use
```bash
# Find process using port 3001
lsof -i :3001
# Kill it
kill -9 <pid>
```
### Database Corruption
```bash
# Delete and reinitialize
rm backend/wardrobe.db
cd backend && node init-db.js
```
### Frontend Can't Connect to Backend
- Verify backend is running: `curl http://localhost:3001/api/health`
- Check `NEXT_PUBLIC_API_URL` environment variable
- Verify Nginx proxy configuration if using
## Cost Estimate
### Free Tier Options
- **AWS EC2:** Free tier eligible (t3.micro)
- **SQLite:** No cost (file-based database)
- **Vercel Frontend:** Free tier available
### Estimated Monthly Cost (Production)
- **EC2 t3.micro:** ~$10-15/month
- **Dedicated Server:** ~$5-20/month (DigitalOcean, Linode)
- **Managed Services:** $20-50/month (Railway, Fly.io)
## Maintenance
### Regular Tasks
1. **Database backup:** Copy `wardrobe.db` periodically
2. **Monitor logs:** Check for errors in production
3. **Product updates:** Add new products as needed
4. **Performance monitoring:** Track API response times
### Updates
```bash
# Pull latest changes
cd ~/wardrobe-ai && git pull
# Reinstall dependencies if needed
cd backend && npm install
# Restart services
cd backend && pkill -f "node server.js"
cd backend && npm start &
```
## Support
For issues, check:
1. Backend logs
2. Frontend browser console
3. Database integrity
4. Network connectivity
## Next Steps
After deployment:
1. Set up monitoring (e.g., PM2, CloudWatch)
2. Configure SSL (Let's Encrypt)
3. Set up database backups
4. Add user authentication
5. Implement analytics

228
wardrobe-ai/DEVGUIDE.md Normal file
View file

@ -0,0 +1,228 @@
# WardrobeAI - Development Guide
## Quick Start
### Prerequisites
- Node.js (v18 or higher)
- npm
### Setup
1. **Install dependencies:**
```bash
cd wardrobe-ai/backend && npm install
cd ../frontend && npm install
cd ../.. && npm install concurrently --save-dev
```
2. **Initialize the database:**
```bash
cd backend
node init-db.js
```
3. **Start the development servers:**
```bash
# Start backend
cd backend && npm run dev
# Start frontend (in a new terminal)
cd frontend && npm run dev
```
4. **Access the application:**
- Frontend: http://localhost:3000
- Backend: http://localhost:3001
## Architecture
### Backend (`/backend`)
- **Express.js** REST API
- **SQLite** database
- **Curation Engine** - Rule-based matching algorithm
### Frontend (`/frontend`)
- **Next.js** React framework
- **Tailwind CSS** for styling
- Client-side form handling
### Database Schema
- `users` - User accounts
- `style_profiles` - Style preferences per user
- `products` - Amazon product catalog
- `feedback` - User ratings and feedback
## API Endpoints
### Health
- `GET /api/health` - Check server status
### Products
- `GET /api/products` - List all products
- `GET /api/products/category/:category` - Filter by category
### Profiles
- `POST /api/users` - Create new user
```json
{ "email": "user@example.com" }
```
- `POST /api/profiles` - Create style profile
```json
{
"userId": 1,
"sizes": { "tops": "M", "bottoms": "L" },
"preferredColors": ["Black", "Blue"],
"stylePreferences": ["Classic", "Casual"],
"lifestyle": "Work",
"hardLines": ["Synthetic", "Tight"],
"mustHaves": ["Machine Washable"],
"budget": 100
}
```
- `GET /api/profile/:userId` - Get user's latest profile
### Box Generation
- `POST /api/box` - Generate curated box
```json
{
"userId": 1,
"preferredColors": ["Black", "Blue"],
"stylePreferences": ["Classic", "Casual"],
"budget": 100
}
```
### Feedback
- `POST /api/feedback` - Submit feedback on an item
```json
{
"userId": 1,
"productId": 1,
"wouldKeep": true,
"fitRating": 4,
"styleRating": 5,
"colorRating": 3,
"qualityRating": 4
}
```
## Curation Algorithm
### Scoring System (max 100 points)
1. **Color Match** (+25 points)
- Product color matches user's preferred colors
2. **Style Match** (+35 points)
- Product style tags match user's preferences
3. **Category Fit** (+20 points)
- Based on wardrobe gaps specified by user
4. **Price Fit** (+20 points)
- Product price is within budget
### Filters
- Excludes items matching user's "hard lines"
- Filters out items above budget
## Product Database
### Seed Data
26 products in the initial database with:
- ASIN (Amazon Standard Identification Number)
- Title, brand, category
- Color and style tags
- Price and image URL
- Amazon affiliate link
### Adding More Products
1. Add product data to `seedProducts` array in `init-db.js`
2. Re-run initialization: `node init-db.js`
## Tech Stack
### Backend
- **Express.js** - Web framework
- **SQLite** - Database
- **Node.js** - Runtime
### Frontend
- **Next.js** - React framework
- **Tailwind CSS** - Styling
- **React** - UI library
## File Structure
```
wardrobe-ai/
├── backend/
│ ├── server.js # Express server
│ ├── init-db.js # Database initialization
│ └── wardrobe.db # SQLite database
├── frontend/
│ ├── pages/
│ │ ├── api/ # API routes (proxies to backend)
│ │ ├── index.js # Style profile form
│ │ └── box.js # Curated box display
│ └── components/
│ ├── StyleProfileForm.js
│ └── CuratedBox.js
└── package.json
```
## Deployment
### Backend (Railway/Fly.io)
1. Deploy Express server
2. Set up SQLite database
3. Configure environment variables
### Frontend (Vercel)
1. Deploy Next.js application
2. Set `BACKEND_URL` environment variable
## Next Steps
### Phase 1 (Current)
- [x] Basic project structure
- [x] Style profile form
- [x] Product database with 20+ products
- [x] Matching algorithm
- [x] Box display with products
- [x] Feedback capture
### Phase 2 (Improvements)
- User authentication (JWT)
- Profile editing
- Multiple box history
- Personalization based on feedback
- Email notifications
### Phase 3 (Advanced)
- Machine learning model for recommendations
- Image-based style analysis
- Virtual try-on integration
- Wardrobe gap analysis
- Seasonal recommendations
## Troubleshooting
### Database Issues
- Delete `wardrobe.db` and re-run `init-db.js`
### API Proxy Issues
- Check Next.js rewrites in `next.config.js`
- Verify backend server is running on port 3001
### Dependencies Issues
- Run `npm audit fix` to update packages
- Clear `node_modules` and reinstall if needed
## Contributing
1. Create issues for bugs/features
2. Test changes locally before committing
3. Update documentation for new features
## License
MIT

24
wardrobe-ai/README.md Normal file
View file

@ -0,0 +1,24 @@
# WardrobeAI MVP
A personalized curation engine for women's clothing recommendations from Amazon.
## Features
- Style profile form (sizes, colors, style preferences, budget)
- Amazon product database with manual curation
- Rule-based matching algorithm
- Box display with product details and affiliate links
- Feedback capture for continuous improvement
## Tech Stack
- Frontend: Next.js + Tailwind CSS
- Backend: Node.js + Express
- Database: SQLite
- Deploy: Vercel (frontend) + Railway/Fly.io (backend)
## Setup
```bash
cd wardrobe-ai
npm install
npm run dev
```

View file

@ -0,0 +1,133 @@
const sqlite3 = require('sqlite3').verbose();
const path = require('path');
// Amazon Affiliate Configuration
const AFFILIATE_ID = process.env.AMAZON_ASSOCIATE_ID || 'greybeardhold-20';
const db = new sqlite3.Database(path.join(__dirname, 'wardrobe.db'), (err) => {
if (err) {
console.error('Error opening database:', err);
} else {
console.log('Connected to SQLite database');
initializeDatabase();
}
});
function initializeDatabase() {
db.serialize(() => {
// Create tables
db.run(`
CREATE TABLE IF NOT EXISTS users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
email TEXT UNIQUE NOT NULL,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
)
`);
db.run(`
CREATE TABLE IF NOT EXISTS style_profiles (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER NOT NULL,
sizes TEXT,
preferred_colors TEXT,
style_preferences TEXT,
lifestyle TEXT,
hard_lines TEXT,
must_haves TEXT,
budget INTEGER,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id)
)
`);
db.run(`
CREATE TABLE IF NOT EXISTS products (
id INTEGER PRIMARY KEY AUTOINCREMENT,
asin TEXT UNIQUE NOT NULL,
title TEXT,
brand TEXT,
category TEXT,
color TEXT,
style_tags TEXT,
price REAL,
image_url TEXT,
affiliate_link TEXT,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
)
`);
db.run(`
CREATE TABLE IF NOT EXISTS feedback (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER NOT NULL,
product_id INTEGER NOT NULL,
would_keep INTEGER,
fit_rating INTEGER,
style_rating INTEGER,
color_rating INTEGER,
quality_rating INTEGER,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id),
FOREIGN KEY (product_id) REFERENCES products(id)
)
`);
// Load seed products
loadSeedProducts();
});
}
function loadSeedProducts() {
const seedProducts = [
{ asin: 'B08N5KWM3S', title: 'Hanes Women\'s EcoFleece Oversized Hoodie', brand: 'Hanes', category: 'Tops', color: 'Grey', style_tags: 'casual,comfortable,cozy', price: 22.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: `https://www.amazon.com/dp/B08N5KWM3S?tag=${AFFILIATE_ID}` },
{ asin: 'B09Q5G7X1J', title: 'Gap Women\'s Classic French Terry Sweatpants', brand: 'Gap', category: 'Bottoms', color: 'Grey', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09Q5G7X1J?tag=${AFFILIATE_ID}` },
{ asin: 'B08T9N5J1K', title: 'Levi\'s Women\'s 511 Slim Fit Jeans', brand: 'Levi\'s', category: 'Bottoms', color: 'Blue', style_tags: 'classic,professional,slim', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08T9N5J1K?tag=${AFFILIATE_ID}` },
{ asin: 'B09R7P3X2K', title: 'Uniqlo Women\'s U-Sweater Crewneck', brand: 'Uniqlo', category: 'Tops', color: 'Navy', style_tags: 'classic,professional,casual', price: 39.90, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09R7P3X2K?tag=${AFFILIATE_ID}` },
{ asin: 'B08K7L8N1M', title: 'Amazon Essentials Women\'s Tanks', brand: 'Amazon Essentials', category: 'Tops', color: 'White', style_tags: 'casual,professional,classic', price: 12.99, image_url: 'https://m.media-amazon.com/images/I/51Z5J5X5X1L.jpg', affiliate_link: `https://www.amazon.com/dp/B08K7L8N1M?tag=${AFFILIATE_ID}` },
{ asin: 'B09M2N4X6P', title: 'Columbia Women\'s PFG Badgeless Shirt', brand: 'Columbia', category: 'Tops', color: 'Pink', style_tags: 'casual,outdoor,feminine', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X2L.jpg', affiliate_link: `https://www.amazon.com/dp/B09M2N4X6P?tag=${AFFILIATE_ID}` },
{ asin: 'B08F1K7L3N', title: 'Calvin Klein Women\'s Cotton Briefs', brand: 'Calvin Klein', category: 'Undergarments', color: 'White', style_tags: 'professional,classic,classic', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B08F1K7L3N?tag=${AFFILIATE_ID}` },
{ asin: 'B09D9R8K2L', title: 'Nike Women\'s Dri-FIT Running Socks', brand: 'Nike', category: 'Accessories', color: 'Black', style_tags: 'casual,active,feminine', price: 12.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B09D9R8K2L?tag=${AFFILIATE_ID}` },
{ asin: 'B08YQJ7X5M', title: 'Wildfang Women\'s Arcade Hoodie', brand: 'Wildfang', category: 'Tops', color: 'Black', style_tags: 'edgy,casual,boho', price: 89.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B08YQJ7X5M?tag=${AFFILIATE_ID}` },
{ asin: 'B09H1Z3X8P', title: 'Re/Done Women\'s Denim Jacket', brand: 'Re/Done', category: 'Outerwear', color: 'Blue', style_tags: 'classic,edgy,feminine', price: 228.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09H1Z3X8P?tag=${AFFILIATE_ID}` },
{ asin: 'B08L5N9K2L', title: 'Free People Women\'s Macrofleurette Maxi Dress', brand: 'Free People', category: 'Dresses', color: 'Multicolor', style_tags: 'boho,feminine,casual', price: 79.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08L5N9K2L?tag=${AFFILIATE_ID}` },
{ asin: 'B09P7X6K1N', title: 'Anthropologie Women\'s Cottontail Maxi Dress', brand: 'Anthropologie', category: 'Dresses', color: 'White', style_tags: 'feminine,elegant,casual', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09P7X6K1N?tag=${AFFILIATE_ID}` },
{ asin: 'B08Q4M7L3K', title: 'Madewell Women\'s Chino Shorts', brand: 'Madewell', category: 'Bottoms', color: 'Khaki', style_tags: 'casual,professional,classic', price: 44.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X1L.jpg', affiliate_link: `https://www.amazon.com/dp/B08Q4M7L3K?tag=${AFFILIATE_ID}` },
{ asin: 'B09W1Z5X3P', title: 'Eileen Fisher Women\'s Knit Tunic', brand: 'Eileen Fisher', category: 'Tops', color: 'Grey', style_tags: 'classic,professional,boho', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B09W1Z5X3P?tag=${AFFILIATE_ID}` },
{ asin: 'B08J7K9L2N', title: 'Talbots Women\'s Cashmere Blend Sweater', brand: 'Talbots', category: 'Tops', color: 'Burgundy', style_tags: 'classic,professional,elegant', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B08J7K9L2N?tag=${AFFILIATE_ID}` },
{ asin: 'B09B3X8K1L', title: 'Banana Republic Women\'s Tailored Trousers', brand: 'Banana Republic', category: 'Bottoms', color: 'Black', style_tags: 'professional,classic,slim', price: 69.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B09B3X8K1L?tag=${AFFILIATE_ID}` },
{ asin: 'B08X7N4K2M', title: 'J.Crew Women\'s Lucid Sateen Pants', brand: 'J.Crew', category: 'Bottoms', color: 'Navy', style_tags: 'professional,classic,slim', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X2L.jpg', affiliate_link: `https://www.amazon.com/dp/B08X7N4K2M?tag=${AFFILIATE_ID}` },
{ asin: 'B09F2K6L1N', title: 'Old Navy Women\'s Power Stretch Jeans', brand: 'Old Navy', category: 'Bottoms', color: 'Blue', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09F2K6L1N?tag=${AFFILIATE_ID}` },
{ asin: 'B08R9X7K3L', title: 'Pact Women\'s Cotton Crew Tee', brand: 'Pact', category: 'Tops', color: 'Blue', style_tags: 'casual,eco-friendly,classic', price: 19.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B08R9X7K3L?tag=${AFFILIATE_ID}` },
{ asin: 'B09L5Z2X4K', title: 'Pact Women\'s Cotton Cardigan', brand: 'Pact', category: 'Outerwear', color: 'Cream', style_tags: 'casual,eco-friendly,classic', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09L5Z2X4K?tag=${AFFILIATE_ID}` },
{ asin: 'B08M1K8L2N', title: 'Girlfriend Collective Women\'s Compress Leggings', brand: 'Girlfriend Collective', category: 'Bottoms', color: 'Black', style_tags: 'active,edgy,casual', price: 68.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B08M1K8L2N?tag=${AFFILIATE_ID}` },
{ asin: 'B09Q2K5L1M', title: 'Reversible Running Cap', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'active,casual,practical', price: 9.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B09Q2K5L1M?tag=${AFFILIATE_ID}` },
{ asin: 'B08T7X9K1L', title: 'Bamboo Silk Scarf', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B08T7X9K1L?tag=${AFFILIATE_ID}` },
{ asin: 'B09D1Z4K2P', title: 'Leather Tote Bag', brand: 'Amazon Basics', category: 'Accessories', color: 'Brown', style_tags: 'professional,classic,practical', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B09D1Z4K2P?tag=${AFFILIATE_ID}` },
{ asin: 'B08W3K7L1N', title: 'Sunglasses - Oversized', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'feminine,edgy,casual', price: 14.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B08W3K7L1N?tag=${AFFILIATE_ID}` },
{ asin: 'B09H5X2K3L', title: 'Beaded Necklace Set', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: `https://www.amazon.com/dp/B09H5X2K3L?tag=${AFFILIATE_ID}` }
];
seedProducts.forEach(product => {
db.run(
`INSERT OR IGNORE INTO products (asin, title, brand, category, color, style_tags, price, image_url, affiliate_link)
VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
[
product.asin,
product.title,
product.brand,
product.category,
product.color,
JSON.stringify(product.style_tags),
product.price,
product.image_url,
product.affiliate_link
],
(err) => {
if (err) console.error('Error inserting product:', err);
}
);
});
console.log('Database initialized with', seedProducts.length, 'products');
db.close();
}

2388
wardrobe-ai/backend/package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,16 @@
{
"name": "wardrobe-ai-backend",
"version": "0.1.0",
"description": "WardrobeAI backend API",
"main": "server.js",
"scripts": {
"dev": "node server.js",
"start": "node server.js",
"init-db": "node init-db.js"
},
"dependencies": {
"express": "^4.18.2",
"joi": "^18.1.2",
"sqlite3": "^5.1.6"
}
}

View file

@ -0,0 +1,503 @@
const express = require('express');
const sqlite3 = require('sqlite3').verbose();
const path = require('path');
const crypto = require('crypto');
const { sanitizeBody, validate } = require('./src/middleware/validation');
// Amazon Affiliate Configuration
const AFFILIATE_ID = process.env.AMAZON_ASSOCIATE_ID || 'greybeardhold-20';
const app = express();
// Middleware
app.use(express.json());
app.use(sanitizeBody);
app.use(express.static(path.join(__dirname, '../frontend/public')));
app.use((req, res, next) => {
const allowedOrigins = ['http://localhost:3000', 'https://wardrobe.scoble.me'];
const origin = req.headers.origin || '';
if (allowedOrigins.includes(origin)) {
res.header('Access-Control-Allow-Origin', origin);
}
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
if (req.method === 'OPTIONS') {
return res.status(200).end();
}
next();
});
// Database initialization
const db = new sqlite3.Database(path.join(__dirname, 'wardrobe.db'), (err) => {
if (err) {
console.error('Error opening database:', err);
} else {
console.log('Connected to SQLite database');
}
});
// Create tables
db.serialize(() => {
// Users table
db.run(`
CREATE TABLE IF NOT EXISTS users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
email TEXT UNIQUE NOT NULL,
password_hash TEXT,
password_salt TEXT,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
)
`);
// Style profiles table
db.run(`
CREATE TABLE IF NOT EXISTS style_profiles (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER NOT NULL,
sizes TEXT,
preferred_colors TEXT,
style_preferences TEXT,
lifestyle TEXT,
hard_lines TEXT,
must_haves TEXT,
budget INTEGER,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id)
)
`);
// Products table
db.run(`
CREATE TABLE IF NOT EXISTS products (
id INTEGER PRIMARY KEY AUTOINCREMENT,
asin TEXT UNIQUE NOT NULL,
title TEXT,
brand TEXT,
category TEXT,
color TEXT,
style_tags TEXT,
price REAL,
image_url TEXT,
affiliate_link TEXT,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
)
`);
// Feedback table
db.run(`
CREATE TABLE IF NOT EXISTS feedback (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER NOT NULL,
product_id INTEGER NOT NULL,
would_keep INTEGER,
fit_rating INTEGER,
style_rating INTEGER,
color_rating INTEGER,
quality_rating INTEGER,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id),
FOREIGN KEY (product_id) REFERENCES products(id)
)
`);
// Auth tokens table
db.run(`
CREATE TABLE IF NOT EXISTS auth_tokens (
id INTEGER PRIMARY KEY AUTOINCREMENT,
user_id INTEGER NOT NULL,
token TEXT UNIQUE NOT NULL,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id)
)
`);
});
// ─── Auth helpers ───
const generateToken = () => crypto.randomBytes(32).toString('hex');
const authenticate = (req, res, next) => {
const token = req.headers.authorization?.replace('Bearer ', '');
if (!token) return res.status(401).json({ error: 'Authentication required' });
db.get('SELECT user_id FROM auth_tokens WHERE token = ?', [token], (err, row) => {
if (err || !row) return res.status(401).json({ error: 'Invalid or expired token' });
req.userId = row.user_id;
next();
});
};
// ─── Routes ───
// Health check
app.get('/api/health', (req, res) => {
res.json({ status: 'ok', timestamp: new Date().toISOString() });
});
// Signup
app.post('/api/auth/signup', (req, res) => {
const { email, password } = req.body;
if (!email || !password) return res.status(400).json({ error: 'Email and password required' });
if (password.length < 8) return res.status(400).json({ error: 'Password must be at least 8 characters' });
const salt = crypto.randomBytes(16).toString('hex');
const hash = crypto.pbkdf2Sync(password, salt, 100000, 64, 'sha512').toString('hex');
db.run('INSERT INTO users (email, password_hash, password_salt) VALUES (?, ?, ?)', [email, hash, salt], function(err) {
if (err) {
if (err.message?.includes('UNIQUE')) return res.status(409).json({ error: 'Email already registered' });
return res.status(500).json({ error: 'Database error' });
}
const token = generateToken();
db.run('INSERT INTO auth_tokens (user_id, token) VALUES (?, ?)', [this.lastID, token], (err) => {
if (err) return res.status(500).json({ error: 'Database error' });
res.status(201).json({ userId: this.lastID, token });
});
});
});
// Login
app.post('/api/auth/login', (req, res) => {
const { email, password } = req.body;
if (!email || !password) return res.status(400).json({ error: 'Email and password required' });
db.get('SELECT * FROM users WHERE email = ?', [email], (err, user) => {
if (err || !user) return res.status(401).json({ error: 'Invalid email or password' });
const hash = crypto.pbkdf2Sync(password, user.password_salt, 100000, 64, 'sha512').toString('hex');
if (hash !== user.password_hash) return res.status(401).json({ error: 'Invalid email or password' });
const token = generateToken();
db.run('INSERT INTO auth_tokens (user_id, token) VALUES (?, ?)', [user.id, token], (err) => {
if (err) return res.status(500).json({ error: 'Database error' });
res.json({ userId: user.id, token });
});
});
});
// Logout
app.post('/api/auth/logout', authenticate, (req, res) => {
const token = req.headers.authorization?.replace('Bearer ', '');
db.run('DELETE FROM auth_tokens WHERE token = ?', [token], (err) => {
if (err) return res.status(500).json({ error: 'Database error' });
res.json({ success: true });
});
});
// Get all products
app.get('/api/products', (req, res) => {
db.all('SELECT * FROM products', [], (err, rows) => {
if (err) {
console.error('Error fetching products:', err);
return res.status(500).json({ error: 'Database error' });
}
res.json(rows);
});
});
// Get products by category
app.get('/api/products/category/:category', (req, res) => {
db.all('SELECT * FROM products WHERE category LIKE ?', [`%${req.params.category}%`], (err, rows) => {
if (err) {
console.error('Error fetching products:', err);
return res.status(500).json({ error: 'Database error' });
}
res.json(rows);
});
});
// Create user
app.post('/api/users', validate(require('./src/middleware/validation').schemas.user), (req, res) => {
const { email } = req.body;
db.run('INSERT INTO users (email) VALUES (?)', [email], function(err) {
if (err) {
console.error('Error creating user:', err);
return res.status(500).json({ error: 'Database error' });
}
res.json({ id: this.lastID, email });
});
});
// Create style profile
app.post('/api/profiles', validate(require('./src/middleware/validation').schemas.profile), (req, res) => {
const { userId, sizes, preferredColors, stylePreferences, lifestyle, hardLines, mustHaves, budget } = req.body;
db.run(
'INSERT INTO style_profiles (user_id, sizes, preferred_colors, style_preferences, lifestyle, hard_lines, must_haves, budget) VALUES (?, ?, ?, ?, ?, ?, ?, ?)',
[userId, JSON.stringify(sizes), JSON.stringify(preferredColors), JSON.stringify(stylePreferences), lifestyle, JSON.stringify(hardLines), JSON.stringify(mustHaves), budget],
function(err) {
if (err) {
console.error('Error creating profile:', err);
return res.status(500).json({ error: 'Database error' });
}
res.json({ id: this.lastID, userId });
}
);
});
// Get style profile by user ID (auth required)
app.get('/api/profile/:userId', authenticate, (req, res) => {
// Only allow fetching your own profile
if (parseInt(req.params.userId) !== req.userId) {
return res.status(403).json({ error: 'Access denied' });
}
db.get(
'SELECT * FROM style_profiles WHERE user_id = ? ORDER BY created_at DESC LIMIT 1',
[req.params.userId],
(err, row) => {
if (err) {
console.error('Error fetching profile:', err);
return res.status(500).json({ error: 'Database error' });
}
if (!row) {
return res.status(404).json({ error: 'Profile not found' });
}
// Parse JSON fields
row.sizes = JSON.parse(row.sizes || '[]');
row.preferred_colors = JSON.parse(row.preferred_colors || '[]');
row.style_preferences = JSON.parse(row.style_preferences || '[]');
row.hard_lines = JSON.parse(row.hard_lines || '[]');
row.must_haves = JSON.parse(row.must_haves || '[]');
res.json(row);
}
);
});
// Generate curated box (auth required)
app.post('/api/box', authenticate, validate(require('./src/middleware/validation').schemas.box), (req, res) => {
const { userId, preferredColors, stylePreferences, budget } = req.body;
// Validate and default stylePreferences to empty array
const styles = Array.isArray(stylePreferences) ? stylePreferences : (stylePreferences ? JSON.parse(stylePreferences) : []);
// Get user's hard lines
db.get(
'SELECT hard_lines FROM style_profiles WHERE user_id = ? ORDER BY created_at DESC LIMIT 1',
[userId],
(err, profile) => {
if (err) {
console.error('Error fetching profile:', err);
return res.status(500).json({ error: 'Database error' });
}
const hardLines = JSON.parse(profile?.hard_lines || '[]');
// Get feedback to tune weights
db.all(
'SELECT * FROM feedback WHERE user_id = ?',
[userId],
(err, feedbackRows) => {
if (err) {
console.error('Error fetching feedback:', err);
return res.status(500).json({ error: 'Database error' });
}
// Default v1 weights
const defaultWeights = { colorMatch: 25, styleMatch: 35, sizeFit: 20, priceFit: 20 };
// If enough feedback, tune weights based on what predicts "would keep"
let weights = defaultWeights;
if (feedbackRows.length >= 10) {
const kept = feedbackRows.filter(f => f.would_keep === 1);
const notKept = feedbackRows.filter(f => f.would_keep === 0 || f.would_keep === null);
if (kept.length > 0 && notKept.length > 0) {
const avgRating = (rows, field) => rows.reduce((sum, r) => sum + (r[field] || 3), 0) / rows.length;
const keptColor = avgRating(kept, 'color_rating');
const notKeptColor = avgRating(notKept, 'color_rating');
const keptStyle = avgRating(kept, 'style_rating');
const notKeptStyle = avgRating(notKept, 'style_rating');
const keptFit = avgRating(kept, 'fit_rating');
const notKeptFit = avgRating(notKept, 'fit_rating');
// Positive delta = this factor predicts keeping
const deltas = {
color: Math.max(0, keptColor - notKeptColor),
style: Math.max(0, keptStyle - notKeptStyle),
fit: Math.max(0, keptFit - notKeptFit)
};
const totalDelta = deltas.color + deltas.style + deltas.fit || 0.01;
const learningRate = Math.min(0.5, feedbackRows.length / 50);
// Blend: retain 80% of defaults, shift 20% toward feedback signals (max 50% shift)
const blend = (def, signal) => Math.round(def * (1 - learningRate) + (signal / totalDelta) * 80 * learningRate);
weights = {
colorMatch: blend(defaultWeights.colorMatch, deltas.color),
styleMatch: blend(defaultWeights.styleMatch, deltas.style),
sizeFit: blend(defaultWeights.sizeFit, deltas.fit),
priceFit: Math.round(defaultWeights.priceFit * (1 - learningRate) + 20 * learningRate)
};
}
}
// Get all products
db.all('SELECT * FROM products', [], (err, products) => {
if (err) {
console.error('Error fetching products:', err);
return res.status(500).json({ error: 'Database error' });
}
// Score and filter products using tuned weights
const scoredProducts = products
.map(product => {
let score = 0;
// Color match
if (preferredColors.includes(product.color)) {
score += weights.colorMatch;
}
// Style match
if (styles.length > 0) {
let productStyleTags = JSON.parse(product.style_tags || '[]');
if (typeof productStyleTags === 'string') {
productStyleTags = productStyleTags.split(',').map(s => s.trim());
}
const matchingStyles = styles.filter(style =>
productStyleTags.some(tag => tag.toLowerCase().includes(style.toLowerCase()))
);
if (matchingStyles.length > 0) {
score += weights.styleMatch;
}
}
// Price fit
if (product.price <= budget) {
score += weights.priceFit;
}
return { ...product, score, weights };
})
.filter(product => {
// Filter out hard lines
const productStyleTags = JSON.parse(product.style_tags || '[]');
return !hardLines.some(hardLine =>
productStyleTags.some(tag => tag.toLowerCase().includes(hardLine.toLowerCase())) ||
product.title.toLowerCase().includes(hardLine.toLowerCase()) ||
product.brand.toLowerCase().includes(hardLine.toLowerCase())
);
})
.filter(product => product.price <= budget)
.sort((a, b) => b.score - a.score)
.slice(0, 6);
res.json({
products: scoredProducts,
totalMatches: scoredProducts.length,
tunedWeights: feedbackRows.length >= 10 ? weights : null
});
});
}
);
}
);
});
// Submit feedback (auth required)
app.post('/api/feedback', authenticate, validate(require('./src/middleware/validation').schemas.feedback), (req, res) => {
const { userId, productId, wouldKeep, fitRating, styleRating, colorRating, qualityRating } = req.body;
db.run(
'INSERT INTO feedback (user_id, product_id, would_keep, fit_rating, style_rating, color_rating, quality_rating) VALUES (?, ?, ?, ?, ?, ?, ?)',
[userId, productId, wouldKeep ? 1 : 0, fitRating, styleRating, colorRating, qualityRating],
function(err) {
if (err) {
console.error('Error submitting feedback:', err);
return res.status(500).json({ error: 'Database error' });
}
res.json({ id: this.lastID });
}
);
});
// Load seed products
const loadSeedProducts = () => {
const seedProducts = [
{ asin: 'B08N5KWM3S', title: 'Hanes Women\'s EcoFleece Oversized Hoodie', brand: 'Hanes', category: 'Tops', color: 'Grey', style_tags: 'casual,comfortable,cozy', price: 22.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: `https://www.amazon.com/dp/B08N5KWM3S?tag=${AFFILIATE_ID}` },
{ asin: 'B09Q5G7X1J', title: 'Gap Women\'s Classic French Terry Sweatpants', brand: 'Gap', category: 'Bottoms', color: 'Grey', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09Q5G7X1J?tag=${AFFILIATE_ID}` },
{ asin: 'B08T9N5J1K', title: 'Levi\'s Women\'s 511 Slim Fit Jeans', brand: 'Levi\'s', category: 'Bottoms', color: 'Blue', style_tags: 'classic,professional,slim', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08T9N5J1K?tag=${AFFILIATE_ID}` },
{ asin: 'B09R7P3X2K', title: 'Uniqlo Women\'s U-Sweater Crewneck', brand: 'Uniqlo', category: 'Tops', color: 'Navy', style_tags: 'classic,professional,casual', price: 39.90, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09R7P3X2K?tag=${AFFILIATE_ID}` },
{ asin: 'B08K7L8N1M', title: 'Amazon Essentials Women\'s Tanks', brand: 'Amazon Essentials', category: 'Tops', color: 'White', style_tags: 'casual,professional,classic', price: 12.99, image_url: 'https://m.media-amazon.com/images/I/51Z5J5X5X1L.jpg', affiliate_link: `https://www.amazon.com/dp/B08K7L8N1M?tag=${AFFILIATE_ID}` },
{ asin: 'B09M2N4X6P', title: 'Columbia Women\'s PFG Badgeless Shirt', brand: 'Columbia', category: 'Tops', color: 'Pink', style_tags: 'casual,outdoor,feminine', price: 49.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X2L.jpg', affiliate_link: `https://www.amazon.com/dp/B09M2N4X6P?tag=${AFFILIATE_ID}` },
{ asin: 'B08F1K7L3N', title: 'Calvin Klein Women\'s Cotton Briefs', brand: 'Calvin Klein', category: 'Undergarments', color: 'White', style_tags: 'professional,classic,classic', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B08F1K7L3N?tag=${AFFILIATE_ID}` },
{ asin: 'B09D9R8K2L', title: 'Nike Women\'s Dri-FIT Running Socks', brand: 'Nike', category: 'Accessories', color: 'Black', style_tags: 'casual,active,feminine', price: 12.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B09D9R8K2L?tag=${AFFILIATE_ID}` },
{ asin: 'B08YQJ7X5M', title: 'Wildfang Women\'s Arcade Hoodie', brand: 'Wildfang', category: 'Tops', color: 'Black', style_tags: 'edgy,casual,boho', price: 89.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B08YQJ7X5M?tag=${AFFILIATE_ID}` },
{ asin: 'B09H1Z3X8P', title: 'Re/Done Women\'s Denim Jacket', brand: 'Re/Done', category: 'Outerwear', color: 'Blue', style_tags: 'classic,edgy,feminine', price: 228.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09H1Z3X8P?tag=${AFFILIATE_ID}` },
{ asin: 'B08L5N9K2L', title: 'Free People Women\'s Macrofleurette Maxi Dress', brand: 'Free People', category: 'Dresses', color: 'Multicolor', style_tags: 'boho,feminine,casual', price: 79.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08L5N9K2L?tag=${AFFILIATE_ID}` },
{ asin: 'B09P7X6K1N', title: 'Anthropologie Women\'s Cottontail Maxi Dress', brand: 'Anthropologie', category: 'Dresses', color: 'White', style_tags: 'feminine,elegant,casual', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09P7X6K1N?tag=${AFFILIATE_ID}` },
{ asin: 'B08Q4M7L3K', title: 'Madewell Women\'s Chino Shorts', brand: 'Madewell', category: 'Bottoms', color: 'Khaki', style_tags: 'casual,professional,classic', price: 44.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X1L.jpg', affiliate_link: `https://www.amazon.com/dp/B08Q4M7L3K?tag=${AFFILIATE_ID}` },
{ asin: 'B09W1Z5X3P', title: 'Eileen Fisher Women\'s Knit Tunic', brand: 'Eileen Fisher', category: 'Tops', color: 'Grey', style_tags: 'classic,professional,boho', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B09W1Z5X3P?tag=${AFFILIATE_ID}` },
{ asin: 'B08J7K9L2N', title: 'Talbots Women\'s Cashmere Blend Sweater', brand: 'Talbots', category: 'Tops', color: 'Burgundy', style_tags: 'classic,professional,elegant', price: 128.00, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B08J7K9L2N?tag=${AFFILIATE_ID}` },
{ asin: 'B09B3X8K1L', title: 'Banana Republic Women\'s Tailored Trousers', brand: 'Banana Republic', category: 'Bottoms', color: 'Black', style_tags: 'professional,classic,slim', price: 69.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B09B3X8K1L?tag=${AFFILIATE_ID}` },
{ asin: 'B08X7N4K2M', title: 'J.Crew Women\'s Lucid Sateen Pants', brand: 'J.Crew', category: 'Bottoms', color: 'Navy', style_tags: 'professional,classic,slim', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X2L.jpg', affiliate_link: `https://www.amazon.com/dp/B08X7N4K2M?tag=${AFFILIATE_ID}` },
{ asin: 'B09F2K6L1N', title: 'Old Navy Women\'s Power Stretch Jeans', brand: 'Old Navy', category: 'Bottoms', color: 'Blue', style_tags: 'casual,comfortable,classic', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09F2K6L1N?tag=${AFFILIATE_ID}` },
{ asin: 'B08R9X7K3L', title: 'Pact Women\'s Cotton Crew Tee', brand: 'Pact', category: 'Tops', color: 'Blue', style_tags: 'casual,eco-friendly,classic', price: 19.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X5L.jpg', affiliate_link: `https://www.amazon.com/dp/B08R9X7K3L?tag=${AFFILIATE_ID}` },
{ asin: 'B09L5Z2X4K', title: 'Pact Women\'s Cotton Cardigan', brand: 'Pact', category: 'Outerwear', color: 'Cream', style_tags: 'casual,eco-friendly,classic', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B09L5Z2X4K?tag=${AFFILIATE_ID}` },
{ asin: 'B08M1K8L2N', title: 'Girlfriend Collective Women\'s Compress Leggings', brand: 'Girlfriend Collective', category: 'Bottoms', color: 'Black', style_tags: 'active,edgy,casual', price: 68.00, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X3L.jpg', affiliate_link: `https://www.amazon.com/dp/B08M1K8L2N?tag=${AFFILIATE_ID}` },
{ asin: 'B09Q2K5L1M', title: 'Reversible Running Cap', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'active,casual,practical', price: 9.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J6X6X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B09Q2K5L1M?tag=${AFFILIATE_ID}` },
{ asin: 'B08T7X9K1L', title: 'Bamboo Silk Scarf', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71X7Y7Z7X6L.jpg', affiliate_link: `https://www.amazon.com/dp/B08T7X9K1L?tag=${AFFILIATE_ID}` },
{ asin: 'B09D1Z4K2P', title: 'Leather Tote Bag', brand: 'Amazon Basics', category: 'Accessories', color: 'Brown', style_tags: 'professional,classic,practical', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/81X8Z8Z8X7L.jpg', affiliate_link: `https://www.amazon.com/dp/B09D1Z4K2P?tag=${AFFILIATE_ID}` },
{ asin: 'B08W3K7L1N', title: 'Sunglasses - Oversized', brand: 'Amazon Basics', category: 'Accessories', color: 'Black', style_tags: 'feminine,edgy,casual', price: 14.99, image_url: 'https://m.media-amazon.com/images/I/91X9Z9Z9X4L.jpg', affiliate_link: `https://www.amazon.com/dp/B08W3K7L1N?tag=${AFFILIATE_ID}` },
{ asin: 'B09H5X2K3L', title: 'Beaded Necklace Set', brand: 'Etsy', category: 'Accessories', color: 'Multicolor', style_tags: 'boho,feminine,elegant', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/61Z6J7X7X9L.jpg', affiliate_link: `https://www.amazon.com/dp/B09H5X2K3L?tag=${AFFILIATE_ID}` },
// ── Phase 2 products (24 new, total 50) ──
{ asin: 'B07RYH2X4L', title: 'AUTOMET Women\'s Oversized Sweater', brand: 'AUTOMET', category: 'Tops', color: 'Brown', style_tags: 'casual,cozy,comfortable', price: 32.99, image_url: 'https://m.media-amazon.com/images/I/71Z8Y8Z8Y1L.jpg', affiliate_link: `https://www.amazon.com/dp/B07RYH2X4L?tag=${AFFILIATE_ID}` },
{ asin: 'B0B2KXQ7PJ', title: 'ZESICA Women\'s Boho Floral Maxi Dress', brand: 'ZESICA', category: 'Dresses', color: 'Red', style_tags: 'boho,feminine,elegant', price: 45.99, image_url: 'https://m.media-amazon.com/images/I/81Y9Z9Z9Y2L.jpg', affiliate_link: `https://www.amazon.com/dp/B0B2KXQ7PJ?tag=${AFFILIATE_ID}` },
{ asin: 'B07G4DLY5V', title: 'GRACE KARIN Women\'s Pencil Skirt', brand: 'GRACE KARIN', category: 'Bottoms', color: 'Black', style_tags: 'professional,elegant,classic', price: 34.99, image_url: 'https://m.media-amazon.com/images/I/61A8B8C8D8L.jpg', affiliate_link: `https://www.amazon.com/dp/B07G4DLY5V?tag=${AFFILIATE_ID}` },
{ asin: 'B0BJ7P8X2M', title: 'ANRABESS Women\'s Two-Piece Lounge Set', brand: 'ANRABESS', category: 'Tops', color: 'Green', style_tags: 'casual,comfortable,active', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/71Z8Y8Z8Y3L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BJ7P8X2M?tag=${AFFILIATE_ID}` },
{ asin: 'B0B6GKCN8K', title: 'PRETTYGARDEN Women\'s Blazer Jacket', brand: 'PRETTYGARDEN', category: 'Outerwear', color: 'Purple', style_tags: 'professional,elegant,feminine', price: 52.99, image_url: 'https://m.media-amazon.com/images/I/81Y9Z9Z9Y4L.jpg', affiliate_link: `https://www.amazon.com/dp/B0B6GKCN8K?tag=${AFFILIATE_ID}` },
{ asin: 'B0BXKQ3P8N', title: 'Dokotoo Women\'s Linen Shorts', brand: 'Dokotoo', category: 'Bottoms', color: 'Yellow', style_tags: 'casual,comfortable,practical', price: 24.99, image_url: 'https://m.media-amazon.com/images/I/71Z8Y8Z8Y5L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BXKQ3P8N?tag=${AFFILIATE_ID}` },
{ asin: 'B08G1LX7P2', title: 'Columbia Women\'s Benton Springs Fleece', brand: 'Columbia', category: 'Outerwear', color: 'Red', style_tags: 'casual,outdoor,active', price: 44.99, image_url: 'https://m.media-amazon.com/images/I/81Y9Z9Z9Y6L.jpg', affiliate_link: `https://www.amazon.com/dp/B08G1LX7P2?tag=${AFFILIATE_ID}` },
{ asin: 'B08H2M5Q7K', title: 'HUE Women\'s Ultra Leggings', brand: 'HUE', category: 'Bottoms', color: 'Green', style_tags: 'casual,active,comfortable', price: 28.00, image_url: 'https://m.media-amazon.com/images/I/71Z8Y8Z8Y7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08H2M5Q7K?tag=${AFFILIATE_ID}` },
{ asin: 'B09MVJ3X8P', title: 'Allegra K Women\'s Peplum Top', brand: 'Allegra K', category: 'Tops', color: 'Orange', style_tags: 'feminine,elegant,professional', price: 36.99, image_url: 'https://m.media-amazon.com/images/I/81Y9Z9Z9Y8L.jpg', affiliate_link: `https://www.amazon.com/dp/B09MVJ3X8P?tag=${AFFILIATE_ID}` },
{ asin: 'B0BL3XQ7PJ', title: 'Wrangler Women\'s Retro High Rise Jean', brand: 'Wrangler', category: 'Bottoms', color: 'Brown', style_tags: 'classic,casual,edgy', price: 54.99, image_url: 'https://m.media-amazon.com/images/I/71Z8Y8Z8Y9L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BL3XQ7PJ?tag=${AFFILIATE_ID}` },
{ asin: 'B07QK3X6L2', title: 'V28 Women\'s V-Neck Racerback Tank', brand: 'V28', category: 'Tops', color: 'Purple', style_tags: 'active,casual,practical', price: 16.99, image_url: 'https://m.media-amazon.com/images/I/71A9B9C9D1L.jpg', affiliate_link: `https://www.amazon.com/dp/B07QK3X6L2?tag=${AFFILIATE_ID}` },
{ asin: 'B0C2HPX8KJ', title: 'BTFBM Women\'s Satin Cami Dress', brand: 'BTFBM', category: 'Dresses', color: 'Yellow', style_tags: 'feminine,elegant,casual', price: 42.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D2L.jpg', affiliate_link: `https://www.amazon.com/dp/B0C2HPX8KJ?tag=${AFFILIATE_ID}` },
{ asin: 'B0B14KQ3MN', title: 'LILLUSORY Women\'s Knit Cardigan', brand: 'LILLUSORY', category: 'Outerwear', color: 'Brown', style_tags: 'cozy,casual,feminine', price: 47.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D3L.jpg', affiliate_link: `https://www.amazon.com/dp/B0B14KQ3MN?tag=${AFFILIATE_ID}` },
{ asin: 'B0BHX2M5L8', title: 'New Balance Women\'s 574 Sneaker', brand: 'New Balance', category: 'Shoes', color: 'Grey', style_tags: 'casual,active,classic', price: 74.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D4L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BHX2M5L8?tag=${AFFILIATE_ID}` },
{ asin: 'B0CDKQ3X7M', title: 'Soda Women\'s Open Toe Sandal', brand: 'Soda', category: 'Shoes', color: 'Brown', style_tags: 'feminine,casual,boho', price: 29.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D5L.jpg', affiliate_link: `https://www.amazon.com/dp/B0CDKQ3X7M?tag=${AFFILIATE_ID}` },
{ asin: 'B0BFWJX2P8', title: 'Dr. Scholl\'s Women\'s Time Off Sneaker', brand: 'Dr. Scholl\'s', category: 'Shoes', color: 'White', style_tags: 'casual,comfortable,classic', price: 59.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D6L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BFWJX2P8?tag=${AFFILIATE_ID}` },
{ asin: 'B08L9Q7R3K', title: 'Sam Edelman Women\'s Hazel Pump', brand: 'Sam Edelman', category: 'Shoes', color: 'Red', style_tags: 'elegant,feminine,professional', price: 79.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D7L.jpg', affiliate_link: `https://www.amazon.com/dp/B08L9Q7R3K?tag=${AFFILIATE_ID}` },
{ asin: 'B07VK9P7K2', title: 'Fossil Women\'s Leather Crossbody', brand: 'Fossil', category: 'Accessories', color: 'Brown', style_tags: 'professional,classic,practical', price: 69.99, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D8L.jpg', affiliate_link: `https://www.amazon.com/dp/B07VK9P7K2?tag=${AFFILIATE_ID}` },
{ asin: 'B08XJ8M2L7', title: 'Kate Spade New York Stud Earrings', brand: 'Kate Spade', category: 'Accessories', color: 'Gold', style_tags: 'feminine,elegant,classic', price: 34.00, image_url: 'https://m.media-amazon.com/images/I/81A9B9C9D9L.jpg', affiliate_link: `https://www.amazon.com/dp/B08XJ8M2L7?tag=${AFFILIATE_ID}` },
{ asin: 'B09V1X4K8P', title: 'Maidenform Women\'s Comfort Devotion Bra', brand: 'Maidenform', category: 'Undergarments', color: 'Pink', style_tags: 'comfortable,classic,feminine', price: 27.99, image_url: 'https://m.media-amazon.com/images/I/71Z9A9B9C1L.jpg', affiliate_link: `https://www.amazon.com/dp/B09V1X4K8P?tag=${AFFILIATE_ID}` },
{ asin: 'B0B6X8K5L2', title: 'Hanes Women\'s French Terry Jogger', brand: 'Hanes', category: 'Bottoms', color: 'Orange', style_tags: 'comfortable,casual,active', price: 19.99, image_url: 'https://m.media-amazon.com/images/I/71Z9A9B9C2L.jpg', affiliate_link: `https://www.amazon.com/dp/B0B6X8K5L2?tag=${AFFILIATE_ID}` },
{ asin: 'B09KXQ7P3L', title: 'Roxy Women\'s Beach Classics Bikini', brand: 'Roxy', category: 'Tops', color: 'Yellow', style_tags: 'active,casual,feminine', price: 34.99, image_url: 'https://m.media-amazon.com/images/I/71Z9A9B9C3L.jpg', affiliate_link: `https://www.amazon.com/dp/B09KXQ7P3L?tag=${AFFILIATE_ID}` },
{ asin: 'B0C5JX8K2N', title: 'Lacozy Women\'s Wrap Dress', brand: 'Lacozy', category: 'Dresses', color: 'Green', style_tags: 'feminine,casual,boho', price: 39.99, image_url: 'https://m.media-amazon.com/images/I/71Z9A9B9C4L.jpg', affiliate_link: `https://www.amazon.com/dp/B0C5JX8K2N?tag=${AFFILIATE_ID}` },
{ asin: 'B0BK7P3X8Q', title: 'MINTLIMIT Women\'s Hiking Pants', brand: 'MINTLIMIT', category: 'Bottoms', color: 'Purple', style_tags: 'active,outdoor,practical', price: 31.99, image_url: 'https://m.media-amazon.com/images/I/71Z9A9B9C5L.jpg', affiliate_link: `https://www.amazon.com/dp/B0BK7P3X8Q?tag=${AFFILIATE_ID}` }
];
seedProducts.forEach(product => {
db.run(
`INSERT OR IGNORE INTO products (asin, title, brand, category, color, style_tags, price, image_url, affiliate_link)
VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
[
product.asin,
product.title,
product.brand,
product.category,
product.color,
JSON.stringify(product.style_tags),
product.price,
product.image_url,
product.affiliate_link
],
(err) => {
if (err) console.error('Error inserting product:', err);
}
);
});
};
// Initialize database and load seed data
loadSeedProducts();
// Start server
app.listen(PORT, () => {
console.log(`Server running on port ${PORT}`);
});

View file

@ -0,0 +1,194 @@
const Joi = require('joi');
// --- Schema Definitions ---
const emailSchema = Joi.string()
.email()
.required()
.messages({
'string.email': 'Invalid email format',
'any.required': 'Email is required',
});
const budgetSchema = Joi.number()
.integer()
.valid(100, 250)
.messages({
'number.base': 'Budget must be a number',
'number.integer': 'Budget must be an integer',
'any.only': 'Budget must be 100 or 250',
});
const ratingSchema = Joi.number()
.integer()
.min(1)
.max(5)
.messages({
'number.base': 'Rating must be a number',
'number.integer': 'Rating must be an integer',
'number.min': 'Rating must be at least 1',
'number.max': 'Rating must be at most 5',
});
const boxIdSchema = Joi.string()
.min(5)
.required()
.messages({
'string.base': 'Box ID must be a string',
'string.min': 'Box ID must be at least 5 characters',
'any.required': 'Box ID is required',
});
const nonEmptyString = Joi.string()
.min(1)
.required()
.messages({
'string.base': 'Value must be a string',
'string.min': 'Value must not be empty',
'any.required': 'This field is required',
});
const userIdSchema = Joi.string()
.min(1)
.required()
.messages({
'string.base': 'User ID must be a string',
'string.min': 'User ID must not be empty',
'any.required': 'User ID is required',
});
const profileIdSchema = Joi.string()
.min(1)
.required()
.messages({
'string.base': 'Profile ID must be a string',
'string.min': 'Profile ID must not be empty',
'any.required': 'Profile ID is required',
});
// --- Request Schemas ---
const feedbackSchema = Joi.object({
userId: userIdSchema,
productId: Joi.number().integer().required(),
boxId: boxIdSchema.optional(),
wouldKeep: Joi.boolean().optional(),
fitRating: ratingSchema.optional(),
styleRating: ratingSchema.optional(),
colorRating: ratingSchema.optional(),
qualityRating: ratingSchema.optional(),
comment: Joi.string().max(500).optional(),
});
const boxSchema = Joi.object({
userId: userIdSchema,
profileId: profileIdSchema.optional(),
preferredColors: Joi.array().items(Joi.string()).optional(),
stylePreferences: Joi.alternatives().try(
Joi.array().items(Joi.string()),
Joi.string()
).optional(),
budget: budgetSchema.optional(),
totalPrice: budgetSchema.optional(),
});
const profileSchema = Joi.object({
userId: userIdSchema,
sizes: Joi.array().items(Joi.string()).optional(),
preferredColors: Joi.array().items(Joi.string()).optional(),
stylePreferences: Joi.alternatives().try(
Joi.array().items(Joi.string()),
Joi.string()
).optional(),
lifestyle: Joi.string().max(500).optional(),
hardLines: Joi.array().items(Joi.string()).optional(),
mustHaves: Joi.array().items(Joi.string()).optional(),
budget: budgetSchema.optional(),
});
const userSchema = Joi.object({
email: emailSchema,
});
// --- Sanitization ---
/**
* Recursively sanitize an object:
* - HTML-encodes < and > (XSS prevention)
* - Trims whitespace on strings
*/
function sanitizeValue(value) {
if (typeof value === 'string') {
return value
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.trim();
}
if (Array.isArray(value)) {
return value.map(sanitizeValue);
}
if (value !== null && typeof value === 'object') {
const sanitized = {};
for (const [key, val] of Object.entries(value)) {
sanitized[key] = sanitizeValue(val);
}
return sanitized;
}
return value;
}
// --- Middleware ---
/**
* Express middleware that sanitizes req.body recursively
*/
function sanitizeBody(req, res, next) {
if (req.body && typeof req.body === 'object') {
req.body = sanitizeValue(req.body);
}
next();
}
/**
* Factory: returns middleware that validates req.body against a Joi schema.
* On failure, responds with 400 + descriptive error messages.
*/
function validate(schema) {
return (req, res, next) => {
const { error, value } = schema.validate(req.body, {
abortEarly: false,
stripUnknown: true,
});
if (error) {
const messages = error.details.map((d) => d.message);
return res.status(400).json({ error: 'Validation failed', details: messages });
}
req.body = value;
next();
};
}
// --- Exports ---
module.exports = {
// Middleware
sanitizeBody,
validate,
// Schemas (for direct use / testing)
schemas: {
feedback: feedbackSchema,
box: boxSchema,
profile: profileSchema,
user: userSchema,
email: emailSchema,
budget: budgetSchema,
rating: ratingSchema,
boxId: boxIdSchema,
},
// Utilities
sanitizeValue,
};

View file

@ -0,0 +1,3 @@
{
"extends": "next/core-web-vitals"
}

View file

@ -0,0 +1,14 @@
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
async rewrites() {
return [
{
source: '/api/:path*',
destination: 'http://localhost:3001/api/:path*'
}
]
},
}
module.exports = nextConfig

1561
wardrobe-ai/frontend/package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,21 @@
{
"name": "wardrobe-ai-frontend",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"next": "^14.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"autoprefixer": "^10.4.16",
"postcss": "^8.4.31",
"tailwindcss": "^3.3.0"
}
}

View file

@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

View file

@ -0,0 +1,289 @@
import { useState, useEffect } from 'react';
import { useRouter } from 'next/router';
export default function CuratedBox() {
const router = useRouter();
const [box, setBox] = useState(null);
const [feedback, setFeedback] = useState({});
const [userId, setUserId] = useState(null);
const [profile, setProfile] = useState(null);
const [loadingProfile, setLoadingProfile] = useState(false);
useEffect(() => {
const userIdParam = router.query.userId;
if (userIdParam) {
setUserId(userIdParam);
fetchProfile(userIdParam);
}
}, [router.query]);
const fetchProfile = async (userId) => {
try {
setLoadingProfile(true);
const token = localStorage.getItem('wardrobe_token');
const response = await fetch(`/api/profile/${userId}`, {
headers: token ? { 'Authorization': `Bearer ${token}` } : {}
});
if (response.status === 401) {
// Auth required — store return URL and redirect
window.location.href = `/?login=required&redirect=box&userId=${userId}`;
return;
}
const data = await response.json();
if (response.ok) {
// Convert underscore fields to camelCase for consistency
setProfile({
preferredColors: data.preferred_colors || [],
stylePreferences: data.style_preferences || [],
budget: data.budget || 100,
hardLines: data.hard_lines || []
});
} else {
console.error('Failed to fetch profile:', data.error);
}
} catch (error) {
console.error('Error fetching profile:', error);
} finally {
setLoadingProfile(false);
}
};
const generateBox = async (userId) => {
try {
// TODO: Add authentication - verify user has permission to fetch this profile
// Use actual user profile preferences (already fetched in fetchProfile), or fallback to defaults
const preferredColors = profile?.preferredColors || ['Black', 'White', 'Navy', 'Grey'];
const stylePreferences = profile?.stylePreferences || ['Classic', 'Casual'];
const budget = profile?.budget || 100;
const response = await fetch('/api/box', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
...(localStorage.getItem('wardrobe_token') ? { 'Authorization': `Bearer ${localStorage.getItem('wardrobe_token')}` } : {})
},
body: JSON.stringify({
userId,
preferredColors,
stylePreferences,
budget
})
});
const data = await response.json();
setBox(data);
} catch (error) {
console.error('Error generating box:', error);
}
};
// Generate box when profile is loaded
useEffect(() => {
if (userId && profile) {
generateBox(userId);
}
}, [userId, profile]);
const handleFeedbackChange = (productId, field, value) => {
setFeedback(prev => ({
...prev,
[productId]: {
...prev[productId],
[field]: value
}
}));
};
const submitFeedback = async (productId) => {
const userFeedback = feedback[productId];
if (!userFeedback) return;
try {
await fetch('/api/feedback', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
...(localStorage.getItem('wardrobe_token') ? { 'Authorization': `Bearer ${localStorage.getItem('wardrobe_token')}` } : {})
},
body: JSON.stringify({
userId,
productId,
wouldKeep: userFeedback.wouldKeep,
fitRating: userFeedback.fitRating,
styleRating: userFeedback.styleRating,
colorRating: userFeedback.colorRating,
qualityRating: userFeedback.qualityRating
})
});
} catch (error) {
console.error('Error submitting feedback:', error);
}
};
if (!box) {
return (
<div className="min-h-screen flex items-center justify-center">
<div className="animate-spin rounded-full h-16 w-16 border-t-4 border-purple-600"></div>
</div>
);
}
return (
<div className="max-w-7xl mx-auto px-4 py-8">
<div className="text-center mb-12">
<h1 className="text-4xl font-bold text-gray-900 mb-4">Your Curated Box</h1>
<p className="text-gray-600">
Based on your preferences, we've selected {box.totalMatches} items just for you
</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{box.products.map(product => (
<div key={product.id} className="bg-white rounded-xl shadow-lg overflow-hidden">
<div className="relative aspect-video">
<img
src={product.image_url}
alt={product.title}
className="w-full h-full object-cover"
/>
</div>
<div className="p-6">
<div className="flex justify-between items-start mb-2">
<div>
<h3 className="text-xl font-bold text-gray-900">{product.title}</h3>
<p className="text-gray-600">{product.brand}</p>
</div>
<span className="text-xl font-bold text-purple-600">
${product.price}
</span>
</div>
<div className="flex flex-wrap gap-2 mt-3 mb-4">
{JSON.parse(product.style_tags).map(tag => (
<span key={tag} className="px-2 py-1 bg-purple-100 text-purple-700 rounded text-sm">
{tag}
</span>
))}
</div>
<div className="flex items-center justify-between mb-4">
<a
href={product.affiliate_link}
target="_blank"
rel="noopener noreferrer"
className="bg-purple-600 text-white px-4 py-2 rounded-lg hover:bg-purple-700 transition-colors"
>
Buy on Amazon
</a>
<span className="text-gray-500 text-sm">
Score: {product.score}/100
</span>
</div>
{/* Feedback Form */}
<div className="border-t pt-4">
<h4 className="font-semibold mb-3">Rate this item:</h4>
<div className="space-y-2">
<div>
<label className="block text-sm font-medium mb-1">
Would you keep it?
</label>
<div className="flex gap-2">
<button
onClick={() => handleFeedbackChange(product.id, 'wouldKeep', true)}
className={`px-3 py-1 rounded ${
feedback[product.id]?.wouldKeep === true
? 'bg-green-500 text-white'
: 'bg-gray-200'
}`}
>
Yes
</button>
<button
onClick={() => handleFeedbackChange(product.id, 'wouldKeep', false)}
className={`px-3 py-1 rounded ${
feedback[product.id]?.wouldKeep === false
? 'bg-red-500 text-white'
: 'bg-gray-200'
}`}
>
No
</button>
</div>
</div>
<div className="grid grid-cols-2 gap-4">
<div>
<label className="block text-sm font-medium mb-1">Fit</label>
<select
onChange={(e) => handleFeedbackChange(product.id, 'fitRating', parseInt(e.target.value))}
className="w-full px-2 py-1 border rounded"
>
<option value="">Select</option>
{[1, 2, 3, 4, 5].map(num => (
<option key={num} value={num}>{num}</option>
))}
</select>
</div>
<div>
<label className="block text-sm font-medium mb-1">Style</label>
<select
onChange={(e) => handleFeedbackChange(product.id, 'styleRating', parseInt(e.target.value))}
className="w-full px-2 py-1 border rounded"
>
<option value="">Select</option>
{[1, 2, 3, 4, 5].map(num => (
<option key={num} value={num}>{num}</option>
))}
</select>
</div>
<div>
<label className="block text-sm font-medium mb-1">Color</label>
<select
onChange={(e) => handleFeedbackChange(product.id, 'colorRating', parseInt(e.target.value))}
className="w-full px-2 py-1 border rounded"
>
<option value="">Select</option>
{[1, 2, 3, 4, 5].map(num => (
<option key={num} value={num}>{num}</option>
))}
</select>
</div>
<div>
<label className="block text-sm font-medium mb-1">Quality</label>
<select
onChange={(e) => handleFeedbackChange(product.id, 'qualityRating', parseInt(e.target.value))}
className="w-full px-2 py-1 border rounded"
>
<option value="">Select</option>
{[1, 2, 3, 4, 5].map(num => (
<option key={num} value={num}>{num}</option>
))}
</select>
</div>
</div>
<button
onClick={() => submitFeedback(product.id)}
className="w-full mt-3 bg-purple-600 text-white py-2 rounded hover:bg-purple-700"
>
Submit Feedback
</button>
</div>
</div>
</div>
</div>
))}
</div>
<div className="text-center mt-12">
<button
onClick={() => router.push('/')}
className="bg-gray-600 text-white px-8 py-3 rounded-lg hover:bg-gray-700 transition-colors"
>
Create New Profile
</button>
</div>
</div>
);
}

View file

@ -0,0 +1,13 @@
import Link from "next/link";
export default function Navbar() {
return (
<nav className="bg-white border-b border-gray-200 px-6 py-4">
<div className="max-w-7xl mx-auto">
<Link href="/" className="text-2xl font-bold text-gray-900">
WardrobeAI
</Link>
</div>
</nav>
);
}

View file

@ -0,0 +1,310 @@
import { useState } from 'react';
export default function StyleProfileForm() {
const [formData, setFormData] = useState({
email: '',
sizes: { tops: '', bottoms: '', shoes: '' },
preferredColors: [],
stylePreferences: [],
lifestyle: '',
hardLines: [],
mustHaves: [],
budget: 100
});
const allColors = ['Red', 'Blue', 'Green', 'Yellow', 'Orange', 'Purple', 'Pink', 'Black', 'White', 'Grey', 'Brown', 'Navy'];
const allStyles = ['Classic', 'Casual', 'Professional', 'Boho', 'Feminine', 'Edgy'];
const allLifestyles = ['Work', 'Casual', 'Active', 'Formal', 'Travel', 'Everyday'];
const allHardLines = ['Synthetic', 'Tight', 'Short', 'High Heels', 'Denim'];
const allMustHaves = ['Pockets', 'Machine Washable', 'Dry Clean Only', 'Layerable', 'Sustainable'];
const handleColorChange = (color) => {
setFormData(prev => ({
...prev,
preferredColors: prev.preferredColors.includes(color)
? prev.preferredColors.filter(c => c !== color)
: [...prev.preferredColors, color]
}));
};
const handleStyleChange = (style) => {
setFormData(prev => ({
...prev,
stylePreferences: prev.stylePreferences.includes(style)
? prev.stylePreferences.filter(s => s !== style)
: [...prev.stylePreferences, style]
}));
};
const handleHardLineChange = (line) => {
setFormData(prev => ({
...prev,
hardLines: prev.hardLines.includes(line)
? prev.hardLines.filter(l => l !== line)
: [...prev.hardLines, line]
}));
};
const handleMustHaveChange = (mustHave) => {
setFormData(prev => ({
...prev,
mustHaves: prev.mustHaves.includes(mustHave)
? prev.mustHaves.filter(m => m !== mustHave)
: [...prev.mustHaves, mustHave]
}));
};
const handleSubmit = async (e) => {
e.preventDefault();
try {
// Create user
const userRes = await fetch('/api/users', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email: formData.email })
});
const user = await userRes.json();
// Create profile
const profileRes = await fetch('/api/profiles', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
userId: user.id,
sizes: formData.sizes,
preferredColors: formData.preferredColors,
stylePreferences: formData.stylePreferences,
lifestyle: formData.lifestyle,
hardLines: formData.hardLines,
mustHaves: formData.mustHaves,
budget: formData.budget
})
});
if (profileRes.ok) {
// Redirect to box generation
window.location.href = `/box?userId=${user.id}`;
}
} catch (error) {
console.error('Error:', error);
alert('Error creating profile. Please try again.');
}
};
return (
<div className="max-w-4xl mx-auto px-4 py-8">
<div className="text-center mb-12">
<h1 className="text-4xl font-bold text-gray-900 mb-4">Style Profile</h1>
<p className="text-gray-600">Tell us about your style preferences to get personalized recommendations</p>
</div>
<form onSubmit={handleSubmit} className="space-y-8">
{/* Email */}
<div>
<label htmlFor="email" className="block text-lg font-medium mb-2">Email Address</label>
<input
type="email"
id="email"
required
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
value={formData.email}
onChange={(e) => setFormData({ ...formData, email: e.target.value })}
placeholder="your@email.com"
/>
</div>
{/* Sizes */}
<div>
<label className="block text-lg font-medium mb-4">Sizes</label>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div>
<label htmlFor="tops" className="block text-sm font-medium mb-1">Tops</label>
<select
id="tops"
className="w-full px-4 py-2 border border-gray-300 rounded-lg"
onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, tops: e.target.value } })}
>
<option value="">Select size</option>
<option value="XS">XS</option>
<option value="S">S</option>
<option value="M">M</option>
<option value="L">L</option>
<option value="XL">XL</option>
</select>
</div>
<div>
<label htmlFor="bottoms" className="block text-sm font-medium mb-1">Bottoms</label>
<select
id="bottoms"
className="w-full px-4 py-2 border border-gray-300 rounded-lg"
onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, bottoms: e.target.value } })}
>
<option value="">Select size</option>
<option value="XS">XS</option>
<option value="S">S</option>
<option value="M">M</option>
<option value="L">L</option>
<option value="XL">XL</option>
</select>
</div>
<div>
<label htmlFor="shoes" className="block text-sm font-medium mb-1">Shoes</label>
<select
id="shoes"
className="w-full px-4 py-2 border border-gray-300 rounded-lg"
onChange={(e) => setFormData({ ...formData, sizes: { ...formData.sizes, shoes: e.target.value } })}
>
<option value="">Select size</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
</select>
</div>
</div>
</div>
{/* Preferred Colors */}
<div>
<label className="block text-lg font-medium mb-4">Preferred Colors</label>
<div className="flex flex-wrap gap-3">
{allColors.map(color => (
<button
key={color}
type="button"
onClick={() => handleColorChange(color)}
className={`px-4 py-2 rounded-full border-2 transition-all ${
formData.preferredColors.includes(color)
? 'bg-purple-500 border-purple-500 text-white'
: 'bg-white border-gray-300 hover:border-purple-500'
}`}
>
{color}
</button>
))}
</div>
</div>
{/* Style Preferences */}
<div>
<label className="block text-lg font-medium mb-4">Style Preferences</label>
<div className="grid grid-cols-2 md:grid-cols-3 gap-3">
{allStyles.map(style => (
<button
key={style}
type="button"
onClick={() => handleStyleChange(style)}
className={`px-4 py-3 rounded-lg border-2 transition-all ${
formData.stylePreferences.includes(style)
? 'bg-purple-500 border-purple-500 text-white'
: 'bg-white border-gray-300 hover:border-purple-500'
}`}
>
{style}
</button>
))}
</div>
</div>
{/* Lifestyle */}
<div>
<label htmlFor="lifestyle" className="block text-lg font-medium mb-2">Lifestyle</label>
<select
id="lifestyle"
required
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
onChange={(e) => setFormData({ ...formData, lifestyle: e.target.value })}
>
<option value="">Select lifestyle</option>
{allLifestyles.map(lifestyle => (
<option key={lifestyle} value={lifestyle}>{lifestyle}</option>
))}
</select>
</div>
{/* Hard Lines */}
<div>
<label className="block text-lg font-medium mb-4">Hard Lines (What you won't wear)</label>
<div className="grid grid-cols-2 gap-3">
{allHardLines.map(line => (
<button
key={line}
type="button"
onClick={() => handleHardLineChange(line)}
className={`px-4 py-2 rounded-lg border-2 transition-all ${
formData.hardLines.includes(line)
? 'bg-red-500 border-red-500 text-white'
: 'bg-white border-gray-300 hover:border-red-500'
}`}
>
{line}
</button>
))}
</div>
</div>
{/* Must Haves */}
<div>
<label className="block text-lg font-medium mb-4">Must Haves</label>
<div className="grid grid-cols-2 md:grid-cols-3 gap-3">
{allMustHaves.map(mustHave => (
<button
key={mustHave}
type="button"
onClick={() => handleMustHaveChange(mustHave)}
className={`px-4 py-2 rounded-lg border-2 transition-all ${
formData.mustHaves.includes(mustHave)
? 'bg-green-500 border-green-500 text-white'
: 'bg-white border-gray-300 hover:border-green-500'
}`}
>
{mustHave}
</button>
))}
</div>
</div>
{/* Budget */}
<div>
<label className="block text-lg font-medium mb-2">Budget</label>
<div className="flex gap-4">
<button
type="button"
onClick={() => setFormData({ ...formData, budget: 100 })}
className={`px-6 py-3 rounded-lg border-2 transition-all ${
formData.budget === 100
? 'bg-purple-500 border-purple-500 text-white'
: 'bg-white border-gray-300 hover:border-purple-500'
}`}
>
$100
</button>
<button
type="button"
onClick={() => setFormData({ ...formData, budget: 250 })}
className={`px-6 py-3 rounded-lg border-2 transition-all ${
formData.budget === 250
? 'bg-purple-500 border-purple-500 text-white'
: 'bg-white border-gray-300 hover:border-purple-500'
}`}
>
$250
</button>
</div>
</div>
<button
type="submit"
className="w-full bg-purple-600 text-white py-4 rounded-lg text-lg font-semibold hover:bg-purple-700 transition-colors"
>
Get Your Curated Box
</button>
</form>
</div>
);
}

View file

@ -0,0 +1,38 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
--max-width: 1200px;
--border-radius: 12px;
}
* {
box-sizing: border-box;
padding: 0;
margin: 0;
}
html,
body {
max-width: 100vw;
overflow-x: hidden;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
color: #1a1a1a;
line-height: 1.6;
}
a {
color: inherit;
text-decoration: none;
}
@media (prefers-color-scheme: dark) {
:root {
color: #f0f0f0;
background-color: #1a1a1a;
}
}

View file

@ -0,0 +1,17 @@
import { Inter } from "next/font/google";
import "./globals.css";
const inter = Inter({ subsets: ["latin"] });
export const metadata = {
title: "WardrobeAI",
description: "Personalized clothing curation",
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body className={inter.className}>{children}</body>
</html>
);
}

View file

@ -0,0 +1,16 @@
// Next.js API route proxy to backend
import { createProxyMiddleware } from 'http-proxy-middleware';
export default function handler(req, res) {
const backendUrl = process.env.BACKEND_URL || 'http://localhost:3001';
const proxy = createProxyMiddleware({
target: backendUrl,
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
}
});
return proxy(req, res);
}

View file

@ -0,0 +1,11 @@
const { exec } = require('child_process');
export default function handler(req, res) {
const PORT = 3001; // Backend port
if (req.method === 'GET') {
res.status(200).json({ backendPort: PORT });
} else {
res.status(405).end();
}
}

View file

@ -0,0 +1,11 @@
const { exec } = require('child_process');
export default function handler(req, res) {
const PORT = 3001; // Backend port
if (req.method === 'GET') {
res.status(200).json({ backendPort: PORT });
} else {
res.status(405).end();
}
}

View file

@ -0,0 +1,5 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
export default function handler(req, res) {
res.status(200).json({ name: 'WardrobeAI API' });
}

View file

@ -0,0 +1,13 @@
import Navbar from "./Navbar";
import CuratedBox from "./CuratedBox";
export default function BoxPage() {
return (
<div className="min-h-screen bg-gray-50">
<Navbar />
<main>
<CuratedBox />
</main>
</div>
);
}

View file

@ -0,0 +1,13 @@
import Navbar from "./Navbar";
import StyleProfileForm from "./StyleProfileForm";
export default function Home() {
return (
<div className="min-h-screen bg-gray-50">
<Navbar />
<main>
<StyleProfileForm />
</main>
</div>
);
}

View file

@ -0,0 +1,10 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}",
],
theme: {
extend: {},
},
plugins: [],
}

View file

@ -0,0 +1,28 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"plugins": [
{
"name": "next"
}
],
"paths": {
"@/*": ["./src/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
"exclude": ["node_modules"]
}

23
wardrobe-ai/package.json Normal file
View file

@ -0,0 +1,23 @@
{
"name": "wardrobe-ai",
"version": "0.1.0",
"description": "Personalized clothing curation engine",
"main": "server/index.js",
"scripts": {
"dev": "concurrently \"npm run dev:frontend\" \"npm run dev:backend\"",
"dev:frontend": "cd frontend && npm run dev",
"dev:backend": "cd backend && npm run dev",
"build": "cd frontend && npm run build",
"start": "cd backend && node index.js"
},
"keywords": [
"wardrobe",
"curation",
"amazon",
"recommendations"
],
"license": "MIT",
"devDependencies": {
"concurrently": "^8.2.2"
}
}

315
wardrobe-ai/site/index.html Normal file
View file

@ -0,0 +1,315 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wardrobe AI — Your Personal Stylist, Powered by AI</title>
<style>
:root {
--rose: #e8a0bf;
--rose-dark: #c77d9f;
--sage: #9caf88;
--sage-dark: #7a8f6a;
--cream: #fdf6f0;
--charcoal: #2d2d2d;
--text: #3a3a3a;
--text-light: #6b6b6b;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'Georgia', 'Times New Roman', serif;
background: var(--cream);
color: var(--text);
line-height: 1.6;
}
.container { max-width: 960px; margin: 0 auto; padding: 0 24px; }
/* Hero */
.hero {
text-align: center;
padding: 80px 0 60px;
background: linear-gradient(135deg, #fdf6f0 0%, #f7e8f0 50%, #eef2ea 100%);
}
.hero h1 {
font-size: 3rem;
color: var(--charcoal);
margin-bottom: 16px;
letter-spacing: -0.5px;
}
.hero .accent { color: var(--rose-dark); }
.hero p {
font-size: 1.25rem;
color: var(--text-light);
max-width: 600px;
margin: 0 auto 32px;
}
.cta-button {
display: inline-block;
background: var(--rose-dark);
color: white;
padding: 16px 40px;
border-radius: 8px;
text-decoration: none;
font-size: 1.1rem;
font-weight: bold;
transition: background 0.2s;
border: none;
cursor: pointer;
}
.cta-button:hover { background: var(--rose); }
/* How It Works */
.how-it-works {
padding: 80px 0;
}
.how-it-works h2, .differentiators h2, .pricing h2, .waitlist h2 {
text-align: center;
font-size: 2rem;
color: var(--charcoal);
margin-bottom: 48px;
}
.steps {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
}
.step {
text-align: center;
padding: 32px 20px;
background: white;
border-radius: 12px;
box-shadow: 0 2px 16px rgba(0,0,0,0.04);
}
.step-number {
display: inline-block;
width: 48px;
height: 48px;
line-height: 48px;
background: var(--sage);
color: white;
border-radius: 50%;
font-size: 1.5rem;
font-weight: bold;
margin-bottom: 16px;
}
.step h3 { font-size: 1.2rem; color: var(--charcoal); margin-bottom: 8px; }
.step p { color: var(--text-light); font-size: 0.95rem; }
/* Differentiators */
.differentiators {
padding: 80px 0;
background: white;
}
.diff-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
max-width: 800px;
margin: 0 auto;
}
.diff-card {
padding: 24px;
border-left: 4px solid var(--sage);
background: var(--cream);
border-radius: 0 8px 8px 0;
}
.diff-card h3 { color: var(--charcoal); margin-bottom: 8px; }
.diff-card p { color: var(--text-light); font-size: 0.95rem; }
/* Pricing */
.pricing {
padding: 80px 0;
text-align: center;
}
.price-card {
display: inline-block;
background: white;
border-radius: 12px;
box-shadow: 0 4px 24px rgba(0,0,0,0.06);
padding: 48px 40px;
border: 2px solid var(--rose);
}
.price-amount { font-size: 2.5rem; font-weight: bold; color: var(--charcoal); }
.price-period { color: var(--text-light); margin-bottom: 24px; }
.price-features {
list-style: none;
text-align: left;
margin: 24px 0;
}
.price-features li {
padding: 8px 0;
color: var(--text-light);
}
.price-features li::before { content: "✓ "; color: var(--sage-dark); font-weight: bold; }
/* Waitlist */
.waitlist {
padding: 80px 0;
background: linear-gradient(135deg, #eef2ea 0%, #f7e8f0 100%);
text-align: center;
}
.waitlist p { color: var(--text-light); max-width: 500px; margin: 0 auto 24px; }
.waitlist-form {
display: flex;
gap: 12px;
max-width: 460px;
margin: 0 auto;
justify-content: center;
}
.waitlist-form input[type="email"] {
flex: 1;
padding: 14px 20px;
border: 2px solid #ddd;
border-radius: 8px;
font-size: 1rem;
font-family: inherit;
}
.waitlist-form button {
padding: 14px 28px;
background: var(--charcoal);
color: white;
border: none;
border-radius: 8px;
font-size: 1rem;
cursor: pointer;
font-family: inherit;
font-weight: bold;
}
.waitlist-form button:hover { background: #4a4a4a; }
/* Footer */
footer {
text-align: center;
padding: 40px 0;
color: var(--text-light);
font-size: 0.85rem;
}
footer a { color: var(--rose-dark); }
@media (max-width: 720px) {
.steps, .diff-grid { grid-template-columns: 1fr; }
.hero h1 { font-size: 2rem; }
.waitlist-form { flex-direction: column; }
}
</style>
</head>
<body>
<!-- Hero -->
<section class="hero">
<div class="container">
<h1>Clothes you'll <span class="accent">love</span>.<br>Without the scroll.</h1>
<p>
Wardrobe AI curates clothing from real designers — picked for your style,
your size, and your budget. No trends. No algorithms optimizing for ad revenue.
Just clothes that feel like <em>you</em>.
</p>
<a href="#waitlist" class="cta-button">Get Early Access</a>
</div>
</section>
<!-- How It Works -->
<section class="how-it-works">
<div class="container">
<h2>How It Works</h2>
<div class="steps">
<div class="step">
<div class="step-number">1</div>
<h3>Tell Us Your Style</h3>
<p>Share your sizes, favorite colors, style preferences, and what you absolutely won't wear. Takes 2 minutes.</p>
</div>
<div class="step">
<div class="step-number">2</div>
<h3>AI Curates Your Box</h3>
<p>Our curation engine matches you with pieces from small designers and boutique brands — filtered for fit and budget.</p>
</div>
<div class="step">
<div class="step-number">3</div>
<h3>Love It or Learn</h3>
<p>Keep what you love. Rate what you don't. Every box gets smarter because the AI learns from <em>your</em> taste.</p>
</div>
</div>
</div>
</section>
<!-- Differentiators -->
<section class="differentiators">
<div class="container">
<h2>Not Another Subscription Box</h2>
<div class="diff-grid">
<div class="diff-card">
<h3>🏷️ Real Designers, Not Fast Fashion</h3>
<p>We curate from small businesses and boutique brands — clothes with craftsmanship, not warehouse overstock.</p>
</div>
<div class="diff-card">
<h3>🧠 Learns Your Taste</h3>
<p>Rate what you receive. Every rating trains the engine. Box #3 is smarter than box #1 — and it keeps improving.</p>
</div>
<div class="diff-card">
<h3>💰 Within Your Budget</h3>
<p>Set your per-item budget ($50, $100, $150). We never send items above it. Respect for your wallet is built in.</p>
</div>
<div class="diff-card">
<h3>🚫 Your Hard Lines, Respected</h3>
<p>No synthetics. No florals. No crop tops. Whatever your boundaries are, the engine treats them as rules, not suggestions.</p>
</div>
</div>
</div>
</section>
<!-- Pricing -->
<section class="pricing">
<div class="container">
<h2>Simple Pricing</h2>
<div class="price-card">
<div class="price-amount">Free</div>
<div class="price-period">during early access</div>
<ul class="price-features">
<li>Personalized style profile</li>
<li>AI-curated boxes on demand</li>
<li>Feedback-powered learning engine</li>
<li>Products from boutique brands</li>
<li>Budget-respecting curation</li>
<li>No subscription, no commitment</li>
</ul>
<p style="color: var(--text-light); font-size: 0.85rem;">You only pay for what you buy. We earn through brand partnerships — never by selling your data.</p>
</div>
</div>
</section>
<!-- Waitlist -->
<section class="waitlist" id="waitlist">
<div class="container">
<h2>Be First in Line</h2>
<p>Wardrobe AI is in early access. Drop your email and we'll let you know when your personal stylist is ready.</p>
<form class="waitlist-form" onsubmit="handleSubmit(event)">
<input type="email" id="email" placeholder="you@email.com" required>
<button type="submit">Join Waitlist</button>
</form>
<p id="confirmation" style="display:none; margin-top: 16px; color: var(--sage-dark); font-weight: bold;">
🎉 You're on the list! We'll be in touch.
</p>
</div>
</section>
<footer>
<div class="container">
<p>Wardrobe AI · Built with care in Washington · <a href="https://os.scoble.me/forgejo/sscoble/wardrobe-ai">View on Forgejo</a></p>
</div>
</footer>
<script>
function handleSubmit(e) {
e.preventDefault();
const email = document.getElementById('email').value;
// Store in localStorage for now (backend coming)
const waitlist = JSON.parse(localStorage.getItem('wardrobe_waitlist') || '[]');
waitlist.push({ email, timestamp: new Date().toISOString() });
localStorage.setItem('wardrobe_waitlist', JSON.stringify(waitlist));
document.querySelector('.waitlist-form').style.display = 'none';
document.getElementById('confirmation').style.display = 'block';
}
</script>
</body>
</html>