Messages 1

Notes

1. Heading and role. One inbox component serves both roles. The shell changes by role: customers get the customer sidebar (24-customer-bookings-list.html); teachers get the teacher sidebar where Messages links to this same screen. URL differs but the component is shared. noindex. Analytics: inbox_viewed with role.
2. Safety banner. Always visible at the top and dismissible only for the session. Copy reviewed by legal. Link to Trust and safety. Never removed because it protects the payment model.
3. Thread list controls. Search across teacher or customer name, service title and message text. Filters: All, Unread, Offers (threads with an open offer or request), Archived. Sorted by latest message. Thread count and pagination or infinite scroll after 30 threads.
4. Thread row. Counterpart name, last message preview (80 characters), time (clock today, "Yesterday", date), booking title and status, and unread count. Selected row highlighted. Each thread belongs to a request or booking so context is always visible. Pre-booking enquiries from a profile also create a thread tagged "Enquiry".
5. Conversation header. Counterpart photo and name, typical reply time (calculated), and actions: View booking (25-booking-detail-messages.html), Archive, Report (opens modal with reasons: spam, off-platform payment request, inappropriate, safeguarding concern; routes to 65-admin-reports-moderation.html). A pinned summary card shows the booking snapshot.
6. Message area. Bubbles with date separators, attachments, read receipts ("Seen 10:44"), typing indicator and system messages (offer sent, offer accepted, payment received, booking changed). Real-time updates; email notification if unread after 15 minutes. Teacher view adds the customer's first name only until payment, and shows offer and quote buttons ("Create offer" links to 49-request-detail-offer.html).
7. Composer. Text up to 2000 characters, Enter to send, Shift+Enter for new line, attachments JPG, PNG, PDF up to 10 MB (virus scanned). Teachers also have saved quick replies. Contact-detail detection (phone, email, URL, "pay me directly") shows a warning and logs the event; repeated attempts alert admin. Blocked users cannot send.

Teacher view

Same structure with teacher app header and teacher sidebar (Messages active). Differences: list filters add "Needs reply" and "Requests"; response-time badge shows the 48 hour deadline for new requests; the booking snapshot card shows net payout after commission; the composer adds Quick replies and a Create offer shortcut; customer's surname, phone and exact address stay hidden until the booking is confirmed. Reply speed feeds the teacher's response rate on their profile.

Mobile

Two-pane becomes two screens: thread list first, then conversation with a back arrow. Composer fixed above the keyboard. Safety banner collapses to a one-line "Stay protected" chip that expands on tap.

States

Empty inbox: "No messages yet. When you request a booking or message a teacher, conversations appear here" with link to 02-search-results.html. No thread selected (desktop): placeholder "Select a conversation". Loading: skeleton rows and bubbles. Send failure: bubble marked "Not sent, tap to retry". Offline: banner and queued messages. Blocked or closed account: composer replaced by "You can no longer reply to this conversation". Logged-out: redirect to 29-login.html.