riyadhafraa
593ce6a418
Replit-Commit-Author: Agent Replit-Commit-Session-Id: 77cfe984-2c65-4152-bb7a-0df28274fe66 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 0ff3f857-a733-45a7-bd0c-261ec96f468e Replit-Helium-Checkpoint-Created: true
131 lines
4.1 KiB
Plaintext
131 lines
4.1 KiB
Plaintext
Build a full-stack internal web platform called "TeaBoy OS" as a responsive operating-system-style web interface inspired by iOS/Android, designed to run internally on a Mac Server using Docker.
|
|
|
|
Core stack:
|
|
- Frontend: Next.js (App Router) + React + TypeScript + Tailwind CSS
|
|
- Backend: Node.js + Express + Socket.IO
|
|
- Database: PostgreSQL
|
|
- Deployment: Docker Compose
|
|
|
|
General requirements:
|
|
- The UI must be fully responsive and work well on desktop, iPad, and mobile browsers.
|
|
- The platform must support both Arabic and English from day one.
|
|
- Arabic must be the default language.
|
|
- Full RTL support for Arabic and LTR support for English.
|
|
- All text must come from an i18n system, not hardcoded strings.
|
|
- Include a language switcher in the UI.
|
|
- Save user language preference.
|
|
|
|
Main UI / OS Interface:
|
|
1. Home screen / desktop interface:
|
|
- Glassmorphism visual style
|
|
- Beautiful OS-like home screen
|
|
- Responsive grid of app icons
|
|
- Top status bar with:
|
|
- live clock
|
|
- username
|
|
- notifications bell
|
|
- Bottom dock for frequently used apps
|
|
- Smooth hover and click interactions
|
|
- Arabic-friendly modern styling
|
|
|
|
2. Dynamic apps system:
|
|
- Apps must be stored in the database in a table called `apps`
|
|
- Admin can create, edit, activate, deactivate, and sort apps
|
|
- Apps automatically appear on the home screen without hardcoding
|
|
- Each app should support bilingual content:
|
|
- name_ar
|
|
- name_en
|
|
- description_ar
|
|
- description_en
|
|
- Also include:
|
|
- slug
|
|
- icon_name
|
|
- route
|
|
- color
|
|
- is_active
|
|
- is_system
|
|
- sort_order
|
|
|
|
3. Service app ("خدماتي"):
|
|
- Show internal services such as tea, Arabic coffee, water, etc.
|
|
- Display them as elegant responsive cards
|
|
- Admin must be able to create, edit, and delete services dynamically
|
|
- Services must support bilingual content:
|
|
- name_ar
|
|
- name_en
|
|
- description_ar
|
|
- description_en
|
|
- Also include:
|
|
- image_url
|
|
- price
|
|
- is_available
|
|
- category if useful
|
|
|
|
4. Communication app:
|
|
- Internal chat app
|
|
- Support direct one-to-one conversations
|
|
- Support group conversations
|
|
- Use Socket.IO / WebSockets for realtime messaging
|
|
- Realtime notifications for new messages
|
|
- Store conversations, participants, messages, and read states in the database
|
|
|
|
5. Authentication and RBAC:
|
|
- Users table
|
|
- Roles table
|
|
- Permissions table
|
|
- User roles mapping
|
|
- Role permissions mapping
|
|
- App visibility should be permission-aware
|
|
- Admin role should manage apps, services, and users
|
|
|
|
Database requirements:
|
|
Use PostgreSQL and create a scalable schema including at minimum:
|
|
- users
|
|
- roles
|
|
- user_roles
|
|
- permissions
|
|
- role_permissions
|
|
- apps
|
|
- services
|
|
- service_categories (optional but recommended)
|
|
- conversations
|
|
- conversation_participants
|
|
- messages
|
|
- message_reads
|
|
- notifications
|
|
- app_permissions (recommended)
|
|
|
|
Important schema requirements:
|
|
- users must include preferred_language with default 'ar'
|
|
- apps must include bilingual fields:
|
|
- name_ar, name_en, description_ar, description_en
|
|
- services must include bilingual fields:
|
|
- name_ar, name_en, description_ar, description_en
|
|
|
|
Technical requirements:
|
|
- Create a clean modular folder structure
|
|
- Use reusable components
|
|
- Make the architecture scalable for future apps
|
|
- Add seed data for demo apps and demo services
|
|
- Prepare the project to run with Docker Compose
|
|
- Keep the code clean and production-minded
|
|
|
|
Deliverables required:
|
|
1. docker-compose.yml
|
|
2. frontend and backend Dockerfiles
|
|
3. PostgreSQL schema / init.sql
|
|
4. Next.js home screen UI
|
|
5. basic backend API structure
|
|
6. Socket.IO server setup
|
|
7. sample admin dashboard structure for managing apps and services
|
|
8. i18n structure for Arabic and English
|
|
9. seed data
|
|
|
|
Important:
|
|
After implementation, provide a clear report of:
|
|
- what was created
|
|
- which files were added
|
|
- which features are fully working now
|
|
- which features are scaffolded only
|
|
- what is still pending
|
|
Do not give a vague summary. Be precise and explicit. |