⚡ Zenith Workspace

A Real-Time, AI-Powered Collaborative Cloud IDE

Live chat. Live code. Live AI.

MERN Stack · WebSockets · Gemini AI · RAG · JWT Auth · Redis

🔗 Live Demo  ·  ⚙️ API  ·  📂 Source

---

📸 Project Preview

---

📖 About

Zenith Workspace is a real-time collaborative coding platform. Anyone can spin up a project room, invite teammates, and live-chat with every collaborator inside that room — while an integrated AI Software Engineering Assistant, Zenith, sits right there in the conversation, ready to help whenever someone types @zenith.

Zenith isn't a bolt-on chatbot. It's context-aware: it reads your project's actual files, retrieves only the ones relevant to your question using vector embeddings + cosine similarity search (a lightweight RAG pipeline), and streams back code, fixes, or full file trees live into everyone's editor over WebSockets.

---

🧭 How It Works — A First-Time Walkthrough

1. Sign up / Log in — secured with JWT (JSON Web Tokens) and bcrypt-hashed passwords.
2. Create a Project Room — this becomes your shared workspace with its own file tree and chat.
3. Invite Collaborators — add teammates by email. (Only registered users can be added — a teammate must already have a Zenith account before they can be added as a collaborator.)
4. Live Chat with Collaborators — every message is broadcast in real time via Socket.IO, so all room members see the conversation as it happens.
5. Code Together — the built-in Monaco Editor (the same editor that powers VS Code) lets everyone create, edit, rename, and delete files/folders, synced live for the whole room.
6. Bring in Zenith — mention @zenith <your request> in the chat. Behind the scenes:
   • Your prompt is converted into a vector embedding (gemini-embedding-001).
   • It's compared against every project file's stored embedding using cosine similarity to pull in only the most relevant files as context (RAG in action).
   • That context + your prompt goes to Gemini (gemini-2.5-flash) with a custom system-instruction persona, so Zenith responds like a senior engineer, not a generic bot.
7. Watch It Build — Zenith's reply (explanation, fix, or a generated file tree) is parsed, merged into the live project, saved, and pushed to every collaborator's screen instantly.
8. Iterate — edit or regenerate any AI message, clear the chat, rename/delete the project — all from the room itself.

---

✨ Feature Highlights

• 🔴 Real-Time Multiplayer Rooms — live chat + live file-tree sync across every collaborator, powered by Socket.IO.
• 🤖 In-Chat AI Pair Programmer — @zenith triggers context-aware code generation and engineering guidance via Google Gemini.
• 🧠 Retrieval-Augmented Generation (RAG) — embeddings + cosine similarity ensure Zenith only sees relevant files, not a blind dump of the whole codebase.
• 🖥️ In-Browser Monaco Editor — full VS-Code-grade editing experience, no local setup.
• 🔐 Secure, Stateless Auth — JWT + bcrypt, with HTTP-only cookies.
• 🚫 Redis-Backed Token Blacklisting — logout instantly invalidates a JWT via Redis, closing the replay-attack window.
• 💬 Editable, Persistent Chat History — edit/regenerate messages, clear chat — backed by MongoDB.
• 🎨 Polished, Responsive UI — React 19 + Tailwind CSS v4, resizable split panels, Markdown-rendered, syntax-highlighted AI responses.
• 👤 Account Management — dedicated profile page to view account info, securely change your password, and log out.

---

🛠️ Tech Stack

Frontend

Backend

Databases & Caching

AI / ML

Deployment

Core Concepts Applied: Retrieval-Augmented Generation (RAG) · Vector Embeddings & Cosine Similarity Search · WebSocket-Based Real-Time Sync · RESTful API Design · Stateless JWT Authentication · Token Blacklisting / Session Invalidation · MVC Architecture · Middleware-Based Auth Guards · Prompt Engineering · Recursive File-Tree Data Structures

---

🏗️ Architecture

┌─────────────────┐      WebSocket (Socket.IO)       ┌──────────────────┐
│   React Client    │◄────────────────────────────────►│  Node.js + Express │
│ (Vite + Monaco)   │        REST API (Axios/JWT)       │  + Socket.IO Server│
└─────────────────┘◄────────────────────────────────►└──────────────────┘
                                                                │
                        ┌───────────────────────────────────────┼───────────────────────┐
                        ▼                                       ▼                       ▼
               ┌─────────────────┐                    ┌──────────────────┐      ┌───────────────┐
               │    MongoDB        │                    │   Redis Cache      │      │  Google Gemini  │
               │ Users · Projects   │                    │ (JWT Blacklist)    │      │ Chat + Embeddings│
               │ Messages · Files   │                    └──────────────────┘      └───────────────┘
               │ + Vector Embeddings│
               └─────────────────┘

RAG flow: prompt → embed (gemini-embedding-001) → cosine-similarity match against stored file embeddings → top-K relevant files as context → gemini-2.5-flash generates response (auto-falls back to gemini-3.5-flash on failure) → file tree merged & broadcast live to the room.

---

📄 License

Proprietary / All Rights Reserved

This repository is shared for portfolio purposes only.

---

👩‍💻 About the Author

Puja Kumari

• 🐦 X (Twitter): https://x.com/pujakumaricodes
• 💼 LinkedIn: https://www.linkedin.com/in/betterversionofpuja
• 📧 Email: betterversionofpuja@gmail.com

---

⭐ Support the Project

If you found this project useful or interesting, consider giving it a ⭐ on GitHub.

It helps others discover the project and motivates me to continue building and improving it.