bklog-hooks

Document reusable UI hooks and naming conventions for the bklog project.

88|138|Updated Oct 26, 2023
One-click install
npx skills add https://github.com/TencentBlueKing/bk-monitor --skill bklog-hooks
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: bklog-hooks
Source: https://github.com/TencentBlueKing/bk-monitor/tree/main/bklog/web/.ai-shared/skills/bklog-hooks
Command: npx skills add https://github.com/TencentBlueKing/bk-monitor --skill bklog-hooks

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill maps and documents reusable UI hooks for the bklog project, providing a single source of truth for hook naming, scope, and maintenance boundaries to improve consistency across teams.

Core Features & Use Cases

  • Hook catalog: Centralizes available hooks under src/hooks/ with conventional names like use-xxx.ts and core utilities such as useStore, useRouter, useRoute, useUtils, and useLocale.
  • Impact guidance: Describes ChangeImpact rules for new or changed hooks and helps identify wide-scale effects from shared hook changes.
  • References: Includes hooks-reference.md as a quick-reference document to look up hook details and usage notes.
  • Use Case: A developer adding a new hook consults this map to ensure proper placement, naming and minimal cross-cutting impact.

Quick Start

Review the bklog-hooks map in src/hooks/ and reference hooks-reference.md for naming conventions and usage constraints.

Frequently Asked Questions about bklog-hooks

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

FAQPage Schema
How do I standardize UI hooks naming conventions across a large codebase?

To standardize UI hooks naming conventions, centralize available hooks under a dedicated directory like src/hooks/ using conventional names such as use-xxx.ts. This establishes a single source of truth for hook scope and maintenance boundaries.

What is a hooks map and how does it improve codebase maintainability?

A hooks map improves maintainability by documenting reusable UI hooks in a central reference like hooks-reference.md. It provides developers with a quick lookup for hook details, usage constraints, and naming conventions to ensure consistency across teams.

How do I assess the cross-cutting impact of changing a shared hook?

To assess the cross-cutting impact of changing a shared hook, apply ChangeImpact rules to identify wide-scale effects. Consulting a central hooks map helps developers understand maintenance boundaries and minimize unintended side effects across the codebase.

What are the required file structures and metadata for developing a new hook?

Developing a new hook requires placing the file in src/hooks/ with a conventional name like use-xxx.ts. You must include a YAML frontmatter containing name and description, and you can optionally add resources, scripts, references, or assets directories.

When do I need to consult a hooks reference document during development?

You need to consult a hooks reference document when adding a new hook or modifying existing shared utilities like useStore or useRouter. It ensures proper placement, validates naming conventions, and helps evaluate minimal cross-cutting impact before implementation.