Production-grade internal IT support and hardware asset management platform.
Built for high-volume enterprise operations teams, unifying incident ticketing, SLA tracking, hardware lifecycle inventory, real-time technician messaging, and self-service knowledge authoring.

---

🌐 Interactive Live Demonstration

Experience the live system: https://techdesk-three.vercel.app

Pre-Seeded Test Credentials

All accounts are pre-configured with the default password: password

Role	Email Address	Access Level & Permissions
🛡️ Administrator	[email protected]	Full platform control, user provisioning, global SLA policies, audit exports
🔧 Technician	[email protected]	Incident triage, asset assignments, ticket resolution, technician chat
👤 Employee	[email protected]	Self-service ticket submission, assigned device overview, knowledge base

Note

The application source code is private. This public repository serves as the technical showcase, architecture specification, screenshot walkthrough, and portfolio overview.

---

🏗️ Real-Time Event Architecture

TechDesk utilizes Laravel Reverb WebSockets to power instantaneous bi-directional communication between support agents and end-users:

flowchart TD
    subgraph Frontend ["Client Experience (React 18 + Vite)"]
        SPA["React Single Page Application"]
        Echo["Laravel Echo (WebSocket Client)"]
        State["Zustand Global State (Real-Time Triage)"]
    end

    subgraph Server ["Backend & Real-Time Engine"]
        API["Laravel 10 RESTful API"]
        Reverb["Laravel Reverb WebSocket Server\n(Zero-Latency Event Dispatch)"]
        Queue["Redis / Database Event Queue"]
    end

    subgraph Storage ["Data & Deployment Layer"]
        DB[("Relational Database\n(Tickets, Assets, SLAs)")]
        Docker["Dockerized Application Container"]
    end

    SPA <--> Echo
    Echo <--> Reverb
    SPA --> API
    API --> Queue --> Reverb
    API --> DB
    Docker -.-> Server

    style Frontend fill:#0f172a,stroke:#38bdf8,stroke-width:2px,color:#f8fafc
    style Server fill:#1e1b4b,stroke:#8b5cf6,stroke-width:2px,color:#f8fafc
    style Storage fill:#064e3b,stroke:#34d399,stroke-width:2px,color:#f8fafc

Loading

---

⚡ What TechDesk Covers

1. 🎫 Incident & Service Request Management

• Dynamic SLA calculation with visual countdown timers (P1 Critical through P4 Low).
• Multi-tier assignment queues: Department triage, technician escalation, and approval gates.
• Incident activity audit logs tracking every status transition and technician comment.

2. 💻 Enterprise Asset Lifecycle Tracking

• Complete hardware inventory management (Laptops, Monitors, Network Switches, Mobile Devices).
• Custody assignment history: Tracks who currently holds each asset and historical handoffs.
• Maintenance records, warranty expiration alerts, and procurement replacement forecasting.

3. 💬 Real-Time Collaboration & Messaging

• Built-in live chat powered by WebSockets for direct technician-to-user troubleshooting.
• Real-time unread badges and audible desktop notifications on ticket dispatch.

4. 📚 Self-Service Knowledge Base

• Rich markdown guide authoring with inline screenshots and troubleshooting checklists.
• Deflects routine IT tickets by recommending relevant KB articles during ticket creation.

---

📸 Interface Gallery

Operations Dashboard (Admin)	Ticket Triage & Queue

Hardware Asset Detail & History	Self-Service Knowledge Base

---

🛠️ Technology Stack

• Client: React 18, Vite, Tailwind CSS, Lucide Icons, Laravel Echo
• Server: Laravel 10, PHP 8.2, Laravel Sanctum, Laravel Reverb (WebSockets)
• Database: SQLite (Local Dev) / PostgreSQL (Production)
• Deployment: Docker containerization, Vercel Edge Hosting, Render Cloud

---

📄 License

This repository and its documentation are open-source under the MIT License.