Dev Reference
Bloomify — Dev Reference
Architecture, DB schema, API routes, theme colours
Architecture
Browser
└── Cloudflare Pages (bloomify-portal)
Static React SPA (React 18 + TypeScript + Vite)
└── API calls → Cloudflare Worker (bloomify-api)
└── D1 Database (bloomify_db)
The frontend is a fully static SPA deployed to Cloudflare Pages. All data operations go through the Cloudflare Worker which owns the D1 database. CORS is locked to https://bloomifyofficial.sonandigital.com via the ALLOWED_ORIGIN env variable in wrangler.toml.
Theme Colours
| Token | Hex | Use |
|---|---|---|
| Pale pink bg | #FDF0F3 | Page background |
| Pink | #E8A0B0 | Accents, borders |
| Pink dark | #C4758B | Buttons, highlights |
| Pink darker | #A05870 | Dark button states, headings |
| Hero gradient | linear-gradient(135deg, #A05870 0%, #C4758B 60%, #E8A0B0 100%) | Hero section |
Currency Pattern
All monetary values are stored as integer paisa (PKR × 100) in the database. Display format:
// Convert cents/paisa to display string
const display = `Rs. ${Math.round(value_cents / 100).toLocaleString()}`;
// Example: 150000 paisa → "Rs. 1,500"
DB Schema
| Table | Key Columns |
|---|---|
admin_users | id, email, password_hash, full_name, created_at |
clients | id, name, email, phone, instagram, address, notes, created_at |
products | id, name, description, category, base_price_cents, base_cost_cents, is_active, sort_order, created_at |
orders | id, client_id, product_id, occasion, custom_notes, colors, quantity, price_cents, cost_cents, status, order_date, delivery_date, created_at |
order_notes | id, order_id, content, created_at |
invoices | id, order_id, client_id, amount_cents, status, issued_date, paid_date, notes, created_at |
inquiries | id, name, email, phone, instagram, occasion, colors, message, status, created_at |
settings | key, value |
API Routes
| Method | Route | Auth | Purpose |
|---|---|---|---|
| POST | /api/auth/login | Public | Admin login — returns JWT |
| GET | /api/config | Public | Business config for public site |
| GET/POST | /api/clients | Admin | List / create clients |
| GET/PUT/DELETE | /api/clients/:id | Admin | Get / update / delete client |
| GET/POST | /api/products | Admin | List / create products |
| GET/PUT/DELETE | /api/products/:id | Admin | Get / update / delete product |
| GET/POST | /api/orders | Admin | List / create orders |
| GET/PUT/DELETE | /api/orders/:id | Admin | Get order (with notes) / update / delete |
| POST | /api/notes | Admin | Add note to an order |
| GET/POST | /api/invoices | Admin | List / create invoices |
| GET/PUT/DELETE | /api/invoices/:id | Admin | Get / update / delete invoice |
| GET/POST | /api/inquiries | Mixed | GET admin, POST public form submission |
| GET/PUT/DELETE | /api/inquiries/:id | Admin | Get / update status / delete inquiry |
| GET | /api/reports/summary | Admin | Revenue/cost/profit summary; ?period=week|month|quarter|all |
| GET/PUT | /api/settings | Mixed | GET public, PUT admin |
| POST | /api/admin/password | Admin | Change admin password |
File Structure (repo root)
bloomify-portal/
├── src/
│ ├── components/ # Shared UI components
│ ├── pages/
│ │ ├── public/ # Public-facing pages (Home, Products, Inquiry)
│ │ └── admin/ # Admin portal pages (Dashboard, Orders, …)
│ ├── lib/ # API client, auth helpers
│ └── main.tsx
├── worker/
│ ├── index.ts # Cloudflare Worker entry
│ ├── routes/ # Route handlers per resource
│ ├── db/
│ │ └── schema.sql # D1 migrations
│ └── auth.ts # JWT auth middleware
├── wrangler.toml
├── vite.config.ts
└── package.json