hook

# Create Custom Hook Create a custom React hook following Darkroom conventions. The hook itself is stack-agnostic — what differs between satus and novus is the path alias. ## Step 1 — Detect stack Read `package.json`: - `dependencies.next` → satus / Next.js (path alias `@/`, no `lib/hooks/` requires `'use client'` boundary) - `dependencies["react-router"]` → novus / React Router (path alias `~/`, components isomorphic) ## Step 2 — Choose location | Stack | Hook path | |---|---| | satus | `lib/hooks/<name>.ts` | | novus | `hooks/<name>.ts` (novus puts `hooks/` at the project root) | Confirm by checking the existing `lib/hooks/` or `hooks/` directory structure if either pattern is unclear from package.json alone. ## Step 3 — Emit template ### satus / Next.js ```tsx // lib/hooks/<name>.ts 'use client' import { useState, useEffect } from 'react' interface Use<Name>Options { // Hook configuration options } interface Use<Name>Return { // Return type definition } export function use<Name>(options?: Use<Name>Options): Use<Name>Return { // Implementation return { // Return values } } ``` ### novus / React Router ```tsx // hooks/<name>.ts // No 'use client' — RR components are isomorphic; the hook runs wherever // it's called from. If the hook touches browser APIs, guard with // `typeof window !== 'undefined'` or call from inside `useEffect`. import { useState, useEffect } from 'react' interface Use<Name>Options { // Hook configuration options } interfac...