add-event-type

Add a new event type with a React component to the frontend feed system.

Updated Dec 28, 2025

Search Tags:#typescript #ui #frontend #react #websocket #event-type

One-click install

npx skills add https://github.com/AppleLamps/web-term --skill add-event-type

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: add-event-type
Source: https://github.com/AppleLamps/web-term/tree/main/.claude/skills/add-event-type
Command: npx skills add https://github.com/AppleLamps/web-term --skill add-event-type

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill adds a new event type to the frontend feed system with a corresponding React component, enabling display of new agent output types.

Core Features & Use Cases

Read current EventType union in frontend/src/App.tsx
Define new event interface: type NewEventType = { type: 'new_type'; /* fields */ }
Extend EventType union and implement NewTypeBlock component
Update rendering logic and WebSocket handling to support the new event

Quick Start

Create the NewEventType interface, add it to EventType, build a NewTypeBlock, and wire it into the feed rendering. Example: add a block for type 'new_type' to render in the UI.

Guardrails

Follow existing naming conventions (PascalCase components, snake_case event types)
Use Tailwind styling for consistency
Ensure TypeScript types are complete (no any)
Test with mock events via WebSocket