Installs into .claude/skills of the current project.
Are you the author of React Hook?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/berkcangumusisik-react-hook)
---
name: react-hook
description: Creates a custom React hook with TypeScript types, tests, and usage example
argument-hint: <hook-name> [description]
user-invocable: true
allowed-tools: Read Glob Edit
effort: low
---
## Generate Custom React Hook
Hook name: **use$1** (auto-prefix `use` if not present)
Description: **$2**
1. Check existing hooks:
```bash
ls src/hooks/ 2>/dev/null | head -10
```
Read 1-2 existing hooks to match style.
2. Generate the hook:
- Proper TypeScript generics if applicable
- Return type explicitly typed
- Cleanup in `useEffect` if subscriptions/listeners involved
- Error and loading states if async
- Stable callback references with `useCallback`
- Memoized values with `useMemo` where appropriate
3. Generate a test using `@testing-library/react-hooks` or `renderHook`.
4. Add a usage example comment at the top:
```ts
/**
* @example
* const { data, isLoading } = useMyHook(id)
*/
```
5. Place in `src/hooks/use$1.ts` (or match project convention).