# TeaBoy OS ## Overview **TeaBoy OS** — a bilingual (Arabic/English, RTL/LTR) full-stack internal web platform styled as an OS-like interface with glassmorphism aesthetics. Built as a pnpm monorepo. ## Architecture ``` / ├── artifacts/ │ ├── api-server/ Express 5 backend (port 8080) │ └── teaboy-os/ React + Vite frontend (path: /, port dynamic) ├── lib/ │ ├── db/ Drizzle ORM + PostgreSQL schema │ ├── api-spec/ OpenAPI spec + Orval codegen │ ├── api-client-react/ Generated React Query hooks (from Orval) │ └── api-zod/ Generated Zod schemas (from Orval) └── scripts/ Seed script (pnpm run seed) ``` ## Stack - **Monorepo**: pnpm workspaces - **Node.js**: 24, TypeScript 5.9 - **Backend**: Express 5, express-session + connect-pg-simple (PostgreSQL sessions), bcryptjs, Socket.IO - **Database**: PostgreSQL + Drizzle ORM, Zod validation - **API codegen**: Orval (OpenAPI → React Query hooks + Zod schemas) - **Frontend**: React + Vite, Tailwind CSS v4, wouter (routing), i18next (i18n), react-i18next - **Real-time**: Socket.IO (path: /api/socket.io) - **Build**: esbuild (API), Vite (frontend) ## Features - **Arabic default** with full RTL layout; English toggle persisted in localStorage + user profile - **Glassmorphism OS UI**: animated gradient background, frosted glass panels - **OS Home Screen**: live clock status bar (per-user clock style: full / digital / digital-no-seconds / analog / minimal, picker in status bar), app grid, bottom dock - **خدماتي (My Services)**: service card grid with availability status - **Internal Chat**: real-time messages via Socket.IO, conversation list - **Notifications**: unread tracking, mark-all-read - **Admin Panel**: CRUD for apps, services, users (admin role required) - **Session-based Auth**: RBAC with roles (admin/user) ## Key Commands - `pnpm run typecheck` — full typecheck across all packages - `pnpm run build` — build all packages - `pnpm --filter @workspace/api-spec run codegen` — regenerate API hooks from OpenAPI spec - `pnpm --filter @workspace/db run push` — push DB schema changes (dev) - `pnpm --filter @workspace/scripts run seed` — seed demo data ## Demo Accounts - **Admin**: `admin` / `admin123` (admin + user roles) - **User**: `ahmed` / `user123` (user role) ## Database Tables `users`, `roles`, `permissions`, `user_roles`, `role_permissions`, `apps`, `app_permissions`, `service_categories`, `services`, `conversations`, `conversation_participants`, `messages`, `message_reads`, `notifications`, `user_sessions` ## Important Notes - Session table `user_sessions` is created manually (not auto-created) — needed in DB before first run - Vite dev server proxies `/api` → `localhost:8080` for cookie-based auth to work - All API calls use `credentials: "include"` via `lib/api-client-react/src/custom-fetch.ts` - Socket.IO server path: `/api/socket.io` - Frontend connects to Socket.IO via same-origin proxy (no separate URL needed) - i18n locale files: `artifacts/teaboy-os/src/locales/ar.json` and `en.json`