Inspiration

As AI agents become increasingly autonomous, they are granted deeper access to internal databases, external APIs, and core infrastructure. While these agents unlock massive productivity, they also introduce unprecedented security risks—rogue agents, prompt injection leading to data exfiltration, and hallucinated lateral movement. We were inspired by the urgent need for a dedicated security layer tailored specifically for AI traffic. We wanted to build a "Security Operations Center (SOC) for the AI era," giving human operators the visibility, control, and analytics needed to securely scale autonomous systems without compromising enterprise safety.

What it does

AegisMesh is a modern Security Operations Center (SOC) dashboard designed to monitor, analyze, and neutralize network anomalies generated by autonomous AI agents in real-time.

  • Mesh Visibility: Tracks active AI agents (e.g., "orchestrator-prime", "vision-pipeline") and their operational statuses across the network.
  • Threat Mitigation: Automatically logs network requests, flagging malicious actions like "Port Scans" or "Credential Reads" and instantly blocking them based on strict enforcement policies.
  • Dual-Role Architecture: Features a highly secure, role-based access control (RBAC) system. Administrators get access to a specialized dashboard featuring personnel directories and deep audit logs, while Officers utilize the operational monitoring terminal.
  • Premium Interface: A visually stunning, dynamic split-screen terminal environment that reacts contextually to user clearance levels.

How we built it

We engineered AegisMesh using a cutting-edge web stack focused on performance, security, and premium aesthetics:

  • Core Framework: Next.js (App Router) combined with React 19 for seamless server-side rendering. We utilized Next.js Server Actions to handle secure, HTTP-only cookie-based authentication directly on the server.
  • Styling & UI: Tailwind CSS to rapidly develop our dark-mode, glassmorphism UI. We aimed for a sleek, futuristic "cyber-security terminal" aesthetic that feels enterprise-ready.
  • Animations: Framer Motion powers our buttery-smooth micro-interactions, dynamic radial gradients, and our complex split-screen login transitions.
  • Icons: Lucide React for crisp, scalable iconography.
  • DevOps: We utilized pnpm for blazing-fast package management and deployed the entire architecture seamlessly on Vercel.

Challenges we ran into

  • Authentication Flow Security: Designing a secure, edge-compatible middleware routing system in Next.js required careful handling of session tokens. We had to ensure Officers couldn't brute-force access into Admin routes, and unauthorized users were instantly rejected at the edge.
  • Strict CI/CD Pipelines: We ran into deployment hurdles on Vercel regarding pnpm lockfile mismatches and overridden dependencies (ERR_PNPM_LOCKFILE_CONFIG_MISMATCH). We had to dive deep into package manager supply-chain policies, prune stale package.json overrides, and manually reconcile our lockfiles to get our deployment pipelines green.
  • UI/UX Polish: Striking the exact balance between a "hacker" aesthetic and a clean, usable B2B layout was challenging. We iterated through multiple login designs before landing on our final dynamic layout.

Accomplishments that we're proud of

  • Successfully engineering a robust Next.js middleware that handles complex role-based routing flawlessly.
  • Creating a visually breathtaking UI. The dynamic "Connect to Terminal" button that seamlessly transitions from an Officer's blue aura to an Administrator's amber glow is a micro-interaction we are incredibly proud of.
  • Bouncing back from deployment failures and successfully debugging strict CI environment lockfile formats under pressure.

What we learned

  • Deepened our knowledge of Next.js Server Actions and how to securely manipulate HTTP-only cookies without relying on heavy third-party authentication libraries.
  • Mastered advanced Framer Motion techniques, including infinite background animations, layout transitions, and context-aware styling.
  • Gained valuable DevOps experience troubleshooting pnpm workspace conflicts within Vercel's immutable deployment environments.

What's next for AegisMesh

  • Live AI Integration: Connecting the dashboard to a real proxy layer (like an Envoy proxy or Cloudflare Worker) to intercept actual LLM network requests in the wild.
  • Automated Remediation: Implementing an AI-driven copilot within the dashboard that calculates probability scores $P(Threat | Action)$ and automatically suggests new firewall policies when it detects novel attack vectors.
  • Expanded Analytics: Wiring up the dashboard to a live PostgreSQL database to store and query millions of telemetry events with sub-second latency.

Built With

Share this project:

Updates