---
name: trace-it
description: |
Before modifying shared code (utilities, types, configs, base classes), traces
all callers and dependents first. Activates when editing files in shared/,
utils/, lib/, or anything imported by 3+ files. Prevents "fixed one thing,
broke three others."
allowed-tools: |
bash: grep, find, git
file: read
---
# Trace It
Shared code is high-leverage but high-risk. Change a utility function and you
might break 10 callers. Change a type definition and you invalidate assumptions
across the codebase. This skill forces you to trace impact before editing.
## When To Activate
- Editing files in: `utils/`, `lib/`, `shared/`, `common/`, `core/`
- Modifying exported functions, classes, or types
- Changing function signatures (parameters, return types)
- Editing config files or constants
- Renaming anything that might be imported elsewhere
- Modifying base classes or interfaces
- User says "change how X works" for foundational code
## Instructions
### Before Modifying Shared Code
## Step 1: Find All Callers
```bash
# Find imports/requires of this file
grep -r "from.*['\"].*filename" src/
grep -r "import.*filename" src/
grep -r "require.*filename" src/
# Find usages of specific function/class
grep -r "functionName" src/ --include="*.ts"
```
Document what you find:
```markdown
## Dependency Trace: [file or function name]
**Direct callers:** [count]
- `src/api/handler.ts:23` - uses for validation
- `src/services/user.ts:45` - uses for formatting
- `src/utils/helpers.ts:12` - re-exports it
**Indirect dependents:** [count]
- Files that import the direct callers
```
## Step 2: Assess Impact
For each caller, determine:
| Caller | How it uses this | Will change break it? |
|--------|------------------|----------------------|
| `handler.ts` | Calls `validate(input)` | Yes - signature changes |
| `user.ts` | Uses return value | No - return type same |
**Impact level:**
- **Low:** 1-2 callers, simple usages
- **Medium:** 3-5 callers, varied usages
- **High:** 6+ callers OR complex/varied usages
## Step 3: Plan the Change
For **Low impact:** Proceed, update callers inline.
For **Medium impact:**
1. Make change backward-compatible if possible
2. Update all callers in same commit
3. Test each caller's behavior
For **High impact:**
1. Consider: Is this change necessary?
2. Create migration plan
3. Consider deprecation period
4. Update incrementally with tests
### Signature Changes
When changing function signatures:
```markdown
## Signature Change
**Before:** `function process(data: string): Result`
**After:** `function process(data: string, options?: Options): Result`
**Breaking:** No (new param is optional)
**Callers to update:** 0 required, 5 could benefit
## OR
**Before:** `function process(data: string): Result`
**After:** `function process(data: ProcessInput): Result`
**Breaking:** Yes
**Callers to update:** 8 files
**Migration:** [list each file and required change]
```
## Output Format
```markdown
## Trace: [what you're changing]
**Callers found:** [count]
**Impact level:** [Low/Medium/High]
**Changes required:**
- [ ] `file1.ts:line` - [what needs updating]
- [ ] `file2.ts:line` - [what needs updating]
**Verified after change:**
- [ ] All callers updated
- [ ] No new type errors
- [ ] Tests pass
```
## NEVER
- Modify shared code without tracing callers first
- Change function signatures assuming "it's probably fine"
- Update shared code and only test one caller
- Forget to check re-exports (file A exports from file B)
- Assume grep found everything (check for dynamic imports)
## ALWAYS
- Trace before touching shared code
- Document the caller count and impact level
- Update ALL callers in the same change
- Verify no type errors after the change
- Check for string-based references (dynamic imports, configs)
## Example
**User:** "Rename the `formatDate` function to `formatDateTime`"
**Trace:**
```bash
grep -r "formatDate" src/
```
**Found:**
```
src/utils/date.ts:15 - definition
src/components/Header.tsx:8 - import
src/components/EventCard.tsx:12 - import
src/pages/Dashboard.tsx:45 - import
src/api/events.ts:23 - import
src/utils/index.ts:5 - re-export
```
**Impact:** 6 files reference this. High impact.
**Plan:**
1. Rename in `date.ts`
2. Update re-export in `utils/index.ts`
3. Update imports in all 4 consumer files
4. Verify: `grep -r "formatDate" src/` returns nothing
**After completion:**
> Renamed `formatDate` → `formatDateTime` across 6 files.
> Verified: no remaining references to old name.