How maramsshubbar/qless-frontend works
QLess is a virtual queue and appointment platform for customers, business owners, staff, and administrators. The customer journey begins with browsing businesses and branches, then joining a queue or booking a service; customers can track tickets, receive updates, and manage their account. Separate owner, staff, and admin areas support business setup, queue operations, and platform oversight. The graph reflects the frontend routes and sampled service calls; several capabilities are included from the README, but their internal wiring was not sampled.
Main entry points: App.jsx Routed application · BookServiceForm.jsx Service bookings · api.js API request client · BranchDetailsPage.jsx Business and branch details
Components 25
Application entry
- Routed application
src/App.jsx - Authentication and roles
src/contexts/UserContext.jsx
Customer experience
- Business discovery
src/components/Browse/BrowsePage.jsx - Business and branch details
src/components/BranchDetails/BranchDetailsPage.jsx - Join queue
src/components/Ticket/JoinQueuePage.jsx - Ticket tracking
src/components/Ticket/TicketPage.jsx - Customer dashboard
src/components/Dashboard/CustomerDashboard.jsx - Customer profile
src/components/CustomerProfile/CustomerProfile.jsx - Service bookings
src/components/Bookings/BookServiceForm.jsx - Customer reviews
src/components/Reviews/ReviewsSection.jsx
Business operations
- Business setup and billing
src/components/Business/BusinessForm.jsx - Owner management
src/components/Owner/OwnerBranch.jsx - Queue configuration
src/components/QueueSettings/QueueSettingsPage.jsx - Queue control
src/components/Control/QueueControl.jsx - Queue analytics
src/components/Analytics/QueueAnalyticsPage.jsx - Staff workspace
src/components/Staff/StaffLayout.jsx
Platform oversight
- Admin console
src/components/AdminPanel/AdminLayout.jsx
Services and integrations
- API request client
src/services/api.js - Business and branch services
src/services/businessService.js - Owner business service
src/services/ownerBusinessService.js - Booking service
src/services/bookingService.js - Ticket service
src/services/ticketService.js - Queue service
src/services/queueService.js
Other components
- Platform users
- QLess backend
Connections 28
- Platform users → Routed application: use
README.md - Routed application → Business discovery: routes to
src/App.jsx - Routed application → Business and branch details: routes to
src/App.jsx - Routed application → Join queue: routes to
src/App.jsx - Routed application → Ticket tracking: routes to
src/App.jsx - Routed application → Customer dashboard: routes to
src/App.jsx - Routed application → Service bookings: routes to
- Routed application → Business setup and billing: routes to
src/App.jsx - Routed application → Owner management: routes to
src/App.jsx - Routed application → Staff workspace: routes to
src/App.jsx - Routed application → Admin console: routes to
- Routed application → Authentication and roles: reads user
src/App.jsx - Business discovery → Business and branch services: loads listings
src/components/Browse/BrowsePage.jsx - Business and branch details → Business and branch services: loads details
src/components/BranchDetails/BranchDetailsPage.jsx - Business and branch details → Service bookings: offers booking
src/components/BranchDetails/BranchDetailsPage.jsx - Service bookings → Booking service: requests slots
src/components/Bookings/BookServiceForm.jsx - Ticket tracking → Ticket service: loads ticket
src/components/Ticket/TicketPage.jsx - Ticket tracking → Queue service: loads queue
src/components/Ticket/TicketPage.jsx - Customer dashboard → Ticket service: loads tickets
src/components/Dashboard/CustomerDashboard.jsx - Customer dashboard → Service bookings: shows bookings
- Business setup and billing → Owner business service: creates business
src/components/Business/BusinessForm.jsx - Queue configuration → Queue service: configures queues
src/components/QueueSettings/QueueSettingsPage.jsx - Customer reviews → QLess backend: submits reviews
- Business and branch services → API request client: calls
src/services/businessService.js - Booking service → API request client: calls
src/services/bookingService.js - Queue service → API request client: calls
- API request client → QLess backend: sends requests
src/services/api.js - Owner business service → QLess backend: sends requests
src/services/ownerBusinessService.js