An open API service indexing awesome lists of open source software.

https://github.com/mutasim77/tele-consult

📱💬 Real-time online consultation service for mobile phone operators using WebSockets and OTP-based authentication.
https://github.com/mutasim77/tele-consult

nextjs otp real-time socket-io telecom ts websockets

Last synced: 7 months ago
JSON representation

📱💬 Real-time online consultation service for mobile phone operators using WebSockets and OTP-based authentication.

Awesome Lists containing this project

README

          

![Banner](https://github.com/mutasim77/tele-consult/assets/96326525/6b002524-7ea9-4e8e-a95d-89e176e07b5f)


💬 Real-time online consultation service for mobile phone operators using WebSockets and OTP-based authentication. 📡

## 🚀 Introduction
Ever felt stuck with a mobile phone issue and wished for instant expert help? TeleConsult is here to revolutionize customer support in the telecom industry! 📱💬
This cutting-edge web app connects you directly with telecom operators in real-time, solving your mobile service headaches in minutes, not hours. No more endless phone queues or frustrating chatbots – just quick, personalized support when you need it most.
TeleConsult tackles common telecom nightmares:
- Confusing billing issues? **Solved! 💸**
- Network problems giving you a headache? **Fixed! 📶**
- Need help with your new plan? **We've got you covered! 📊**

## 🦄 Features
- 🔐 Secure OTP-based authentication
- 💬 Real-time chat with operators
- 📱 Fully responsive design
- 🔄 Smart queuing system for operator availability
- 👥 Dedicated operator interface for efficient support
- 🌓 Dark mode support
- 📁 Image sharing in chats
- 🔔 Real-time online/offline status updates
- 🌐 Offline mode detection and alert

## 🛠️ Tech Stack
- **🧠 TypeScript** - For type-safe code
- **⚛️ Next.js** - React framework for building the UI
- **💅 Tailwind CSS** - Utility-first CSS framework
- **🔌 Supabase** - Backend as a Service for real-time features, data storage, and authentication

## 🏃‍♂️ Getting Started
#### Prerequisites
- Node.js (v18+ recommended)
- npm | yarn | pnpm

#### Installation
1. Clone the repo:
```bash
git clone https://github.com/mutasim/tele-consult.git
```
2. Install dependencies:
```
cd tele-consult
pnpm install
```
3. Set up environment variables (check `.env.example`)
```
NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_ANON_KEY=
```
5. Run the development server:
```
pnpm dev
```
6. Open `http://localhost:3000` in your browser 🎉

> [!IMPORTANT]
> While Next.js is lightning-fast in _production_, you might notice slower performance in _development_ mode. For a more accurate representation of the app's speed and to test WebSocket functionality, I strongly recommend running the production build:
> 1. Build the project:
> ```
> pnpm build
> ```
> 2. Start the production server:
> ```
> pnpm start
> ```
> This method will give you a much snappier experience, closer to what end-users will see. It's especially useful for testing _real-time_ features and overall performance. ⚡

## 🌐 Deployment
TeleConsult is deployed on Vercel. Check it out here: [TeleConsult Live](https://tele-consult.vercel.app/)

> [!IMPORTANT]
> The deployment is currently working well, but ~there's an ongoing issue with WebSocket (ws) support due to compatibility between my Next.js version and Vercel's infrastructure~. I'll fix it ASAP.
> ✅ FIXED!

## 📸 Preview
### /
home page

### 2. /login
login page

### 3. /help
help

### 4. /chat
chat1

### 4. /chat
chat2

### 5. /operator
operator

### 6. /chat && /operator
chatting

## 🔮 Future Plans (TODO)
- 🛡️ Protect routes using middleware
- 📧 Add additional authentication methods
- ⏱️ Implement correct OTP timer
- 🌍 Add Language Translation using AI
- 🧠 Enhance AI model for answering basic questions
- 🎨 Add custom 404 and 500 pages
- 🔔 Add push notifications

## 🤝 Contributing
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

- Fork the Project
- Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
- Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
- Push to the Branch (`git push origin feature/AmazingFeature`)
- Open a Pull Request

## 📜 License
Distributed under the MIT License. See [LICENSE](./LICENSE) for more information.

Built with ❤️ by [mutasim](https://www.mutasim.top/blog)