skills.rest
steltz
steltzCOMMUNITY
Explore all skills by this author →
GitHub

audit-ui-handlers

Audit a single page for unfinished UI handlers via static analysis.

Updated Mar 30, 2026
Search Tags:#react#audit#static-analysis#web-frontend#ui-handlers
One-click install
npx skills add https://github.com/steltz/skill-factory --skill audit-ui-handlers
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: audit-ui-handlers
Source: https://github.com/steltz/skill-factory/tree/main/plugins/ui-finisher/skills/audit-ui-handlers
Command: npx skills add https://github.com/steltz/skill-factory --skill audit-ui-handlers

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Audit a single page — identified by its URL or route (e.g., /dashboard, /settings/profile) or by a direct file path — for unfinished interactive elements such as orphaned buttons, stubbed handlers, or handlers missing required side effects. Propose patches gated by human approval. Static analysis only — the skill never fetches the URL.

Core Features & Use Cases

  • Identify interactive elements (buttons, links, forms, inputs) and custom components with interaction hooks.
  • Trace handlers to definitions within the target file or via direct imports, up to two levels of indirection.
  • Classify findings into Tier 1/2/3 with actionable patch proposals for Tier 1 and Tier 2.
  • Generate a unified diff for suggested changes and present a structured audit report for human review.

Quick Start

Provide a target file path (e.g., src/app/settings/page.tsx) and run the audit-ui-handlers workflow.

Frequently Asked Questions about audit-ui-handlers

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I find unfinished UI handlers in a React project?▼

To find unfinished UI handlers in a React project, use static analysis to surface orphaned buttons, stubbed handlers, and missing side effects on a specific page. The audit traces interactions through imports and proposes patches for human review.

How do I audit a React page for stubbed event handlers?▼

You can audit a React page for stubbed event handlers by providing the target file path or route. The static analysis identifies interactive elements, traces handlers up to two levels of indirection, and generates a structured report with patch proposals.

Does static analysis for UI handlers require fetching the target URL?▼

No, static analysis for UI handlers never fetches the target URL. The audit relies entirely on import-based tracing and source file evaluation to identify unfinished interactive elements and classify findings into actionable tiers.

What is the best way to detect missing side effects in React components?▼

The best way to detect missing side effects in React components is to run a targeted static analysis audit. It evaluates custom components with interaction hooks, classifies incomplete handlers by tier, and outputs a unified diff for suggested changes.

How are UI handler findings classified when auditing web frontend code?▼

When auditing web frontend code, UI handler findings are classified into Tier 1, Tier 2, and Tier 3 categories. This tiered system prioritizes actionable patch proposals for Tier 1 and Tier 2 issues within a formal patch and QA cycle.

Related Skills

Explore More Software Engineering Skills→
ncaqncaq
3

dynamic-import

Enforce static imports over dynamic import() in TypeScript and JavaScript code.

Community
Intermediate
saajunaidsaajunaid

react-useeffect

Identify correct useEffect usage and safer React alternatives for side effects.

Community
Intermediate
xalixilaxxalixilax

hooks-pattern

Extract stateful logic into reusable custom hooks for React components.

Community
Intermediate
ihj04982ihj04982

put-interaction-logic-in-event-handlers

Move React interaction logic directly into event handlers.

Community
Basic