Frontend Maintenance
SkillMediaLets your agent fix bugs, warnings, and upgrade issues in a Next.js frontend using a maintenance checklist.
Instructions available. Your AI can read the instructions. Execution depends on the setup they require.
Account requirements not reviewed. Check the skill instructions before use; ahel provides instructions and does not run this skill.
Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.
Then ask your AI: use the Frontend Maintenance skill
About this skill
Maintain and harden the ITSM Next.js frontend by resolving Ant Design deprecations, console errors, async races, stale state, API failures, route issues, performance regressions, and dependency drift. Use for routine maintenance, upgrade work, warnings, crashes, or resilience defects.
What this skill tells your AI
The instructions your AI receives, as published by heidsoft/itsm in itsm-frontend/.trae/skills/frontend-maintenance/SKILL.md and read by ahel’s review.
Triage
Reproduce the warning or failure and capture its route, role, console stack, network request, and visible state. Trace the owning component and API client before changing shared code.
Maintenance rules
- Follow installed Ant Design types and deprecation messages; do not assume a future API.
- Use
App.useApp()for contextual message/notification/modal calls. - Guard async state with cancellation or request sequencing when rerenders can race.
- Show actionable loading, empty, retry, permission, and error states.
- Never substitute mock data for a failed production API.
- Do not convert errors into silent empty results.
- Preserve authentication redirect behavior and prevent refresh/login loops.
- For mutating requests, preserve CSRF bootstrap and token rotation; retry only explicit CSRF mismatch/missing responses, never permission 403 responses.
- Keep route and dynamic menu changes aligned with backend permissions.
- Prefer small dependency upgrades with lockfile review and focused regression tests.
Useful checks:
rg -n 'valueStyle|bodyStyle|headStyle|Tabs\\.TabPane|Space direction' src
rg -n \"import \\{[^}]*message[^}]*\\} from 'antd'\" src
npm outdated
Do not run broad automated replacements without reviewing generated JSX and types.
API resilience
When a refresh fails:
- retain already loaded data when safe;
- mark it as stale or show a warning;
- offer retry;
- keep permission and authentication errors distinct;
- log through the project's observability path without secrets.
Verification
npm run type-check
npm run lint:check
npm run test:ci
npm run build
Use a focused Playwright test to verify visible maintenance fixes and console/network health.
Signals
- GitHub stars
- 77
- Forks
- 18
- Last commit
- Oct 2026
Advanced
- Item type
- skill
- Key
frontend-maintenance- Source
- github.com/heidsoft/itsm
Related picks
Skill · thedaviddias
The pick for JavaScriptmodern-javascript-patterns
Skill · wshobson
The pick for JavaScriptlogs-nextjs
Skill · posthog
The pick for Next.jsclerk-nextjs-patterns
Skill · clerk
The pick for Next.jsreact-component-performance
Skill · davila7
The pick for Reactreact-doctor
Skill · millionco
The pick for React