TrustLab Web

TrustLab Web is the premium, responsive frontend interface for the TrustLab ecosystem. Built with Next.js 16 (App Router) and Tailwind CSS v4, it delivers a high-performance, aesthetically pleasing user experience for both Customers and Administrators.

🚀 Key Features

💎 Premium User Interface

Modern Aesthetic: "Glassmorphism" design language with backdrop blurs and subtle gradients.
Dark Mode First: Fully optimized dark/light theme switching with persistent state.
Responsive Design: Mobile-first architecture ensuring seamless adaptability from Phones to 4K Desktops.

🛡️ Secure Dashboard & Portal

Dashboard Layout: comprehensive sidebar navigation with collapsible grouping (Admin vs Customer).
Role-Based Views: UI elements (Buttons, Menus) adapt dynamically based on Owner, Admin, or Customer roles.
Profile Management: User settings, password management, and social account linking.
Ticket System UI: Chat-like interface for support tickets with real-time status updates and file attachment previews.

🛠️ Public Tools

Chat ID Finder: Tool for retrieving Telegram Chat IDs.
Key Generator: Secure, client-side generator for Laravel/App secrets (base64, hex).
Contact Form: Integrated inquiry system protected by Cloudflare Turnstile.

🛠️ Technology Stack

Framework: Next.js 16 (App Router)
Styling: Tailwind CSS v4
Language: TypeScript
State Management: React Context (Sidebar, Theme, Auth) & Hooks
HTTP Client: Axios (with centralized interceptors for Auth/CSRF)
Icons: Lucide React
Bot Protection: @marsidev/react-turnstile

📂 Project Structure

src/app/(public): Publicly accessible pages (Landing, Tools, Auth).
src/app/dashboard: Protected routes requiring authentication.
src/components/ui: Reusable, atomic UI components (Buttons, Modals, Inputs) following the design system.
src/hooks: Custom hooks for Auth (useAuth), Theme (useTheme), and Window dimensions.

2.1 KiB Raw Blame History