diff --git a/AGENTS.md b/AGENTS.md new file mode 100644 index 0000000..16498e6 --- /dev/null +++ b/AGENTS.md @@ -0,0 +1,32 @@ +# Project Architecture & Exploration + +This document summarizes the findings from the autonomous agents deployed to analyze the CoaxysPanel frontend repository. + +## 1. Features & Routing Structure +*Explored by the Features Researcher* + +- **Routing Model**: Uses Next.js App Router. The application is divided into `(auth)` (for login, passwords, 2FA flows) and `(panel)` (for the authenticated control panel). The panel relies heavily on a centralized dynamic catch-all route `[...slug]` to manage over 100 configured paths without duplicating page boilerplate. +- **Route Registry**: `src/lib/routes.ts` defines all available panel modules (e.g., Databases, Websites, Files, Security). +- **Core Views**: Handled by the `FeaturePage` component which dynamically loads the relevant feature (like the Dashboard, File Manager, DNS Editor, or Terminal) based on the current path and required permissions. + +## 2. Components & UI Design +*Explored by the Components Researcher* + +- **Layered Architecture**: Organized into four groups inside `src/components`: + - `ui/`: Fundamental design blocks (shadcn/ui style with Radix and Tailwind). + - `common/`: Reusable composites like `DataTable` (using `@tanstack/react-table`), `PageHeader`, and loading/error states. + - `shell/`: The main application frame containing the sidebar, header, and global command palette. + - `features/`: The complex domain-specific pages (e.g., Wizards, Terminals) loaded by the Next.js router. +- **Design System**: A robust, heavily customized "glassmorphic" Tailwind UI, using css variables and variants to construct glowing shadows, backdrops, and seamless transitions. +- **Key Patterns**: Widespread use of client components (`"use client"`), dynamic lazy loading for heavy widgets like the Terminal (xterm.js) and charts, and TanStack React Query for data fetching. + +## 3. Architecture & Data Flow +*Explored by the Architecture Researcher* + +- **State Management**: Uses Zustand (with persistence) centrally located at `src/stores/ui-store.ts`. Primarily tracks layout views (sidebar status) and complex appearance themes (accents, glass intensity, density). +- **API Contracts**: Strong typing in `src/api/contracts/` for requests, responses, pagination, and data models (e.g., User, Website, Database, Backup). +- **Mock Services**: Because this is a frontend-only control center template, data access occurs through a mock client (`src/api/client.ts`) that simulates network latency and errors. Rich placeholder data is generated by `src/api/mocks/seed.ts` (using `date-fns`), which feeds into the simulated endpoints in `src/api/services/panel-service.ts`. +- **Utilities**: Employs `clsx` and `tailwind-merge` for style class merging, along with robust date utilities. + +--- +*Generated autonomously via specialized subagents.*