Eng1Mahmoud/frontend-chat-app — reverse-engineered prompt

Build me a polished frontend for a chat app using Next.js, React, TypeScript, and Tailwind. I need auth screens for login, signup, account verification, forgot password, and reset password, with clear form validation, loading states, and friendly error messages. After login, users should land in a protected chat page with a sidebar of people, search, avatars, online status, unread counts, and a welcome state when no chat is selected.

The chat view should feel like a modern messenger. Show the selected person's avatar, name, online or typing status, a scrollable message history grouped by date, read updates, and a message box that sends messages and emits typing events. Make it responsive so the people list works nicely on mobile. Connect it to an API and Socket.IO using environment variables for the API and socket URLs. Use context for shared chat state, keep the code clean, and look up current docs online if needed.