Files
ntspi-app/docs/compose/reports/dashboard-error-page.md

83 lines
3.3 KiB
Markdown

---
feature: dashboard-error-page
status: delivered
specs: []
plans:
- docs/compose/plans/2026-07-05-dashboard-error-page.md
branch: master
commits: a4fef0b..df6110a
---
# Dashboard Error Page — Final Report
## What Was Built
A dedicated error page for the admin dashboard that displays full error context when HTTP errors (403, 404, 500, 503) occur on dashboard routes. Previously, dashboard errors redirected to a generic error page using the public site layout (navbar + footer), which was confusing for admin users.
The new `DashboardError.vue` component renders within the Dashboard layout (sidebar + header) and shows:
- Error status code and description
- Request URL and HTTP method
- Current user info (if authenticated)
- Timestamp of the error
- Stack trace and request parameters (visible only to super_admin users in non-production environments)
## Architecture
### Components
| File | Role |
|------|------|
| `resources/js/Pages/Dashboard/DashboardError.vue` | Vue error page with full context display |
| `app/Exceptions/Handler.php` | Detects dashboard routes, renders DashboardError |
| `app/Ship/Exceptions/Handler.php` | Duplicate handler (Porto architecture) |
### Data Flow
```
Exception thrown
Handler.php render()
isDashboardRequest()? ──Yes──→ renderDashboardError()
│ ↓
│ Check user role
│ ↓
│ Build props (status, message, url, etc.)
│ ↓
│ Inertia::render('Dashboard/DashboardError', $props)
└──No──→ Original Error.vue (public layout)
```
### Access Control
- **All users**: See error status, description, URL, method, user info, timestamp
- **Super_admin only** (non-production): Additionally see stack trace and request parameters
- **Production**: Stack trace and params never shown (regardless of role)
## Usage
When a dashboard route returns an HTTP error (403, 404, 500, 503), the user is automatically redirected to the DashboardError page with full context. No configuration required.
**Example scenarios:**
- User navigates to `/dashboard/nonexistent-page` → 404 with URL info
- User accesses restricted route without permission → 403 with user info
- Server error occurs → 500 with timestamp
**Navigation:**
- "Назад" button: Returns to previous page (or dashboard index if no history)
- "На главную" button: Navigates to dashboard index
## Verification
1. **404 test**: `curl -s -o /dev/null -w "%{http_code}" http://localhost/dashboard/nonexistent-page` → Returns `404`
2. **Props verification**: Confirmed `status=404`, `message`, `url`, `method`, `timestamp` all present in Inertia page data
3. **Stack trace hidden**: Confirmed stack trace and params not included for unauthenticated users
4. **Public site unchanged**: Public site errors still render with original `Error.vue` layout
5. **PHP syntax**: Both Handler files pass `php -l` syntax check
## Journey Log
- [lesson] Vite manifest requires rebuild after adding new Vue components — `npm run build` needed before testing
- [lesson] Porto architecture has duplicate exception handlers (`app/Exceptions/` and `app/Ship/Exceptions/`) — both must be updated identically