Files
dotfiles/dot_agents/skills/tanstack-query-best-practices/rules/qk-hierarchical-organization.md
T
Prad Nukala 6406208b35 shell: fish functions -> ~/.local/bin executables + bash/zsh ports; manage ~/.agents
- 16 cross-shell utilities converted to sh/bash chezmoi executables:
  ai c2p cp-appid extract_agents fab gdc gh-sonr-org-migrate ghg-clone
  ghn gho git-summary launch_omp_livediff_overlay lc-elir mdcp mdp pj
  (ghg-clone not named ghg: unrelated cargo binary owns that name)
- cwd/history helpers stay per-shell: yy c cd clip-last + ghg/ghn/gho
  cd-wrappers in bash/functions/ and zsh/functions/, loaded by rc files
- fish keeps only shell-state functions; converted ones now hit PATH
- cp-appid ignore gating moved to .local/bin path
- dot_agents/skills: 82 skills materialized from dotstate storage so
  dot_claude skill symlinks resolve on fresh bootstrap; dotstate
  profile/symlinks.json released .agents/skills .bashrc .zshrc
2026-08-10 15:15:06 -04:00

77 lines
2.1 KiB
Markdown

# qk-hierarchical-organization: Organize Keys Hierarchically
## Priority: CRITICAL
## Explanation
Structure query keys from general to specific: entity type first, then ID, then modifiers/filters. This enables efficient invalidation at any level of specificity and creates predictable cache organization.
## Bad Example
```tsx
// Flat, inconsistent key structures
const { data: todos } = useQuery({
queryKey: ['all-todos-list'],
queryFn: fetchTodos,
})
const { data: todo } = useQuery({
queryKey: ['single-todo-5'],
queryFn: () => fetchTodo(5),
})
const { data: comments } = useQuery({
queryKey: ['todo-5-comments'],
queryFn: () => fetchTodoComments(5),
})
// Can't easily invalidate all todo-related queries
```
## Good Example
```tsx
// Hierarchical: entity → id → sub-resource → filters
const { data: todos } = useQuery({
queryKey: ['todos'],
queryFn: fetchTodos,
})
const { data: todo } = useQuery({
queryKey: ['todos', 5],
queryFn: () => fetchTodo(5),
})
const { data: comments } = useQuery({
queryKey: ['todos', 5, 'comments'],
queryFn: () => fetchTodoComments(5),
})
const { data: filteredTodos } = useQuery({
queryKey: ['todos', { status: 'done', page: 1 }],
queryFn: () => fetchTodos({ status: 'done', page: 1 }),
})
// Now we can invalidate at any level:
queryClient.invalidateQueries({ queryKey: ['todos'] }) // All todos
queryClient.invalidateQueries({ queryKey: ['todos', 5] }) // Todo 5 and its sub-resources
queryClient.invalidateQueries({ queryKey: ['todos', 5, 'comments'] }) // Just comments
```
## Recommended Hierarchy Pattern
```
['entity'] // List
['entity', id] // Single item
['entity', id, 'sub-resource'] // Related data
['entity', { filters }] // Filtered list
['entity', id, 'sub-resource', { filters }] // Filtered sub-resource
```
## Context
- Essential for applications with related data
- Enables efficient cache management
- Works with prefix-based invalidation
- Consider using query key factories (see `qk-factory-pattern`) for consistency