# Hi2Chat Enterprise - Build 05

## Goal
Build 05 starts the real browser application frontend and moves beyond the old `tools/socket-test-client.html` demo page.

## Added
- `frontend/` React + TypeScript + Vite application scaffold
- Main Lobby page with fixed header, scrollable feed and sticky input
- Left sidebar widgets: News, Birthday Wishes, FM Player
- Right sidebar split into Online Users and Offline Users
- Join/left system text in lobby feed
- Private Chat view opened by clicking a user
- Settings → Appearance theme chooser
- Per-user message text color behavior
- @mention highlight and mention summary panel
- Floating video popup
- Mobile responsive layout

## Important UX rules implemented
- User join/leave appears as small grey system text in Main Lobby.
- Online users show at the top of the right sidebar.
- Offline users show below Online Users with last seen text.
- User text color changes only apply to that user, not all users.
- Main lobby messages use compact left-feed style, not right-side bubbles.

## Run Backend
```bash
npm install
npm run start:dev
```

## Run Frontend
```bash
cd frontend
npm install
npm run dev
```

Open:
```text
http://localhost:5173
```

## Next Build 05.1
- Connect frontend to real backend Socket.IO events
- Login/Register UI
- Real auth token handling
- Real private chat API integration
- Persistent user appearance settings